JavaScript 对象文字符号与普通函数和性能影响？

Question

假设我有这样的功能:

function foo() {

}

function bar() {

}

我可以把上面写成对象字面量符号:

var Baz = {
  foo: function() {
  },
 bar: function() {
 }
};

据我所知，在后一种情况下，无论是否调用任何 Baz 函数，脚本加载时都会创建一个 Baz 实例。在前一种情况下，函数对象仅在调用该函数时创建。我对这些假设是否正确？

如果我是正确的，那么在很少调用这些函数的应用程序中，前者将比后者具有更高的性能(更少的内存)。但后者的优势在于它提供了更大的模块化和更低的全局命名空间污染。

根据您的专业经验，您对此有何看法？有速度差异吗？

Answer 1

In the former case, function object is only created when that function is called.

不，无论如何都会创建函数。

请注意，您也可以这样做:

function foo() {
}

function bar() {
}

var Baz = {
  foo: foo,
  bar: bar
};

或者这个:

var Baz = (function() {
    function foo() {
    }

    function bar() {
    }

    return {
      foo: foo,
      bar: bar
    };
})();

将函数作为属性放在 Baz 上的主要目的是使它们在 Baz 上作为“方法”可用。这可能是为了方便，用于“命名空间”等。在您的第一种形式(以及我上面的第一种形式)中，如果该代码在全局范围内， foo 和 bar被添加到全局范围，它会很快变得非常拥挤(尤其是在浏览器上)。在您的第二个示例中，唯一的全局符号是 Baz 因为函数是匿名的。在我上面的最后一个例子中，唯一的全局符号是 Baz 但函数不是匿名的，它们有调试器和堆栈跟踪可以显示给你的名字(这是一个很好的东西; more here ).

就在函数创建时进行优化而言，它是这样工作的:当执行进入给定的上下文(全局上下文，或与调用函数相关的上下文)时，这些东西是完成:

1. 创建幕后执行上下文对象。
2. 为该执行上下文创建一个幕后变量对象。
3. 在函数上下文的情况下:
   1. arguments 的变量对象中添加了一个属性(可用于访问参数的类似数组的东西)
   2. 一个属性被添加到每个函数的命名参数的变量对象中，具有参数的值
   3. 如果函数有名称，则其名称作为变量对象的属性添加，并具有函数对象的值。
4. 在执行上下文中为每个用 var 声明的变量在变量对象上创建属性；它们的值最初是 undefined(不管 var 是否有初始化器)。
5. 处理上下文中的每个函数声明。 (函数表达式还没有被处理；更多关于下面的区别。)每个函数名称的变量对象的属性被创建并接收函数对象作为它的值。
6. 逐步代码执行开始。
   • 与所有表达式一样，函数表达式会在分步流程中遇到时进行计算。
   具有初始值设定项的
   • var 语句(例如，var a = 2;)被视为与赋值语句(a = 2;)完全相同;它的 var 方面很早就完成了。 (var 是 frequently misunderstood。例如，我们昨天有 this question。)

您会注意到函数声明 和函数表达式 之间的区别。您可以通过查看您是否将结果用作右手值来判断哪个是哪个 - 也就是说，您是否将结果分配给变量，将其用作右侧对象文字中的属性定义，或将其传递给函数。如果是，它就是一个函数表达式。如果不是，它是一个函数声明。

函数声明示例:

function foo() {
}

函数表达式示例:

var foo = function() {
};

另一个:

var Baz = {
    foo: function() { }
};

(foo 行是对象文字中的属性声明，它使用函数表达式作为值。)

命名函数表达式示例:

var f = function foo() {  // <== Don't do this (more below)
};

命名函数表达式应该是有效的，但它们在野外实现(尤其是 IE)的支持很差，所以现在必须避免使用它们。 More here .