,,

for...in與for...of的區別

當前位置：點晴教程→知識管理交流 →『技術文檔交流』

admin

2024年7月29日 1:20 本文熱度 1113

for...in與for...of都是循環語句，二者的區別是什么，分別對應什么使用場景呢？

遍歷范圍
遍歷的值
遍歷順序
適用場景

遍歷范圍

for...in：可遍歷對象的可枚舉屬性（enumerable=true），包括自身的與繼承的；

const test = {  key1: 'value1',  key2: 'value2',  key3: 'value3'}for(const key in test) {  console.log('key：', key)}

輸出：

若將key2置為不可枚舉：

const test = {  key1: 'value1',  key2: 'value2',  key3: 'value3'}Object.defineProperty(test, 'key2', {  enumerable: false})for(const key in test) {  console.log('key：', key)}

輸出：

for...of：用于遍歷可迭代對象；

例1：數組

const test = [1, 2, 3]for(const value of test) {  console.log('value：', value)}

輸出：

例2：字符串

const test = 'hello'for(const value of test) {  console.log('value：', value)}

輸出：

遍歷的值

for...in：遍歷對象的鍵名（例子同上）；

for...of：遍歷對象的鍵值（訪問對象的Symbol.iterator屬性）（例子同上）；

遍歷順序

for...in：遍歷順序是不確定的，會先遍歷對象的整數屬性，然后的遍歷順序依賴于對象屬性的插入順序；

for...of：遍歷順序依賴于對象迭代器定義的順序，通常是元素插入的順序。

適用場景

for...in：適用于遍歷對象的屬性，若用于遍歷數組時需謹慎，因為也會遍歷到原型鏈上的可枚舉屬性（見此篇文章）；

for...of：適用于遍歷數組、字符串、Map等具有迭代器的可迭代對象，不可用于遍歷普通對象，因為普通對象沒有內置的迭代器；

遍歷普通對象時：

const test = {  key1: 'value1',  key2: 'value2',  key3: 'value3'}for(const value of test) {  console.log('value：', value)}

輸出：

查看普通對象的Symbol.iterator：

const test = {  key1: 'value1',  key2: 'value2',  key3: 'value3'}console.log(test[Symbol.iterator])

輸出：

可見，普通對象沒有內置迭代器。

查看字符串的Symbol.iterator：

const test = 'hello'console.log(test[Symbol.iterator])

輸出：

可見，字符串是具有迭代器的可迭代對象。

該文章在 2024/7/29 18:03:31 編輯過

關鍵字查詢

區別

正在查詢...

點晴ERP是一款針對中小制造業的專業生產管理軟件系統,系統成熟度和易用性得到了國內大量中小企業的青睞。

點晴PMS碼頭管理系統主要針對港口碼頭集裝箱與散貨日常運作、調度、堆場、車隊、財務費用、相關報表等業務管理，結合碼頭的業務特點，圍繞調度、堆場作業而開發的。集技術的先進性、管理的有效性于一體，是物流碼頭及其他港口類企業的高效ERP管理信息系統。

點晴WMS倉儲管理系統提供了貨物產品管理,銷售管理,采購管理,倉儲管理,倉庫管理,保質期管理,貨位管理,庫位管理,生產管理,WMS管理系統,標簽打印,條形碼,二維碼管理,批號管理軟件。

點晴免費OA是一款軟件和通用服務都免費，不限功能、不限時間、不限用戶的免費OA協同辦公管理系統。

日韩欧美国产精品免费一二-日韩欧美国产精品亚洲二区-日韩欧美国产精品专区-日韩欧美国产另-日韩欧美国产免费看-日韩欧美国产免费看清风阁

for...in與for...of的區別