Javascript:{} vs new Object()性能

Question

我想理解为什么两者都做同样的事情时性能上的差异？

基准

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中的范围和范围链管理很重要,因为标识符解析性能与要在范围链中搜索的对象数直接相关.

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