建站
咨詢
售后
建站咨詢
新聞中心
這篇文章主要為大家展示了“JavaScript中forEach()怎么用”，內(nèi)容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“JavaScript中forEach()怎么用”這篇文章吧。
創(chuàng)新互聯(lián)專注于新北網(wǎng)站建設(shè)服務(wù)及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗(yàn)。 熱誠為您提供新北營銷型網(wǎng)站建設(shè)，新北網(wǎng)站制作、新北網(wǎng)頁設(shè)計(jì)、新北網(wǎng)站官網(wǎng)定制、微信小程序定制開發(fā)服務(wù)，打造新北網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供新北網(wǎng)站排名全網(wǎng)營銷落地服務(wù)。
forEach()
foreach語句是java5的新特征之一，在遍歷數(shù)組、集合方面，foreach為開發(fā)人員提供了極大的方便。
foreach語句是for語句的特殊簡化版本，但是foreach語句并不能完全取代for語句，然而，任何的foreach語句都可以改寫為for語句版本。
foreach并不是一個(gè)關(guān)鍵字，習(xí)慣上將這種特殊的for語句格式稱之為“foreach”語句。從英文字面意思理解foreach也就是“for 每一個(gè)”的意思。
await 不能用在 forEach 中：原因：那就是 forEach 只支持同步代碼。
forEach 循環(huán)無法中途跳出，break 命令或 return 命令都不能奏效
forEach() 方法對(duì)數(shù)組的每個(gè)元素執(zhí)行一次提供的函數(shù)。
var arr = ['a', 'b', 'c'];
arr.forEach(function(e) {
console.log(e);
});
//輸出結(jié)果
a;
b;
c;
forEach方法中的function回調(diào)有三個(gè)參數(shù)：
第一個(gè)參數(shù)是遍歷的當(dāng)前元素 （必需），
第二個(gè)參數(shù)是當(dāng)前元素的索引值（可選），
第三個(gè)參數(shù)是當(dāng)前元素所屬的數(shù)組對(duì)象（可選）
forEach(function(value,index,array){
// something
});
var arr = [1, 2, 3, 4];
arr.forEach(console.log);
// 等價(jià)于：
var arr = [1, 2, 3, 4];
for (var k = 0; k < arr.length; k++) {
console.log(array[k]);
}
var arr = [1,2,3,4];
var sum =0;
arr.forEach(function(value,index,array){
array[index] == value; //輸出結(jié)果為 true
sum+=value;
});
console.log(sum);
//輸出結(jié)果 10
forEach 循環(huán)無法中途跳出，break 命令或 return 命令都不能奏效
1、forEach不支持break
大家都知道，在使用for循環(huán)時(shí)可以使用break跳出循環(huán)，比如我希望找到數(shù)組中符合條件的第一個(gè)元素就跳出循環(huán)，這對(duì)于優(yōu)化數(shù)組遍歷是非常棒的。很遺憾，forEach并不支持break操作，使用break會(huì)導(dǎo)致報(bào)錯(cuò)。
let arr = [1, 2, 3, 4];
for (let i = 0; i < arr.length; i++) {
console.log(arr[i]);
if (arr[i] === 2) {
break;
};
};
//輸出結(jié)果 1,2
arr.forEach((self, index) => {
console.log(self);
if (self === 2) {
break;
};
});
//報(bào)錯(cuò)
2、forEach中使用return無效
首先需要確定的，直接再for循環(huán)中使用return會(huì)報(bào)錯(cuò)（函數(shù)中使用for可以return），forEach中使用return不會(huì)報(bào)錯(cuò)，但rerutn并不會(huì)生效，我們來看個(gè)例子：
let arr = [1, 2, 3, 4];
function find(array, num) {
array.forEach((value, index) => {
if (value === num) {
return index;
};
});
};
let index = find(arr, 2);
console.log(index);
// 輸出結(jié)果 undefined
上述代碼想要找到數(shù)字2在數(shù)組中的索引，但return并不會(huì)起到終止代碼運(yùn)行并返回值的作用。
當(dāng)然如果我們真的要用return返回某個(gè)值，那就只能將return操作放在函數(shù)中，而不是forEach循環(huán)中，像這樣：
let arr = [1, 2, 3, 4];
function find(array, num) {
let index_;
array.forEach((value, index) => {
if (value === num) {
index_ = index;
};
});
return index_;
};
console.log(find(arr, 2));
//輸出結(jié)果 1
3、forEach刪除自身元素index不會(huì)被重置
還記得文章開頭的問題嗎，那段代碼其實(shí)只會(huì)執(zhí)行一次，數(shù)組也不會(huì)被刪除干凈，這是因?yàn)閒orEach在遍歷跑完回調(diào)函數(shù)后，會(huì)隱性讓index自增，像這樣：
let arr = [1, 2, 3, 4];
arr.forEach((value, index) => {
arr.splice(index, 1);
//這里隱性讓index自增加1
index++;
});
console.log(arr);
//輸出結(jié)果 [2,4]
4、forEach 并不改變?cè)瓟?shù)組：
let arr = [1, 2, 3, 4, 5];
let a = arr.forEach(function(value, index, arr) {
console.log(value)
//輸出
})
console.log(a) //輸出結(jié)果 undefined
console.log(arr.toString())//輸出 1,2,3,4,5
for與forEach的區(qū)別
for循環(huán)可以使用break跳出循環(huán)，但forEach不能。
for循環(huán)可以控制循環(huán)起點(diǎn)（i初始化的數(shù)字決定循環(huán)的起點(diǎn)），forEach只能默認(rèn)從索引0開始。
for循環(huán)過程中支持修改索引（修改 i），但forEach做不到（底層控制index自增，我們無法左右它）。
以上是“JavaScript中forEach()怎么用”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！
本文名稱：JavaScript中forEach()怎么用
文章位置：http://fisionsoft.com.cn/article/jjsccd.html
