區(qū)別：1、for通過索引來循環(huán)遍歷每一個(gè)數(shù)據(jù)元素，而forEach通過JS底層程序來循環(huán)遍歷數(shù)組的數(shù)據(jù)元素；2、for可以通過break關(guān)鍵詞來終止循環(huán)的執(zhí)行，而forEach不可以；3、for可以通過控制循環(huán)變量的數(shù)值來控制循環(huán)的執(zhí)行，而forEach不行；4、for在循環(huán)外可以調(diào)用循環(huán)變量，而forEach在循環(huán)外不能調(diào)用循環(huán)變量；5、for的執(zhí)行效率要高于forEach。

本教程操作環(huán)境：windows7系統(tǒng)、javascript1.8.5版、Dell G3電腦。

1、for循環(huán) 和 forEach的區(qū)別

(1) for循環(huán)是通過 生成 數(shù)組的索引下標(biāo) 循環(huán)遍歷數(shù)組的每一個(gè)數(shù)據(jù)元素

forEach是 JavaScript定義的數(shù)組的函數(shù)方法 通過 JavaScript底層程序 循環(huán)遍歷數(shù)組的數(shù)據(jù)元素

(2) for循環(huán) 可以 通過 break 關(guān)鍵詞 來終止循環(huán)的執(zhí)行

forEach 中 調(diào)用執(zhí)行 break 程序會報(bào)錯(cuò)

(3) for循環(huán)可以通過 控制循環(huán)變量 的數(shù)值 控制 對于循環(huán)的執(zhí)行

forEach循環(huán) 中 參數(shù)存儲數(shù)據(jù)都是底層程序進(jìn)行賦值 無法進(jìn)行賦值修改等操作

(4) for循環(huán) 在循環(huán)外 可以調(diào)用循環(huán)變量

forEach循環(huán) 在循環(huán)外 不能調(diào)用 循環(huán)變量

(5) for循環(huán)的執(zhí)行效率 要 高于 forEach循環(huán)

2、for循環(huán) 和 forEach循環(huán)的對比

既然 for循環(huán) 和 forEach循環(huán) 兩個(gè)循環(huán)語法 看上去 for循環(huán) 更加方便 更加合理 為什么還要有 for循環(huán) 和 forEach 兩個(gè)循環(huán)呢?

首先 for循環(huán)的執(zhí)行 只能是通過循環(huán)生成索引下標(biāo)數(shù)值 然后通過索引下標(biāo) 操作 數(shù)組的數(shù)據(jù)元素

但是 forEach 可以通過設(shè)定參數(shù) 來 存儲 索引下標(biāo) 數(shù)據(jù)數(shù)值 這樣在操作上更加的便利

其次 for循環(huán) 生成 定義循環(huán)變量 可以 使用 var 或者 let 等關(guān)鍵詞 這樣可以根據(jù)循環(huán)執(zhí)行的需要 設(shè)定 聲明變量的關(guān)鍵詞

但是 forEach 底層使用的是 let 關(guān)鍵詞聲明變量 并且只能是這個(gè)關(guān)鍵詞聲明變量 是不能修改的

實(shí)際項(xiàng)目中我們可以根據(jù)自己項(xiàng)目的實(shí)際需求，判斷我們需要使用的是for循環(huán)還是forEach循環(huán)。好了，本文就分享到這里了。

如果想要獲取Web前端學(xué)習(xí)資料、源碼的同學(xué)們，請用手機(jī)點(diǎn)擊下方鏈接，獲取海量資料包喲！