如果有Javascript对象:
var objects={...};
假设它有超过50个属性,不知道属性名称(不知道'键')如何在循环中获取每个属性值?
答案 0 :(得分:962)
根据您必须支持的浏览器,可以通过多种方式完成此操作。绝大多数浏览器都支持ECMAScript 5(ES5),但要注意下面的许多示例使用Object.keys
,这在IE< 1>中是不可用的。 9.参见compatibility table。
如果您必须支持旧版本的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及更高版本的浏览器中使用这些方法。这些从对象获取值并避免枚举原型链。 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可以更轻松地进行数组迭代。在循环中逐个处理值时,可以使用此优势:
for (const key of Object.keys(obj)) {
const val = obj[key];
// use val
}
使用ECMAScript 2015胖箭头函数,将对象映射到值数组会变成一个单行:
const vals = Object.keys(obj).map(key => obj[key]);
// use vals array
ECMAScript 2015引入了Symbol
,其实例可以用作属性名称。要获取要枚举的对象的符号,请使用Object.getOwnPropertySymbols
(此函数是Symbol
不能用于创建私有属性的原因)。 ECMAScript 2015中的新Reflect
API提供了Reflect.ownKeys
,它返回属性名称列表(包括不可枚举的名称)和符号。
在发布之前,ECMAScript 6中的已删除 。在删除之前,解决方案看起来像:
const vals = [for (key of Object.keys(obj)) obj[key]];
// use vals array
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
shim 最后,正如评论和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,则可以访问此答案中的所有功能。
答案 1 :(得分:415)
使用简单的for..in
循环:
for(var key in objects) {
var value = objects[key];
}
答案 2 :(得分:30)
这是一个可重用的函数,用于将值放入数组中。它也需要考虑原型。
Object.values = function (obj) {
var vals = [];
for( var key in obj ) {
if ( obj.hasOwnProperty(key) ) {
vals.push(obj[key]);
}
}
return vals;
}
答案 3 :(得分:28)
如果您有权访问Underscore.js,可以像这样使用_.values
函数:
_.values({one : 1, two : 2, three : 3}); // return [1, 2, 3]
答案 4 :(得分:14)
如果你真的想要一个值数组,我发现这比使用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的密钥。
答案 5 :(得分:8)
ES5 Object.keys
var a = { a: 1, b: 2, c: 3 };
Object.keys(a).map(function(key){ return a[key] });
// result: [1,2,3]
答案 6 :(得分:5)
您可以循环键入:
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
答案 7 :(得分:3)
对于那些早期适应CofeeScript时代的人来说,这里有另一个等价物。
val for key,val of objects
这可能比这更好,因为objects
可以减少再次输入并降低可读性。
objects[key] for key of objects
答案 8 :(得分:3)
使用像:
这样的polyfillif(!Object.values){Object.values=obj=>Object.keys(obj).map(key=>obj[key])}
然后使用
Object.values(my_object)
3)利润!
答案 9 :(得分:3)
该问题未指定是否还需要继承和不可枚举的属性。
有a question for getting everything, inherited properties and non-enumerable properties also,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];
}
let obj = {
abc: 123,
xyz: 1.234,
foobar: "hello"
};
for (p of getAllPropertyNames(obj)) console.log(p);
答案 10 :(得分:2)
显然 - 正如我最近所了解的 - 这是最快的方法:
var objs = {...};
var objKeys = Object.keys(obj);
for (var i = 0, objLen = objKeys.length; i < objLen; i++) {
// do whatever in here
var obj = objs[objKeys[i]];
}
答案 11 :(得分:2)
从ECMA2017开始:
Object.values(obj)
将以数组的形式获取所有属性值。
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_objects/Object/values
答案 12 :(得分:1)
使用:Object.values()
,我们传入一个对象作为参数,并接收一个值数组作为返回值。
这将返回给定对象自己的可枚举属性值的数组。您将获得与使用for in
循环相同的值,但没有原型上的属性。这个例子可能会让事情变得更清楚:
function person (name) {
this.name = name;
}
person.prototype.age = 5;
let dude = new person('dude');
for(let prop in dude) {
console.log(dude[prop]); // for in still shows age because this is on the prototype
} // we can use hasOwnProperty but this is not very elegant
// ES6 +
console.log(Object.values(dude));
// very concise and we don't show props on prototype
答案 13 :(得分:1)
const object1 = {
a: 'somestring',
b: 42
};
for (let [key, value] of Object.entries(object1)) {
console.log(`${key}: ${value}`);
}
// expected output:
// "a: somestring"
// "b: 42"
// order is not guaranteed
答案 14 :(得分:0)
这是一个类似于PHP的array_values()
的函数function array_values(input) {
var output = [], key = '';
for ( key in input ) { output[output.length] = input[key]; }
return output;
}
如果你正在使用ES6或更高版本,以下是如何获取对象的值:
Array.from(values(obj));
答案 15 :(得分:0)
我意识到我有点晚了,但是对于新的firefox 47 Object.values
方法来说 shim
Object.prototype.values = Object.prototype.values || function(obj) {
return this.keys(obj).map(function(key){
return obj[key];
});
};
答案 16 :(得分:0)
由于Object.values(<object>)
将内置于 ES7 &amp;
在等待所有浏览器支持之前,您可以将其包装在函数中:
Object.vals=(o)=>(Object.values)?Object.values(o):Object.keys(o).map((k)=>o[k])
然后:
Object.vals({lastname:'T',firstname:'A'})
// ['T','A']
答案 17 :(得分:0)
Object.entries以更好的方式完成。
var dataObject = {"a":{"title":"shop"}, "b":{"title":"home"}}
Object.entries(dataObject).map(itemArray => {
console.log("key=", itemArray[0], "value=", itemArray[1])
})
答案 18 :(得分:0)
const myObj = { a:1, b:2, c:3 }
获取所有值:
最短的方法:
const myValues = Object.values(myObj)
const myValues = Object.keys(myObj).map(key => myObj[key])
答案 19 :(得分:-1)
var objects={...}; this.getAllvalues = function () {
var vls = [];
for (var key in objects) {
vls.push(objects[key]);
}
return vls;
}
答案 20 :(得分:-4)
使用
keys = Object.keys(object);
否则,如果您的浏览器不支持,请使用众所周知的for..in loop
for (key in object) {
// your code here
}
答案 21 :(得分:-8)
现在我使用Dojo Toolkit,因为旧浏览器不支持Object.values
。
require(['dojox/lang/functional/object'], function(Object) {
var obj = { key1: '1', key2: '2', key3: '3' };
var values = Object.values(obj);
console.log(values);
});
输出:
['1', '2', '3']
答案 22 :(得分:-10)
使用
console.log(variable)
如果您使用google chrome打开控制台,请使用Ctrl + Shift + j
转到&gt;&gt;控制台