JS迭代數組計算元素總和并將值鏈接成字符串的方法

這篇文章主要講解了“JS迭代數組計算元素總和并將值鏈接成字符串的方法”，文中的講解內容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“JS迭代數組計算元素總和并將值鏈接成字符串的方法”吧！

方法1、使用forEach()方法

forEach() 方法用于調用數組的每個元素，并將元素傳遞給回調函數。

語法：

array.forEach(funtion callbackfn(value, index, array), thisValue)

funtion callbackfn(value, index, array)：必需參數，指定回調函數，最多可以接收三個參數：

• value：數組元素的值。

• index：數組元素的數字索引。

• array：包含該元素的數組對象。

thisValue：可省略的參數，回調函數中的 this 可引用的對象。如果省略 thisArg，則 this 的值為 undefined。

下面通過代碼示例來具體了解一下：

示例1：輸出數組元素

function f(value,index,array) {
    console.log("a[" + index + "] = " + value);
}
var a = ['a', 'b', 'c'];
a.forEach(f);

示例2：將數組值進行累加求和

var a = [10, 11, 12], sum = 0;
function f(value) {
	sum += value;
}

a.forEach(f);
console.log(sum);

示例3：將數組值連接成字符串

var a = ['ab', 'cd', 'ef'], str = "";
function f(value) {
	// str=str + value;
	str=str.concat(value);
}

a.forEach(f);
console.log(str);

方法2、使用reduce() 方法

reduce() 方法可對數組中的所有元素調用指定的回調函數。該回調函數的返回值為累積結果，并且此返回值在下一次調用該回調函數時作為參數提供。

語法：

array.reduce(function callbackfn(previousValue, currentVaule, currentIndex, array), initialValue)

function callbackfn(previousValue, currentVaule, currentIndex, array)：必需參數，指定回調函數，最多可以接收4個參數：

• previousValue：通過上一次調用回調函數獲得的值。如果向 reduce() 方法提供 initialValue，則在首次調用函數時，previousValue 為 initialValue。

• currentVaule：當前元素數組的值。

• currentIndex：當前數組元素的數字索引。

• array：包含該元素的數組對象。

initialValue：可省略的參數，傳遞給函數的初始值。

下面通過代碼示例來具體了解一下：

示例1：將數組值進行累加求和

var a = [11, 12, 13], sum = 0;
function f(pre,curr) {
	sum=pre+curr;
	return sum;
}

a.reduce(f);
console.log(sum);

輸出結果：

36

示例2：將數組值連接成字符串

var a = [11, 12, 13], str = '';
function f(pre,curr) {
	str=pre+''+curr;
	return str;
}

a.reduce(f);
console.log(str);

如果想要使用分隔符來分隔每個數組元素，可將回調函數中兩個“+”運算符間的空字符串變為指定分隔符：

var a = [11, 12, 13], str = '';
function f(pre,curr) {
	str=pre+'-'+curr;
	return str;
}

a.reduce(f);
console.log(str);

感謝各位的閱讀，以上就是“JS迭代數組計算元素總和并將值鏈接成字符串的方法”的內容了，經過本文的學習后，相信大家對JS迭代數組計算元素總和并將值鏈接成字符串的方法這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關知識點的文章，歡迎關注！