JavaScript 是弱腳步語言货抄，平時(shí)在做Web開發(fā)的時(shí)候，我們使用方法特別隨意朱转，今天這么寫蟹地，明天可能那么寫，過了幾天就會(huì)忘記曾經(jīng)的寫法藤为。對(duì)于對(duì)象和數(shù)組的遍歷怪与，更是如此，有時(shí)使用同一種方法遍歷缅疟，有時(shí)又不是分别。這次特意花了點(diǎn)時(shí)間整理一下，來個(gè)對(duì)象存淫、對(duì)象數(shù)組遍歷大比拼茎杂。JavaScript中常用的對(duì)象、對(duì)象數(shù)組遍歷方法有以下幾種：
-
for...in 循環(huán)遍歷對(duì)象的所有可枚舉屬性（包括繼承來的屬性）纫雁，并將屬性名賦值給變量煌往。示例代碼：
const myObj = {a: 1, b: 2, c: 3};對(duì)數(shù)組對(duì)象的遍歷：
const myArray = [myObj,myObj,myObj];運(yùn)行結(jié)果圖：
for in 循環(huán)遍歷，是使用次數(shù)最多的遍歷轧邪。
-
Object.keys() 和 Object.values()
返回對(duì)象所有自身可枚舉屬性的屬性名刽脖、屬性值組成的數(shù)組。
示例代碼：
const myObj = {a: 1, b: 2, c: 3};用它倆遍歷對(duì)象數(shù)組忌愚，這里就不演示了曲管。這兩個(gè)方法特別適合key值和value值分別獲取的業(yè)務(wù)場景。
還有兩個(gè)和Object.keys()功能類似的方法硕糊。
2.1院水、Object.getOwnPropertyNames()，返回對(duì)象所有自身屬性（包括不可枚舉屬性）的屬性名組成的數(shù)組简十，相當(dāng)于 Object.keys() 的用法檬某。
示例：
const myObj = {a: 1, b: 2, c: 3};2.2、Reflect.ownKeys()螟蝙，返回對(duì)象所有自身屬性（包括不可枚舉屬性和Symbol屬性）的屬性名組成的數(shù)組恢恼。
示例：
const myObj1 = {a: 1, [Symbol()]: "symbol"};2.3、擴(kuò)展一個(gè)方法胰默，Object.getOwnPropertyDescriptors()场斑，返回給定對(duì)象所有自身屬性的描述符漓踢。描述符包含可枚舉屬性、不可枚舉屬性漏隐、數(shù)據(jù)屬性喧半、訪問器屬性等。
示例：
const myObj2 = {a: 1}; -
Object.entries()
返回對(duì)象所有自身可枚舉屬性的鍵值對(duì)組成的數(shù)組青责。每個(gè)鍵值對(duì)都是一個(gè)長度為2的數(shù)組挺据，第一個(gè)元素是屬性名，第二個(gè)元素是屬性值爽柒。
示例代碼：
const myObj = {a: 1, b: 2, c: 3};運(yùn)行結(jié)果圖
-
Object.entries().map()
返回一個(gè)新數(shù)組吴菠，其中包含對(duì)原始數(shù)組中的每個(gè)元素執(zhí)行回調(diào)函數(shù)后的結(jié)果者填。
示例：
const myObj = {a: 1, b: 2, c: 3}; -
Object.entries().forEach()
遍歷數(shù)組浩村，對(duì)象數(shù)組，對(duì)每個(gè)屬性執(zhí)行指定的回調(diào)函數(shù)占哟。
示例：
const myObj = {a: 1, b: 2, c: 3}; -
for...of 循環(huán)
遍歷可迭代對(duì)象（包括數(shù)組心墅、字符串、Map榨乎、Set等）中的元素怎燥。
示例：
const myObj = {a: 1, b: 2, c: 3}; -
for...await
用于遍歷異步可迭代對(duì)象中的元素（例如異步生成器）。
示例：
// 異步方法 -
Object.fromEntries()
將一個(gè)鍵值對(duì)數(shù)組轉(zhuǎn)換為對(duì)象蜜暑。每個(gè)鍵值對(duì)都是一個(gè)長度為2的數(shù)組铐姚，第一個(gè)元素是屬性名，第二個(gè)元素是屬性值肛捍。
示例：
const entries1 = [["a", 1], ["b", 2], ["c", 3]];股份公司的分公司的分公司電飯鍋是對(duì)方根深蒂固
-
Object.assign()
將一個(gè)或多個(gè)源對(duì)象的屬性復(fù)制到目標(biāo)對(duì)象中隐绵，如果屬性名相同，則后面的屬性值會(huì)覆蓋前面的拙毫。示例代碼：
const targetObj = {a: 1, b: 2};
最后總結(jié)一下依许，代碼中最常用的遍歷方法是 for...in。Object.keys() 和 Object.values() 特別適合key值和value值分別獲取的場景缀蹄。Object.entries() 以及擴(kuò)展出來的Object.entries().map() 峭跳、Object.entries().forEach()，可以把它們歸為一組缺前。for...of 是 for...in 和 Object.entries() 兩個(gè)方法的組合蛀醉。for...await 適用于異步計(jì)數(shù)器。Object.fromEntries()將鍵值對(duì)轉(zhuǎn)換為數(shù)組衅码，Object.assign()將兩個(gè)對(duì)象合并為一個(gè)對(duì)象滞欠，并去重。
