Question

我再一次在互联网上找到了包含内联函数的JavaScript代码，在我看来，常规语句同样有意义。这是第一个样本：

function outerHTML(node){
  // if IE, Chrome take the internal method otherwise build one
  return node.outerHTML || (
         function(n) {
           var div = document.createElement('div'), h;
           div.appendChild(n.cloneNode(true));
           h = div.innerHTML;
           div = null;
           return h;
         })(node);
}

如果您要求我编写相同的代码，它将如下所示：

function outerHTML(node){
  var div, h;

  // if IE, Chrome take the internal method otherwise build one
  if (node.outerHTML) {
    return node.outerHTML;
  }

  div = document.createElement('div')
  div.appendChild(node.cloneNode(true));
  h = div.innerHTML;
  div = null;

  return h;
}

编辑：作为OverZealous stated，这个逻辑存在差异。我把它留在这里，所以没有人对这个答案感到困惑。

也许是另一个原始样本（是的，这不是“编译”，因为它只是一个代码片段）：

addGetters: function (attributes) {
  var that = this;
  function addGetter(attr) {
    that.prototype["get" + attr.capitalize()] = function() { return this[attr]; };
  }

  for(var i = 0; i < attributes.length; i++) {
    var attr = attributes[i];
    addGetter(attr);
  }
},

与我的尝试相比

addGetters: function (attributes) {
  for(var i = 0; i < attributes.length; i++) {
    var attr = attributes[i];
    this.prototype["get" + attr.capitalize()] = function() { return this[attr]; };
  }
},

有区别吗？原始版本是否会占用更多空间，因为需要创建一个函数和/或它是否因此而变慢？是否存在内存泄漏？

CPU和内存的使用非常重要，因为我在一个两者都有限且任何“少”都很好的环境中进行编码。由于JavaScript中没有sizeof()，并且其实现尝试不能安全地解释任何提前思考 - 修复很重要。

请注意，就“我的版本”而言，我没有测试它。我只是想解释一下我想问的问题。

编辑：即使这个问题有答案，我仍然想知道内存利用率。如果有人有一些见解，请不要犹豫，在这里添加。

Answer 1

对于第一个，我不相信这个功能有任何理由。它可能（d）通过微小的变化演变成那种状态，但额外的函数包装器并没有提供我能看到的任何好处。

然而，第二个示例实际上对使用函数包装器至关重要。原因在于JavaScript的功能级范围（有时令人沮丧）。在您的示例中，只有一个attr变量。它在不同的属性中共享。这意味着，最后，每个属性都将返回数组中最后一个属性的值。

e.g：

var attrs = ['foo', 'bar', 'baz']
obj.addGetters(attrs);

obj.getFoo(); // returns obj.baz
obj.getBar(); // returns obj.baz

通过将getter创建包装在函数中，可以消除该问题，因为attr最终被限定为创建函数。这就是为什么Douglas Crockford的JSLint说＆＃34;不要在循环中创建一个函数＆＃34; 。它会导致像那样的意外错误。

Answer 2

作为OverZealous pointed out，需要确定正在发生的逻辑。为此+1。

就性能而言，我终于有时间自己做一些测试了。但是，我正在一个我无法真正检查内存利用率的环境中工作。所以我试图愚弄表演。

结果是它可能会产生影响，具体取决于此功能的使用频率。在我的目标系统上，简单地创建一个几乎没有任何东西的内联函数，例如

myArray.each(function inlineFunc(el) { return el; });

对于这样一个函数的10,000次创建，

需要大约1.8秒（在上面的例子中myArray没有元素）。相比之下，该浏览器的PC版需要1,000,000次迭代才能达到接近的水平（显然这也取决于硬件）。

由于在我们使用的代码中达到了10,000次迭代（不是直接在一个循环中，而是在整个代码中创建函数），我们将在我们的转包商中找到一个单词。

Answer 3

答案在于旁观者的眼睛这是一个偏好问题如果你将“speed”置于模块化之上，这取决于你问问自己：为什么在使用for时可以使用while？事实证明，在某些情况下while结构更快一些。

JavaScript：内联函数与常规语句

3 个答案: