如何获取Javascript对象的所有属性值(不知道密钥)？

Question

如果有Javascript对象:

var objects={...};

假设,它有超过50个属性,不知道属性名称(不知道'键')如何在循环中获取每个属性值？

Answer 1

根据您必须支持的浏览器,可以通过多种方式完成此操作.绝大多数浏览器都支持ECMAScript 5(ES5),但要注意下面的许多示例都使用Object.keys,这在IE <9中不可用.请参阅兼容性表.

ECMAScript 3+

如果您必须支持旧版本的IE,那么这是您的选择:

for (var key in obj) {
    if (Object.prototype.hasOwnProperty.call(obj, key)) {
        var val = obj[key];
        // use val
    }
}

嵌套if确保您不会枚举对象原型链中的属性(这是您几乎肯定想要的行为).你必须使用

Object.prototype.hasOwnProperty.call(obj, key) // ok

而不是

obj.hasOwnProperty(key) // bad

因为ECMAScript 5+允许您使用创建无原型对象Object.create(null),并且这些对象将不具有该hasOwnProperty方法.顽皮的代码也可能产生覆盖该hasOwnProperty方法的对象.

ECMAScript 5+

您可以在任何支持ECMAScript 5及更高版本的浏览器中使用这些方法.这些从对象获取值并避免枚举原型链.obj你的对象在哪里:

var keys = Object.keys(obj);

for (var i = 0; i < keys.length; i++) {
    var val = obj[keys[i]];
    // use val
}

如果你想要一些更紧凑的东西,或者你想要小心循环中的函数,那么Array.prototype.forEach你的朋友是:

Object.keys(obj).forEach(function (key) {
    var val = obj[key];
    // use val
});

下一个方法构建一个包含对象值的数组.这很方便循环.

var vals = Object.keys(obj).map(function (key) {
    return obj[key];
});

// use vals array

如果你想使那些使用Object.keys安全的null(按原样for-in),那么你可以做Object.keys(obj || {})....

Object.keys返回可枚举的属性.对于迭代简单对象,这通常就足够了.如果您有需要使用的不可枚举属性的东西,您可以使用Object.getOwnPropertyNames它代替Object.keys.

ECMAScript 2015+(AKA ES6)

使用ECMAScript 2015可以更容易地迭代数组.在循环中逐个处理值时,可以使用此优势:

for (const key of Object.keys(obj)) {
    const val = obj[key];
    // use val
}

使用ECMAScript 2015 fat-arrow函数,将对象映射到值数组成为一个单行:

const vals = Object.keys(obj).map(key => obj[key]);

// use vals array

ECMAScript 2015介绍Symbol了其中的实例可以用作属性名称.要获取要枚举的对象的符号,请使用Object.getOwnPropertySymbols(此函数是Symbol 不能用于创建私有属性的原因).Reflect来自ECMAScript 2015 的新API提供了Reflect.ownKeys返回属性名称(包括不可枚举的)和符号的列表.

数组理解(不要尝试使用)

在发布之前,已从 ECMAScript 6 中删除了数组解析.在删除之前,解决方案看起来像:

const vals = [for (key of Object.keys(obj)) obj[key]];

// use vals array

ECMAScript 2017+

ECMAScript 2016添加了不影响此主题的功能.ECMAScript 2017规范增加了Object.values和Object.entries.两个返回数组(对于某些类比而言,这将是令人惊讶的Array.entries).Object.values可以按原样使用,也可以for-of循环使用.

const values = Object.values(obj);

// use values array or:

for (const val of Object.values(obj)) {
    // use val
}

如果你想同时使用键和值,那么Object.entries适合你.它产生一个充满[key, value]对的数组.您可以在for-of循环中使用它,或者(请注意ECMAScript 2015解构分配):

for (const [key, val] of Object.entries(obj)) {
    // use key and val
}

Object.values 垫片

最后,正如评论和teh_senaus在另一个答案中所指出的那样,使用其中一个作为垫片可能是值得的.别担心,以下内容并没有改变原型,它只是添加了一种方法Object(危险性要小得多).使用fat-arrow函数,也可以在一行中完成:

Object.values = obj => Object.keys(obj).map(key => obj[key]);

你现在可以使用它

// ['one', 'two', 'three']
var values = Object.values({ a: 'one', b: 'two', c: 'three' });

如果您想在本机Object.values存在时避免填充,则可以执行以下操作:

Object.values = Object.values || (obj => Object.keys(obj).map(key => obj[key]));

最后...

请注意您需要支持的浏览器/版本.在实现方法或语言功能的地方,上述内容是正确的.例如,默认情况下,在V8中默认关闭对ECMAScript 2015的支持,直到最近才支持Chrome浏览器.在您打算支持的浏览器实现您需要的功能之前,应避免使用ECMAScript 2015中的功能.如果您使用babel将代码编译为ECMAScript 5,那么您可以访问此答案中的所有功能.

Answer 2

通过使用一个简单的for..in循环:

for(var key in objects) {
    var value = objects[key];
}

Answer 3

这是一个可重用的函数,用于将值转换为数组.它也需要考虑原型.

Object.values = function (obj) {
    var vals = [];
    for( var key in obj ) {
        if ( obj.hasOwnProperty(key) ) {
            vals.push(obj[key]);
        }
    }
    return vals;
}

Answer 4

如果您可以访问Underscore.js,则可以使用如下_.values函数:

_.values({one : 1, two : 2, three : 3}); // return [1, 2, 3]

Answer 5

如果你真的想要一个值数组,我发现这比使用for ... in循环构建一个数组更干净.

ECMA 5.1+

function values(o) { return Object.keys(o).map(function(k){return o[k]}) }

值得注意的是,在大多数情况下,您并不真正需要一组值,执行此操作会更快:

for(var k in o) something(o[k]);

这将迭代Object o的键.在每次迭代中,k被设置为o的键.

Answer 6

ES5 Object.keys

var a = { a: 1, b: 2, c: 3 };
Object.keys(a).map(function(key){ return a[key] });
// result: [1,2,3]

Answer 7

const myObj = { a:1, b:2, c:3 }

获取所有值：

• 最短路线：

  • const myValues = Object.values(myObj)

• const myValues = Object.keys(myObj).map(key => myObj[key])

Answer 8

你可以循环键:

foo = {one:1, two:2, three:3};
for (key in foo){
    console.log("foo["+ key +"]="+ foo[key]);
}

将输出:

foo[one]=1
foo[two]=2
foo[three]=3

Answer 9

ECMA2017 起：

Object.values(obj) 将以数组的形式获取所有属性值。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_objects/Object/values

Answer 10

该问题没有指定是否也需要继承和不可枚举的属性。

存在一个问题，即获取 Google 无法轻松找到的所有内容，包括继承属性和不可枚举属性。

如果我们要获取所有继承的和不可枚举的属性，我的解决方案是：

function getAllPropertyNames(obj) {
    let result = new Set();
    while (obj) {
        Object.getOwnPropertyNames(obj).forEach(p => result.add(p));
        obj = Object.getPrototypeOf(obj);
    }
    return [...result];
}

然后迭代它们，只需使用 for-of 循​​环：

function getAllPropertyNames(obj) {
    let result = new Set();
    while (obj) {
        Object.getOwnPropertyNames(obj).forEach(p => result.add(p));
        obj = Object.getPrototypeOf(obj);
    }
    return [...result];
}