Javascript：{} vs new Object（）性能

Question

我想理解为什么两者都做同样的事情会有什么不同？

Benchmark

Answer 1

{}的效果可以解释为：

1. {}是Javascript中对象的文字，文字的评估速度更快。
2. 作为额外的奖励，文字在代码中占用的空间更少，因此整体文件大小为
   小。
3. 文字代码的最终结果与新的Object（）代码相同，但几乎在所有浏览器中执行得更快（Firefox 3.5几乎没有显示差异）。
4. 随着对象属性和数组项的数量增加，使用文字的好处也越来越多。
由于Javascript中的范围管理机制，

对象文字{}的执行速度更快

执行JavaScript代码时，会创建执行上下文。执行上下文（有时也称为范围）定义了执行代码的环境。

在页面加载时创建全局执行上下文，并在执行函数时创建其他执行上下文，最终创建执行上下文堆栈，其中最顶层的上下文是活动上下文。

每个执行上下文都有一个与之关联的作用域链，用于标识符解析。范围链包含一个或多个变量对象，用于定义执行上下文的范围内标识符。

全局执行上下文在其作用域链中只有一个变量对象，该对象定义了JavaScript中可用的所有全局变量和函数。

当创建一个函数（但没有执行）时，它的内部[[Scope]]属性被赋值为包含创建它的执行上下文的作用域链（内部属性不能通过JavaScript访问，所以你不能直接访问此属性。）

稍后，当执行流入函数时，将创建激活对象并使用此值，参数，命名参数以及函数本地的任何变量对其进行初始化。激活对象首先出现在执行上下文的作用域链中，然后是函数[[Scope]]属性中包含的对象。

在代码执行期间，通过搜索执行上下文的范围链来解析变量和函数名称等标识符。

标识符解析从范围链的前面开始，然后向后移动。请考虑以下代码：

function Add(n1, n2) {
  this.n1 = n1;
  this.n2 = n2;
  this.val = this.n1 + this.n2;
}

var result = new Add(5, 10);

执行此代码时，add函数具有[[Scope]]属性，该属性仅包含全局变量对象。

当执行流入add函数时，会创建一个新的执行上下文，并将包含this，arguments，n1和n2的激活对象放入作用域链中。

下图中，“执行上下文和范围链的关系”说明了在执行add函数时发生的幕后对象关系。



在add函数内部，执行函数时需要解析标识符num1和num2。

通过检查作用域链中的每个对象来执行此解决方案，直到找到特定标识符。

搜索从作用域链中的第一个对象开始，该对象是包含该函数的局部变量的激活对象。

如果在那里找不到标识符，则检查作用域链中的下一个对象是否有标识符。找到标识符后，搜索将停止。

对于此示例，标识符num1和num2存在于本地激活对象中，因此搜索永远不会继续到全局对象。

了解JavaScript中的范围和范围链管理很重要，因为标识符解析性能与要在范围链中搜索的对象数直接相关。

范围链越远，标识符就越存在，搜索的时间越长，访问该变量所需的时间越长;如果范围未得到妥善管理，则会对脚本的执行时间产生负面影响。

Answer 2

如MDN

所述

  

您使用文字来表示JavaScript中的值。这些是您在脚本中提供的固定值，而不是变量。

因此，当您调用new Object()时，您调用函数来创建对象，但是当您使用文字时，您已经有了固定对象