JS 数组相加的几种方式

JavaScript06

JS 数组相加的几种方式,第1张

js数组求和的方法

vararray = [1,2,3,4,5]

varsum =0

1.for循环

for(leti =0i <array.lengthi++) {

        sum += array[i]

    }

2.forEach

array.forEach(ele=>{

        sum += ele

    })

3.归并方法reduce()和 reduceRight()

//这两个方法都会迭代数组的所有项，然后构建一个最终返回的值。其中， reduce()方法从数组的第一项开始，逐个遍历到最后。

//而 reduceRight()则从数组的最后一项开始，向前遍历到第一项 

varsum1 = array.reduce(function(prev, next, index, array){

returnprev + next

    })

varsum2 = array.reduceRight(function(last, before, index, array){

returnlast + before

    })

4.eval()

eval(array.join("+"))

前言

面试遇到一个问题：JS数组求和函数。我第一想到的就是数组循环。然而我觉得面试官问这个问题一定不是想考这个人人皆知的方法。当时机智的我竟然想到了递归函数不断加和数组的项，然而折腾了好久都没调好方法，事实证明这并不是最优解。最后面试官问我有没有见过reduce()，真木有哇。所以回来查资料，Array.reduce()是ES5新增的新属性，相似的还有Array.reduceRight()。

下文来总结一下数组求和的方法。

最粗暴的方法：循环获取

通过for循环一项项地加和。看代码：

Array.prototype.sum

=

function

(){

var

result

=

0

for(var

i

=

0

i

<

this.length

i++)

{

result

+=

this[i]

}

return

result

}

[1,4,7,2,10].sum()

//

24

使用reduce方法

利用reduce方法，可以写一个数组求和的sum方法。

reduce()方法接收一个函数作为累加器，数组中的每个值(从左到右)开始缩减，最终为一个值。

reduce的语法：

array.reduce(callback[,

initialValue])

callback函数接受4个参数：previousValue(上次调用回调返回的值)、currentValue(当前被处理的元素)、index(索引)以及数组本身(第一次调用

callback的第一个参数)，执行数组中每个值的函数。

initialValue参数可选，表示初始值；initialValue参数若指定，则当作最初使用的previous值，如果缺省，则使用数组的第一个元素作为previous初始值，同时current往后排一位。

Array.prototype.sum

=

function

(){

return

this.reduce(function

(partial,

value){

return

partial

+

value

})

}

[1,4,7,2,10].sum()

//

24

相比第一种方法，使用reduce()方法的效率更高。

这两种方法的效率比较可以直接在函数运行前后分别调用new

Date()获取即时时间，从而通过时间差比较执行时间。这里就不比较了，因为每个人的执行环境差异较大。测试结果是reduce()方法的执行时间更短。

JS数组求和函数，并求出数组中的最大值

实例代码

<!DOCTYPE

html

PUBLIC

"-//W3C//DTD

XHTML

1.0

Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html

xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta

http-equiv="Content-Type"

content="text/html

charset=gb2312"

/>

<title>脚本之家_js数组求和和最大值方法_脚本之家网</title>

<meta

name="keywords"

content="站长,网页特效,网页特效代码,js特效,js脚本,脚本,广告代码,jb51.net,www.jb51.net,脚本之家网"

/>

<meta

name="description"

content="www.jb51.net,脚本之家网，站长必备js特效及广告代码。大量高质量js特效，提供高质量广告代码下载,尽在脚本之家网"

/>

</head>

<body>

<a

href="http://www.jb51.net/">脚本之家网</a>,站长必备的高质量网页特效和广告代码。jb51.net，站长js特效。<hr>

<script

type="text/javascript">

//求和

Array.prototype.sum

=

function

()

{

for

(var

sum

=

i

=

0

i

<

this.length

i++)sum

+=

parseInt(this[i])

return

sum

}

//求最大值

Array.prototype.maxima

=

function

()

{

for

(var

i

=

0,

maxValue

=

Number.MIN_VALUE

i

<

this.length

i++)parseInt(this[i])

>

maxValue

&&

(maxValue

=

this[i])

return

maxValue

}

//应用

var

arr

=

[1,21,3,4,22,45,60,7,32]

alert(arr.join("+")

+

"="

+

arr.sum())

alert(arr.join("|")

+

"中,

最大的数是:"

+

arr.maxima())

</script>

</body>

</html>

以上就是本文的全部内容，希望对大家使用JavaScript有所帮助哦，如果有疑问的话欢迎留言讨论，小编会及时回复大家的。

// 数组求和除了一般的for，while, foreach, map, filter难道就没有更简单的方法了？？

// 答案肯定是 NO NO NO！

// 数组的 reduce() 和 reduceRight() 求和方法！

示例[ES6]:

let numList = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

console.log(numList.reduce((n,m) => n+m))

// 结果: 55

// 注意: 如果看不懂箭头函数的小伙伴们，请先了解下ES6。实在没空，下边附上ES5语法示例！

示例[ES5]:

var numList = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

console.log(numList.reduce(function (n, m) {

    return n + m

}))

// 综上所述: reduce() 和 reduceRight()效果一样，唯一不一样的就是一个从左开始算，一个从右开始算！