为什么新的 javascript 数组有“未定义”条目？

下面是一个示例，演示了一个数组，当您填充该数组时，它也会获取其中所有类型的未定义条目。

这是在 firefox 19.0/firebug 上发生的，不确定在其他浏览器上是否也会发生。

基本流程：

1. 对象已初始化（最底层）
2. 它调用“负载”
3. 当ajax加载返回时，data.objects包含一个json对象数组。该数组上没有未定义的条目。
4. setObjects 被调用，其中来自 ajax 调用的所有对象都被复制到 this.objects。
5. 当它们被复制时我可以看到不明确的条目显示在 firebug 中，如果我没有再次传递数组并拼接出未定义的条目，那么在尝试访问模板中数组的元素时，它会破坏胡子。

为什么 javascript 会自动填充 this.objects 数组不明确的条目？

这是代码：

function MailerFromProfile( )
{
    // privileged
    this.objects = [];
    this.load( );
}

MailerFromProfile.prototype.setObjects = function( objects )
{
    for( var i in objects )
    {
        if( 'undefined' !== objects[ i ] )
        {
            this.objects[ objects[ i ].id ] = objects[ i ];
        }
    }
    // I should not have to do this:
    for( var i = 0; i < this.objects.length; i++ )
    {
        if( typeof this.objects[ i ] === 'undefined' )
        {
            this.objects.splice( i, 1 );
            i--;
        }
    }
}

MailerFromProfile.prototype.setTemplate = function( n, v )
{
    this.template[ n ] = v;
}

MailerFromProfile.prototype.load = function( )
{
    jQuery.post(
        MAILER_PATH,
        { session: MAILER_SESSION,
          object : 'from_profile',
          action : 'list'
        },
        function( data )
        {
            if( typeof data.objects !== 'undefined' )
            {
                g_mailer_from_profiles.setObjects( data.objects );
            }
        },
        'json' );
}

var g_mailer_from_profiles = new MailerFromProfile( );

为什么 javascript 会自动用未定义的条目填充 this.objects 数组？

事实并非如此，但看起来可能是这样。 :-)

关键是您要像这样设置数组条目：

this.objects[ objects[ i ].id ] = objects[ i ];

……显然，objects[ i ].id有时大于数组中的条目数。

标准 JavaScript 数组根本不是一个真正的数组 http://blog.niftysnippets.org/2011/01/myth-of-arrays.html（除非由 JavaScript 引擎优化），1 它是一个对一些事情进行特殊处理的对象。

让我们举一个更简单的例子：

var a = [];            // An empty array
console.log(a.length); // 0
a[3] = "foo";          // Puts an entry at index 3
console.log(a.length); // 4

正如您所看到的，如果您写入超出数组末尾的数组条目，则length数组的索引被调整为比您写入的索引高1。

但是 JavaScript 不会用以下命令“填充”数组undefined;该数组是sparse https://en.wikipedia.org/wiki/Sparse_matrix。条目位于a[0], a[1], and a[2] 不存在:

console.log(1 in a);   // false

但是如果你向数组询问不存在的条目，你会得到undefined:

console.log(a[1]);     // undefined

...就像您在请求不存在的属性时对任何其他 JavaScript 对象所做的那样（因为数组“元素”实际上是对象属性，而数组“索引”实际上是属性名称）。

That's 不同的来自实际存在的具有该值的条目undefined，这也是可能的：

a[1] = undefined;
console.log(1 in a);   // true
console.log(a[1]);     // undefined

所以 Mustache 正在循环遍历数组0 to length - 1并询问条目，其中一些条目不存在，导致undefined.

这是上面各种代码片段的可运行版本：

var a = [];            // An empty array
console.log(a.length); // 0
a[3] = "foo";          // Puts an entry at index 3
console.log(a.length); // 4

console.log(1 in a);   // false

console.log(a[1]);     // undefined

a[1] = undefined;
console.log(1 in a);   // true
console.log(a[1]);     // undefined

这是一个很长的说法，您可能需要将该行更改为：

this.objects.push(objects[ i ]);

1 这是我乏味的旧博客上的一篇文章。