Objectentries

jiezi

5 年前

entries() 方法返回一个新的 Array Iterator 对象，该对象包含数组中每个索引的键 / 值对。

Object.entries()
传入对象

const obj = {foo: 'bar', baz: 42};
Object.entries(obj)
// 输出 [["foo", "bar"], ["baz", 42] ]

Array.entries()
传入数组

const arr = ['a', 'b', 'c']; 
console.log(Object.entries(arr));  
// [['0', 'a'], ['1', 'b'], ['2', 'c'] ]

const arr1 = [{a: 1}, 2, 3]; 
console.log(Object.entries(arr1));  
// [['0', { a: 1}], ['1', '2'], ['2', '3']]

const arr2 = [{a: 1}, {b: 2}, {c: 3}]; 
console.log(Object.entries(arr2));  
// [['0', { a: 1}], ['1', { b: 2}], ['2', { c: 3}]]

将 Object 转化为 Map
new Map() 构造函数接受一个可迭代的 entries。借助 Object.entries 方法你可以很容易的将 Object 转换为 Map:

const obj2 = {foo: 'bar', baz: 'abc'}; 
console.log(Object.entries(obj2));  // [['foo', 'bar'], ['baz', 'abc']]
const map = new Map(Object.entries(obj2)); 
console.log(map); // Map {'foo' => 'bar', 'baz' => 'abc'}

返回一个新的 Array 迭代器对象。Array Iterator 是对象，它的原型（__proto__:Array Iterator）上有一个 next 方法，可用用于遍历迭代器取得原数组的[key,value]。

var array1 = ['a', 'b', 'c'];

var iterator1 = array1.entries();

console.log(iterator1.next().value);
// expected output: Array [0, "a"]

console.log(iterator1.next().value);
// expected output: Array [1, "b"]

Array Iterator

var arr = ["a", "b", "c"];
var iterator = arr.entries();
console.log(iterator);

/*Array Iterator {}
         __proto__:Array Iterator
         next:ƒ next()
         Symbol(Symbol.toStringTag):"Array Iterator"
         __proto__:Object
*/

iterator.next()

var arr = ['a', 'b', 'c'];
var iterator = arr.entries();
console.log(iterator.next());
// {value: [ 0, 'a'], done: false }

// iterator.next()返回一个对象，对于有元素的数组，// 是 next{value: Array(2), done: false }；// next.done 用于指示迭代器是否完成：在每次迭代时进行更新而且都是 false，// 直到迭代器结束 done 才是 true。// next.value 是一个 ["key","value"] 的数组，是返回的迭代器中的元素值。

iterator.next 方法运行

var arr = ["a", "b", "c"];
var iter = arr.entries();
var a = [];

// for(var i=0; i< arr.length; i++){   // 实际使用的是这个 
for(var i=0; i< arr.length+1; i++){    // 注意，是 length+1，比数组的长度大
    var tem = iter.next();             // 每次迭代时更新 next
    console.log(tem.done);             // 这里可以看到更新后的 done 都是 false
    if(tem.done !== true){             // 遍历迭代器结束 done 才是 true
        console.log(tem.value);
        a[i]=tem.value;
    }
}
    
console.log(a);

// false
// [0, 'a']
// false
// [1, 'b']
// false
// [2, 'c']
// true
// [[ 0, 'a'], [1, 'b'], [2, 'c'] ]

二维数组按行排序

function sortArr(arr) {
    var goNext = true;
    var entries = arr.entries();
    while (goNext) {var result = entries.next();
        if (result.done !== true) {result.value[1].sort((a, b) => a - b);
            goNext = true;
        } else {goNext = false;}
    }
    return arr;
}

var arr = [[1,34],[456,2,3,44,234],[4567,1,4,5,6],[34,78,23,1]];
sortArr(arr);

使用 for…of 循环

 var arr = ["a", "b", "c"];
 var iterator = arr.entries();
 // undefined
 
 for (let e of iterator) {console.log(e);
 }
 
 // [0, "a"] 
 // [1, "b"] 
 // [2, "c"]

Objectentries

1. 什么是 entry

2. 示例

3. arr.entries()