JavaScript 对象字面量长度 === 未定义？

Question

我正在研究这个动画功能，但我有一个问题。我似乎无法执行应该是一项简单的任务，我无法获得对象的长度。如果您检查 jsFiddle，您可以看到我正在运行 alert(properties.length); 并且它返回 undefined。谁能明白为什么会这样吗？

Answer 1

这在 Node.js 和较新的环境中受支持。

var obj = {a: "a", b: "b"};
Object.keys(obj).length // 2

Answer 2

JavaScript 对象不没有length 属性，只有Arrays 有。如果您想知道对象上定义的属性数量，则必须迭代它们并对它们进行计数。

此外，由于 Object.prototype 的扩展，您的 for in 循环很容易出现错误，因为 in 将遍历完整的原型链并枚举链上的所有属性。

示例

// Poisoning Object.prototype
Object.prototype.bar = 1;

var foo = {moo: 2};
for(var i in foo) {
    console.log(i); // logs both 'moo' AND 'bar'
}

您必须使用hasOwnProperty 对象上的方法以过滤掉那些不需要的属性。

// still the foo from above
for(var i in foo) {
    if (foo.hasOwnProperty(i)) {
        console.log(i); // only logs 'moo'
    }
}

许多 JavaScript 框架都扩展了原型，不使用 hasOwnProperty 通常会导致可怕的错误。

更新

关于您的代码不是动画这两个属性的实际问题。

for(var p in properties) {
    ...
    for(var i = 0; i <= frames; i++)
    {
        setTimeout((function(exti, element) {
            return function() {

                // p gets overriden by for outer for in loop
                element.style[p] = original + (pixels * exti) + 'px';
            }

        // you need to pass in a copy of the value of p here
        // just like you do with i and element
        })(i, element), i * (1000 / 60), element);
    }
    ....
 }

Answer 3

如果您使用 Underscore.js，则可以使用 _.size() :

_.size({one : 1, two : 2, three : 3});
=> 3

Answer 4

对象没有长度，如果需要，您需要使用数组。

如果您必须查找对象中属性的数量，只有一种方法：

var length =0;
for(var i in obj) length++;

Answer 5

这是@Junaid Qadir Shekhanzai 的“查找对象的长度”的通用函数（正如我们所说，应该正确地称为“计算对象的属性”）。它结合了 @Ivo Wetzel 和 @Martin Jespersen 的解决方案：

function countProperties(myObj){
    var length = 0;
    if(typeof myObj != 'object'){
        return false;
    }
    for(var i in myObj) {
    length++;
    }
    return length;
}