javascript - 从 .split() 生成的 Google Chrome 混乱数组答案

【问题标题】：javascript - Google Chrome cluttering Array generated from .split()javascript - 从 .split() 生成的 Google Chrome 混乱数组
【发布时间】：2011-02-24 06:31:17
【问题描述】：

给定以下字符串：

var str = "one,two,three";

如果我用逗号分割字符串，我通常会得到一个数组，正如预期的那样：

var arr = str.split(/\s*,\s*/);

问题在于，在 Google Chrome（Mac 版）中，它会将额外的属性附加到数组中。

Chrome 调试器的输出：

arr: Array
    0: one
    1: two
    2: three
    constructor: function Array()
    index: undefined
    input: undefined
    length: 3

因此，如果我使用 for/in 循环遍历数组，它会遍历新属性。特别是 input 和 index 属性。使用 hasOwnProperty 似乎没有帮助。

解决方法是根据数组的长度执行for 循环。我仍然想知道是否有人了解 Chrome 为何会这样。 Firefox 和 Safari 没有这个问题。

【问题讨论】：

@KennyTM：为什么不str.split(',');？
很明显 patrick 这样做是为了从结果数组中的项目中删除空白填充。
@Peter：确实，我的评论是针对 KennyTM 的，因为我不知道为什么你会使用正则表达式来仅以逗号分隔。
所以听起来for/in 在数组上很糟糕。取点。仍然好奇为什么 Chrome 会尝试迭代 input 和 index。或者他们为什么会在那里。

标签： javascript arrays properties google-chrome split

【解决方案1】：

我假设在这里使用正则表达式会产生一个类似数组的对象，很像 RegExp.exec() 的执行结果。

我无法在 Chrome/Win7 上重现该错误，但我建议使用 Array.prototype.slice.call(arr) 魔法。它以完美地将类数组转换为真实数组而闻名。

【讨论】：

【解决方案2】：

不要使用for...in 循环遍历数组！！这是 Javascript (plug) 的众多缺陷之一 - for...in 循环仅用于迭代对象属性。

改用普通的 for 循环。

for (var i=0, max = arr.length; i < max; i++) { ... }

Firefox 和 Safari 的 ECMAScript/Javascript 引擎使这些特定属性不可枚举（{DontEnum} 属性），因此它们不会在for...in 循环中被迭代。尽管如此，for...in 循环并不打算遍历数组索引。

【讨论】：

你忘了使用你定义的最大变量；）
@Gaby：是的，我刚刚意识到自己哈哈。这是漫长的一天:-)
您的编辑似乎是关键。由于某种原因，Chrome 不会使这些属性不可枚举。我会坚持使用基于长度的循环。

【解决方案3】：

与这个特定问题没有直接关系，但请注意，使用正则表达式拆分字符串会带来各种跨浏览器问题。有关更多信息和解决方案，请参阅 http://blog.stevenlevithan.com/archives/cross-browser-split。

【讨论】：

感谢您的链接，Pointy。 :)

【解决方案4】：

For..in 用于迭代对象的可枚举属性。对于数组，要遍历其索引，只需使用标准 for 循环

for ( var i = 0, l = arr.length, i < l; i++ )
{
  // do whatever with arr[i];
}

【讨论】：

【解决方案5】：

通常不建议使用 for/in 循环遍历数组。首先，无法保证迭代的顺序，此外，您可能会遇到与您遇到的问题类似的风险。最好使用传统的 for 循环。

【讨论】：