前言

在JavaScript 中數組的遍歷 有很多中方法， 其中有一種 使用 foreach 來遍歷數組。

mdn官方文檔

語法：

arr.forEach(callback(currentValue [, index [, array]])[, thisArg])

參數：

• callback

為數組中每個元素執(zhí)行的函數，該函數接收一至三個參數：currentValue數組中正在處理的當前元素。index 可選數組中正在處理的當前元素的索引。array 可選forEach() 方法正在操作的數組。

• thisArg 可選

可選參數。當執(zhí)行回調函數 callback 時，用作 this 的值。

在forEach 中傳入一個 callback 函數， 函數最多可以接收 三個值， 分別為當前正在遍歷的值， 當前值對應的索引，以及當前數組本身

小試

現在有一個場景，我和我的室友們，現在在一個數組里面。 按照排行分別為: 老大，老二，老三, … ,老六, 小七.

var arr = ['Liu laoda', 'Li laoer', 'Wei laosan', 'Frank', 'Guan laowu', 'Yang laoliu', 'Li xiaoqi'];

// 在 forEach 中 傳入 一個function ，接收兩個參數
arr.forEach(function(name,index){
  console.log(name, ' - ',index);
})

結果如下： 第一個參數就是 當前遍歷的元素，第二參數為當前元素的索引

注意： forEach() 為每個數組元素執(zhí)行一次 callback 函數 ，即每個元素都會執(zhí)行一次callback 函數

來看看回調函數的第三個參數 ，表示 就是這個數組本身。

var arr = ['Liu laoda', 'Li laoer', 'Wei laosan'];

arr.forEach(function(name,index,person){
  console.log(name, ' - ',index);
  console.log(person);
})

還有一個參數 thisArg 這個參數

當回調函數執(zhí)行的時候， 回調函數中 使用this 就是這個值。來看一個例子

var arr = ['Liu laoda', 'Li laoer', 'Wei laosan'];

// thisArg 此時傳入  {'name':'frank'},當回調函數執(zhí)行的時候，this 就是這個值。
arr.forEach(function(name,index){
  console.log(this);
},{'name':'frank'})

如果省略了 thisArg 參數，或者其值為 null 或 undefined，this 則指向全局對象。

var arr = ['Liu laoda', 'Li laoer', 'Wei laosan'];
// 沒有傳thisArg 參數
arr.forEach(function(name,index){
  // 此時是window
	console.log(this);
})

使用forEach注意事項

除了拋出異常以外，沒有辦法中止或跳出 forEach() 循環(huán)。如果你需要中止或跳出循環(huán)，forEach() 方法不是應當使用的工具。

forEach 不支持 break這種語句退出循環(huán)。

如果你想在遍歷數組的過程中想要 提前終止循環(huán)，就不要使用 forEach 遍歷， 可以使用for 循環(huán)來遍歷數組.

例如：我只想遍歷到i==0 的時候，提前終止循環(huán)

var arr = ['Liu laoda', 'Li laoer', 'Wei laosan'];
for (let i = 0; i < arr.length; i++) {
    if (i === 1) {
        break;
    }
    console.log(arr[i],'-', i);
}

// Liu laoda - 0

到此這篇關于Javascript數組的 forEach 方法詳細介紹的文章就介紹到這了,更多相關JS  forEach內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！

最新評論