JavaScript对象字面量长度=== undefined？

Question

我正在处理这个动画函数，但是我遇到了一个问题。我似乎无法执行应该很容易的任务，即无法获取对象的长度。如果你查看那个jsFiddle，你会发现我在运行alert(properties.length);，但它返回undefined。有人能看出为什么吗？

- Olical

---

可能是Javascript关联数组的长度的重复。 - ripper234

Answer 1

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

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

- Jamund Ferguson

---

不支持IE8，https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/keys#Browser_compatibility - Igor Parra

Answer 2

JavaScript对象并没有length属性，只有数组才有。如果你想知道一个对象上定义的属性数量，你必须遍历它们并计数。

另外，你的for 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);
    }
    ....
 }

- Ivo Wetzel

---

不，我只是厌倦了充斥着JavaScript代码的网络，这些代码远远没有被优化到足以让Chrome顺畅运行的程度。但话说回来，我应该感激，因为我通过清理别人制造的混乱来赚钱 :P - Martin Jespersen

@Martin 那你就再也不要使用jQuery了，因为它里面充满了对hasOwnProperty的调用。你现在所做的是过早优化，除此之外别无他意。 - Ivo Wetzel

@Wolfy，我只是想指出一个可能的错误，当其他代码（无论是你自己在两周内编写的还是你在页面上使用的另一个脚本）扩展原型时，properties 对象中会出现奇怪的问题。 - Ivo Wetzel

@Wofly 你需要将 p 传递到动画包装器中，就像 i 和 element 一样，因为 for in 循环否则会覆盖 p。 - Ivo Wetzel

当然可以！因为我有嵌套函数。谢谢你的帮助！ - Olical

Answer 3

如果你在使用Underscore.js，你可以使用_.size()：

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

- Casey

---

我还没有看到源代码，但我希望 size() 能够考虑 hasOwnProperty。 - RaphaelDDL

Answer 4

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

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

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

- Martin Jespersen

---

请使用hasOwnProperty方法。 - Ivo Wetzel

为什么，如何？hasOwnProperty适用于这个地方吗？ - Olical

不更新 Object.prototype 更好吗？谁会这么做呢？这实际上是一个很好的例子！ - Jamund Ferguson

@IvoWetzel 能否提供一个示例？我在这里使用了Martin Jespersen的答案http://jsfiddle.net/jeykeu/qAH48/这是正确的方法吗？ - Junaid Qadir Shekhanzai

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;
}

- Michael McGinnis