前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >记Javascript一道题的理解

记Javascript一道题的理解

作者头像
sam dragon
发布2018-01-17 11:21:44
5260
发布2018-01-17 11:21:44
举报
文章被收录于专栏:cnblogscnblogs

代码如下:

代码语言:javascript
复制
function Foo(){
    getName = function(){ console.log("1"); }
    return this;
}
Foo.getName = function(){
    console.log("2");
}
Foo.prototype.getName = function(){
    console.log("3");
}
var getName = function(){
    console.log("4");
}
function getName(){
    console.log("5");
}
Foo.getName(); //2
getName(); //4
Foo().getName(); //1
getName(); //1
new Foo.getName(); //2 => new (Foo.getName)() new无参数列表
new Foo().getName(); // 3 => (new Foo()).getName(); //new有参数列表
new new Foo().getName(); //3 => new ((new Foo()).getName)() //new有参数列表

Foo.getName()

输出结果为:2 原理:他调用的是Foo的静态方法(如果C#、java等后端语言来说),其实是因为Javascript中的Function本身就是Function和Object的结合,所以function既是函数,也是对象。在这里Foo就是执行了他对象上的一个function而已。

getName()

输出结果为:4 原理:可能你会想为什么不是5,function变量会提升到作用域的顶部,而var定义的则不会,所以var声明的覆盖掉function声明。所以结果为4

Foo().getName()

输出结果为:1 原理:Foo()是函数调用,Foo执行体中对getName进行了重新赋值(全局的getName,根据作用域链向上查找),返回的this为window(Foo执行时没有调用,默认为全局),然后.getName()调用了全局的getName(也就是被Foo执行体重写的getName),所以结果为:1

getName()

输出结果为:1 原理:因为Foo执行体中对全局getName重写了,这时调用的又是全局的getName。所以结果为:1

new Foo.getName()

输出结果为:2 原理:

  • 由于new无参,与new有参的运算优化级一样。new有参的与.运算符同一级别,而new无参的低一个级别。所以会先执行.运算符选择到Foo的静态方法getName
  • 然后执行new,获得的是Foo.getName的一个实例。所以输出结果为:2

new Foo().getName()

输出结果为:3

原理:

  • 由于new是有参的,与.运算符同级,按照从左向右的执行顺序,先执行new Foo()。
  • new Foo()是需要值得我们的注意,因为他有一个返回值。存在返回值分为两种情况:
    • 无返回与返回为基本类型是一样的效果:返回都是实例对象(也就是当前的this)
    • 返回为引用类型:返回的为这个引用类型的对象,此时实例对象被替换了(也就是当前的this没有返回)。因数new Foo()返回是实例对象
  • .getName():选择是上一步实例的此方法,所以输出结果为:3

new new Foo().getName()

输出结果为:3 原理:主要是运算符优先级的考查,实例开发中应该不会这样直接的用到。首先new有参,然后.getName(.运算符)(为什么是.运算符,这是因为new无参级别低一个档次),再则new有参。

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2017-05-02 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 代码如下:
    • Foo.getName()
      • getName()
        • Foo().getName()
          • getName()
            • new Foo.getName()
              • new Foo().getName()
                • new new Foo().getName()
                领券
                问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档