JavaScript 中，new 的构造函数后面加括号与不加括号的区别

最新推荐文章于 2022-11-06 22:16:00 发布

weixin_30835933

最新推荐文章于 2022-11-06 22:16:00 发布

阅读量352

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/xwant/p/7752658.html

本文探讨了JavaScript中new运算符与属性访问的结合使用，解析了不同语法结构下的执行顺序与运算符优先级问题，并通过具体示例加深理解。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先有这么样一段代码：

    function Fn() {
        this.age = 1;
    }
    var a = new Fn;
    var b = new Fn();

a 和 b 的的结果都是一样的，是一个实例，都有一个 age 属性，那如果在声明的时候就去调用这个属性呢？

    function Fn() {
        this.age = 1;
    }
    var a = new Fn.age;     // 报错
    var b = new Fn().age;   // 1

那是为什么呢，究其原因是运算符优先级的问题，new 的运算优先级要小于 . 的运算优先级，所以：

    new Fn.age 拆分：
    var a = Fn.age
    var b = new a

因为并不是先执行 new Fn 再属性访问的，所以那显然 b 并不是一个构造函数，所以就会报一个 Fn.age 不是一个构造函数的错误。但是如果后面加了一个括号：

    new Fn().age 拆分：
    var a = new Fn
    var b = a.age

那就是先执行 new ，再从 new 生成的实例中访问 age 这个属性。运算符优先级详细请参考：

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Operator_Precedence

现在额外扩展一下，把 Fn 改改：

    function Fn() {
        this.age = 1;
    }
    Fn.age = function () {
        this.age = 10
    }
    var a = new Fn.age;           // 实例
    var b = new Fn.age().age;     // 10
    var c = new Fn().age;         // 1

相信经过这么改造的一个过程，对这个的执行顺序就能有一个小透彻的理解了。

所以这里个人理解，在 new 的时候后面的括号不是执行的意思，是将这一块的优先级提升上去了.

具体的理解也可以参考 ECMA2015 的规范，对这一块还没有研究透，后续有收获的话会随时补充。

转载于:https://www.cnblogs.com/xwant/p/7752658.html