Foo.getName所涉及到的知识点

先看看题目代码：

function Foo() { getName = function () { alert(1); } return this; } Foo.getName = function () { alert(2); } Foo.prototype.getName = function () { alert(3); } var getName = function () { alert(4); } function getName() { alert(5); } Foo.getName(); //2 getName(); //4 Foo().getName(); //1 getName(); //1 new Foo.getName(); //2 new Foo().getName() //3 new new Foo().getName() //3
所涉及到知识点很多，this全局指向，变量表达式与变量声明提升优先、原型链，new运算符优先级等。。

1、先看懂代码：

//创建了foo()方法，里面有全局变量并赋值为一个方法，
//return this，目前this指向全局
function Foo() {getName = function () {alert(1);}return this;
}
//写一个Foo的静态方法，
Foo.getName = function () {alert(2);
}
//给Foo的原型创建一个getName方法，当创建一个Foo实例时，
//如果Foo没有定义getName方法就会去原型对象中找
Foo.prototype.getName = function () {alert(3);
}
//创建一个变量，赋值一个函数，
//相当于var getName,getName=function(){...}
var getName = function () {alert(4);
}
//创建一个全局方法，命名为getName()方法
function getName() {alert(5);
}

2、上面的注释说了代码是干嘛的了，现在看看运行的代码：
（1）Foo.getName(); Foo中的静态方法 //2
（2）getName();调用全局中的getName(),全局getName()提升的比var getName高，而var getName 与全局getName()方法重名，则会覆盖掉全局的getName()方法，所以后面调用的是var getName //4
（3）Foo().getName();运行的是Foo()，Foo()中有个全局变量，又是个getName(),运行Foo会覆盖之前全局的getName(),而Foo()中return this,指向了全局。//1
（4）getName();此刻的全局方法是Foo()中的getName()，//1
（5）此刻就是运算符优先级的问题了。大家可以看下new .()\优先级问题
优先级（高>低）：()> new … ( … )>.>new …
看new Foo.getName()，new是没有带参数，那么先执行Foo.getName(),静态方法 //2,之后再创建Foo实例,此刻的new Foo.getName跟Foo.getName没什么区别。
（6）new Foo().getName() ，会先创建一个Foo()实例，再调用Foo()中的getName()方法，Foo()中没有去原型中找。 //3
（7）new new Foo().getName() 与new Foo.getName()相似。多一个new跟之前的没什么区别。 //3

js中的经典题Foo.getName相关推荐

JS经典面试题04-原型链Foo.getName
1.1-答案揭晓 1.2-原理解析 <!DOCTYPE html> <html lang="en"><head><meta charset ...
【JS中循环嵌套常见的六大经典例题+六大图形题，你知道哪几个？】
首先,了解一下循环嵌套的特点:外层循环转一次,内层循环转一圈. 在上一篇随笔中详细介绍了JS中的分支结构和循环结构,我们来简单的回顾一下For循环结构: 1.for循环有三个表达式,分别为: ①定义循 ...
new Foo().getName()经典面试题
一道经典的面试题,下面用a b c d 标注方便讲解 <!DOCTYPE html> <html lang="en"> <head><me ...
js面试题Foo.getName()的故事
首先声明下:此题是本人面试时笔试题中的一道,回来一搜居然雷同,纯属偶然,特写此篇来整理一下思绪... 原题: function Foo() {getName = function () { conso ...
开篇第一题：经典中的经典！
开篇第一题:经典中的经典! --评<编程之美> 原贴地址:http://www.douban.com/review/2130819/ 应该 ...
后处理程序文件大小的变量_【每日一题】(17题)面试官问：JS中事件流，事件处理程序，事件对象的理解？...
关注「松宝写代码」,精选好文,每日一题作者:saucxs | songEagle 2020,实「鼠」不易 2021,「牛」转乾坤风劲潮涌当扬帆,任重道远须奋蹄! 一.前言 2020.12.23 立 ...
js自动触发onclick_每日一题JS中最基本的this情况分析
关注"前端学苑" ,坚持每天进步一点点「~this情况分析 ~」每日一题,希望让爱学习.思考的前端技术伙伴在一起学习.复盘.成长. 基础知识要夯实,原理源码要深入,深度广度要扩 ...
前端百题斩【006】——js中三类字符串转数字的方式
写该系列文章的初衷是"让每位前端工程师掌握高频知识点,为工作助力".这是前端百题斩的第6斩,希望朋友们关注公众号"执鸢者",用知识武装自己的头脑. js中字符串 ...
vue.js中经典扫雷游戏的实现
可视化 (vue-defuse) An implementation of the classical minesweeper game in vue.js. vue.js中经典扫雷游戏的实现. Vi ...

js中的经典题Foo.getName

js中的经典题Foo.getName

Foo.getName所涉及到的知识点

先看看题目代码：

js中的经典题Foo.getName相关推荐

最新文章

热门文章