如果有JavaScript对象:
var objects={...};
假设,它有超过50个属性,不知道属性名称(即不知道“键”)如何在循环中获得每个属性值?
如果有JavaScript对象:
var objects={...};
假设,它有超过50个属性,不知道属性名称(即不知道“键”)如何在循环中获得每个属性值?
你可以循环遍历键:
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
在ECMAScript5中使用
keys = Object.keys(object);
否则,如果您的浏览器不支持它,请使用众所周知的for. in循环
for (key in object) {
// your code here
}
下面是一个可重用的函数,用于将值放入数组中。它还考虑了原型。
Object.values = function (obj) {
var vals = [];
for( var key in obj ) {
if ( obj.hasOwnProperty(key) ) {
vals.push(obj[key]);
}
}
return vals;
}
这取决于您必须支持的浏览器,可以通过多种方式实现。绝大多数浏览器都支持ECMAScript 5 (ES5),但请注意,下面的许多示例都使用Object。键,这是不可用的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来做这些。键安全反对null(就像for-in是),那么你可以做Object。Keys (obj || {})....
对象。Keys返回可枚举的属性。对于简单对象的迭代,这通常就足够了。如果您需要处理一些具有不可枚举属性的东西,则可以使用Object。getOwnPropertyNames代替Object.keys。
2015年ECMAScript + (a.k.a. ES6)
使用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的新反射API提供了反射。ownKeys,返回属性名(包括不可枚举的属性名)和符号的列表。
数组推导式(不要尝试使用)
数组推导式在ECMAScript 6发布前被移除。在移除它们之前,解决方案应该是这样的:
const vals = [for (key of Object.keys(obj)) obj[key]];
// use vals array
2017年ECMAScript +。
ECMAScript 2016增加了不影响此主题的特性。ECMAScript 2017规范增加了Object。values和Object.entries。两者都返回数组(考虑到与Array.entries的类似,这可能会让一些人感到惊讶)。对象。值可以作为is或for-of循环使用。
const values = Object.values(obj);
// use values array or:
for (const val of Object.values(obj)) {
// use val
}
如果你想同时使用键和值,那么Object。条目是为你准备的。它生成一个充满[key, value]对的数组。你可以在for-of循环中使用它,或者(也要注意ECMAScript 2015析构赋值):
for (const [key, val] of Object.entries(obj)) {
// use key and val
}
对象。值垫片
最后,正如评论中提到的和teh_senaus在另一个回答中提到的,可能值得使用其中一个作为垫片。别担心,下面的内容并不会改变原型,它只是向Object添加了一个方法(这就不那么危险了)。使用粗箭头函数,这也可以在一行中完成:
Object.values = obj => Object.keys(obj).map(key => obj[key]);
你现在可以用like
// ['one', 'two', 'three']
var values = Object.values({ a: 'one', b: 'two', c: 'three' });
如果您想避免在本机对象时使用shimming。值存在时,您可以执行:
Object.values = Object.values || (obj => Object.keys(obj).map(key => obj[key]));
最后……
Be aware of the browsers/versions you need to support. The above are correct where the methods or language features are implemented. For example, support for ECMAScript 2015 was switched off by default in V8 until recently, which powered browsers such as Chrome. Features from ECMAScript 2015 should be be avoided until the browsers you intend to support implement the features that you need. If you use babel to compile your code to ECMAScript 5, then you have access to all the features in this answer.
var objects={...}; this.getAllvalues = function () {
var vls = [];
for (var key in objects) {
vls.push(objects[key]);
}
return vls;
}
如果你可以访问Underscore.js,你可以使用_. js。价值观的作用是这样的:
_.values({one : 1, two : 2, three : 3}); // return [1, 2, 3]
现在我使用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']
ES5 Object.keys
var a = { a: 1, b: 2, c: 3 };
Object.keys(a).map(function(key){ return a[key] });
// result: [1,2,3]
对于那些早期适应CofeeScript时代的人来说,这里有另一个等价的东西。
val for key,val of objects
这可能比这样更好,因为可以减少对象,重新键入,降低可读性。
objects[key] for key of objects
如果你真的想要一个值数组,我发现这比用for…在循环。
ECMA 5.1 +
function values(o) { return Object.keys(o).map(function(k){return o[k]}) }
值得注意的是,在大多数情况下,你并不需要一个值数组,这样做会更快:
for(var k in o) something(o[k]);
这将遍历对象o的键值。在每次迭代中,k被设置为o的键值。
下面是一个类似于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));
显然,正如我最近了解到的,这是最快的方法:
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]];
}
使用像这样的填充材料:
if(!Object.values){Object.values=obj=>Object.keys(obj).map(key=>obj[key])}
然后使用
Object.values(my_object)
3)利润!
我知道我来晚了一点,但这是新firefox 47 Object的垫片。值方法
Object.prototype.values = Object.prototype.values || function(obj) {
return this.keys(obj).map(function(key){
return obj[key];
});
};
兼容ES7,甚至一些浏览器还不支持它
因为object .values(<object>)将内置在ES7 &
在等待所有浏览器支持它之前,你可以将它包装在一个函数中:
Object.vals=(o)=>(Object.values)?Object.values(o):Object.keys(o).map((k)=>o[k])
然后:
Object.vals({lastname:'T',firstname:'A'})
// ['T','A']
一旦浏览器与ES7兼容,你就不需要更改代码中的任何内容。
对象。条目可以更好地做到这一点。
var dataObject = {" a ":{“标题”:“店”},“b”:{“标题”:“家”}} Object.entries (dataObject)。map(itemArray => { console.log("key=", itemArray[0], "value=", itemArray[1]) })
ECMA2017开始:
Object.values(obj)将以数组的形式获取所有属性值。
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_objects/Object/values
使用:object .values(),我们传入一个对象作为参数,并接收一个数组的值作为返回值。
这将返回给定对象的可枚举属性值的数组。你将得到与使用for in循环相同的值,但没有Prototype上的属性。下面这个例子可能会让事情更清楚:
函数人(姓名){ This.name = name; } Person.prototype.age = 5; 让dude =新人('dude'); 对于(让道具在伙计){ console.log(老兄[支持]);// for in仍然显示年龄,因为这是在原型上 } //我们可以使用hasOwnProperty,但这不是很优雅 // es6 + console.log (Object.values(伙计)); //非常简洁,我们不显示原型上的道具
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
const myObj = {a:1, b:2, c:3}
获取所有值:
最短的方法: const myValues = Object.values(myObj) const myValues = Object.keys(myObj)。map(key => myObj[key])
这个问题没有指定是否也需要继承的和不可枚举的属性。
获得谷歌不容易找到的所有东西,包括继承的属性和不可枚举的属性,都存在一个问题。
如果我们要获得所有继承的和不可枚举的属性,我的解决方案是:
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循环:
函数getAllPropertyNames(obj) { let result = new Set(); While (obj) { Object.getOwnPropertyNames (obj)。forEach(p => result.add(p)); obj = Object.getPrototypeOf(obj); } 返回结果[…]; } 让obj = { 美国广播公司(abc): 123, 某某:1.234, foobar:“你好” }; for (p of getAllPropertyNames(obj)) console.log(p);
我认为最简单的选择是这样的:
Object.keys(data).forEach(function (key, index) {
var value = data[key];
console.log(key, index, value);
});
例如,这里添加了一个可运行的代码:
Const user = { 名称:“亚历克斯”, 年龄:30岁 }; 种(用户)。forEach(函数(键,索引){ Var值= user[key]; Console.log(键,索引,值); });
我们可以使用以下三种方法获取数据
使用地图功能
data.map( item => { console.log(item) }
使用for循环
for( let i = 0; i < data.length; i++){
console.log(item);
}
使用for in循环
for(key in data) {
if(data.hasOwnProperty(key)) {
const value = data[key];
console.log(value);
}
}