ES6之前，循環(huán)對象常見做法是使用：for...in。但是for...in循環(huán)的問題在于它會遍歷原型鏈中的屬性，所以需要使用hasOwnProperty執(zhí)行檢查屬性是否屬于該對象。
ES6之后，我們對于對象的循環(huán)有了更好的辦法：Object.keys,Object.values,Object.entries

Object.keys :創(chuàng)建一個包含對象所有屬性的數(shù)組

const fruits ={
    appple:22,
    pear:34,
    orange:88
}
var keys = Object.keys(fruits);
console.log(keys);  //["appple", "pear", "orange"]

Object.values:創(chuàng)建一個數(shù)組，其中包含對象中每個屬性的值

const fruits ={
    appple:22,
    pear:34,
    orange:88
}

var values =Object.values(fruits);
console.log(values); //[22, 34, 88]

Object.entries:創(chuàng)建了一個二維數(shù)組，每個內(nèi)部數(shù)組都有2個元素，第一個元素是屬性名，第二個屬性值

const fruits ={
    appple:22,
    pear:34,
    orange:88
}
var entries = Object.entries(fruits);
console.log(entries);

Object.entries.png

使用Object.entries的時候，需要將其內(nèi)部數(shù)組解構(gòu)為其鍵和屬性值

const fruits ={
    appple:22,
    pear:34,
    orange:88
}
for (const [fruit,num] of entries) {
    console.log(`we have ${num} ${fruit}`);  //we have 22 appple ...
}