1. 程式人生 > 程式設計 >JS陣列遍歷中for,for in,for of,map,forEach各自的使用方法與優缺點

JS陣列遍歷中for,for in,for of,map,forEach各自的使用方法與優缺點

陣列遍歷普通函式

優點:支援流程控制(break、continue、return)

for

const arr = ["A","B","C"]
 for(let i = 0; i<arr.length; i++){
   console.log(arr[i])
 }

優點:能夠對索引精確控制
缺點:語法較為繁瑣

for in

conshttp://www.cppcns.comt arr = ["A","C"]
arr["3"] = 1
Array.prototype["cc"] = "ck"

for(let e in arr){
  console.log(arr[e]Cfary)
}

缺點:

1.遍歷索引為字串,即e型別為字串
2.會遍歷可列舉的非數Cfary字型別鍵以及原型上的鍵
3.不同瀏覽器對for in 順序實現可能不一致

for of

const arr = ["A","C"]
arr["3"] = 1
Array.prototype["cc"] = "ck"
for(let i of arr){
  console.log(i)
}

優點:語法簡潔、有序遍歷
缺點:由於遍歷的是值,對索引無直接控制

函式式-->高階函式

缺點,不能進行流程控制

map

const arr = ["A","C"]
arr.map(e => console.log(e))

優點:語法簡潔,返回一箇舊陣列的對映陣列,不影響原陣列

forEach

const arr = ["A","C"]
arr.forEach(e =&gwww.cppcns.comt; console.log(e))

優點:語法簡潔,在不需要返回陣列時,效能較好比map好

名稱流程控制函式式
forT
for ofT
forEachT
mapT

JS陣列遍歷函式總結:

在不需要流程控制時,優先使用map,不需要返回值使用forEach,需要索引的控制時,可以回退至for,for of一般結合內建預設迭代器的資料結構(Map、Set)使用,在需要結合生成器 async await 非同步迭代時的選擇

更多關於JS陣列遍歷方法的技巧請檢視下面的相關連結