js物件轉變為陣列
阿新 • • 發佈:2019-01-31
在es5中:
var arr=[];
for(var i in object){
arr.push(object[i]);
}
console.log(arr);
在es6中:
在es5中引入了Object.keys方法,返回一個數組,成員是引數物件自身的(不含繼承的)所有可遍歷屬性的鍵名;
- var obj = { foo: 'bar', baz: 42 };
- Object.keys(obj)
- // ["foo", "baz"]
ES2017 引入了跟 Object.keys 配套的 Object.values 和 Object.entries,作為遍歷一個物件的補充手段,供 for...of 迴圈使用。
- let {keys, values, entries} = Object;
- let obj = { a: 1, b: 2, c: 3 };
- for (let key of keys(obj)) {
- console.log(key); // 'a', 'b', 'c'
- }
- for (let value of values(obj)) {
- console.log(value); // 1, 2, 3
- }
- for (let [key, value] of entries(obj)) {
- console.log([key, value]); // ['a', 1], ['b', 2], ['c', 3]
- }
Object.values()O方法返回一個數組,成員是引數物件自身的(不含繼承的)所有可遍歷(enumerable)屬性的鍵值。
- const obj = { foo: 'bar', baz: 42 };
- Object.values(obj)
- // ["bar", 42]
- const obj = { 100: 'a', 2: 'b', 7: 'c' };
- Object.values(obj)
- // ["b", "c", "a"]
上面程式碼中,屬性名為數值的屬性,是按照數值大小,從小到大遍歷的,因此返回的順序是 b、c、a。
Object.values 只返回物件自身的可遍歷屬性。
[javascript] view plain copy- const obj = Object.create({}, {p: {value: 42}});
- Object.values(obj) // []
- const obj = Object.create({}, {p:
- {
- value: 42,
- enumerable: true
- }
- });
- Object.values(obj) // [42]
- Object.values({ [Symbol()]: 123, foo: 'abc' });
- // ['abc']
- Object.values('foo')
- // ['f', 'o', 'o']
如果引數不是物件,Object.values 會先將其轉為物件。由於數值和布林值的包裝物件,都不會為例項新增非繼承的屬性。所以,Object.values 會返回空陣列。
[javascript] view plain copy- Object.values(42) // []
- Object.values(true) // []
Object.entries 返回一個數組,成員是引數物件自身的(不含繼承的)所有可遍歷(enumerable)屬性的鍵值對陣列。
[javascript] view plain copy- const obj = { foo: 'bar', baz: 42 };
- Object.entries(obj)
- // [ ["foo", "bar"], ["baz", 42] ]
如果原物件的屬性名是一個 Symbol 值,該屬性會被忽略。
[javascript] view plain copy- Object.entries({ [Symbol()]: 123, foo: 'abc' });
- // [ [ 'foo', 'abc' ] ]
Object.entries 的基本用途是遍歷物件的屬性。
[javascript] view plain copy- let obj = { one: 1, two: 2 };
- for (let [k, v] of Object.entries(obj)) {
- console.log(
- `${JSON.stringify(k)}: ${JSON.stringify(v)}`
- );
- }
- // "one": 1
- // "two": 2
- const obj = { foo: 'bar', baz: 42 };
- const map = new Map(Object.entries(obj));
- map // Map { foo: "bar", baz: 42 }