44道JavaScript难题03
2019-07-04 本文已影响6人
Hello杨先生
<body>
<p>
<!-- 题目 -->
3. [ [3,2,1].reduce(Math.pow), [].reduce(Math.pow) ]
答案：an error
解析：Math.pow (x , y) x 的 y 次幂的值
reduce（fn,total）
fn (total, currentValue, currentIndex, arr)
如果一个函数不传初始值，数组第一个组默认为初始值.
[3,2,1].reduce(Math.pow)
Math.pow(3,2) //9
Math.pow(9,1) //9
巩固：[].reduce(Math.pow) //空数组会报TypeError
[1].reduce(Math.pow) //只有初始值就不会执行回调函数，直接返回1
[].reduce(Math.pow,1) //只有初始值就不会执行回调函数，直接返回1
[2].reduce(Math.pow,3) //传入初始值，执行回调函数，返回9
<script>
console.log([3, 2, 1].reduce(Math.pow)); ///9
console.log([1].reduce(Math.pow)); //只有初始值就不会执行回调函数，直接返回1
console.log([].reduce(Math.pow, 1)); //只有初始值就不会执行回调函数，直接返回1
console.log([2].reduce(Math.pow, 3)); //传入初始值，执行回调函数，返回9
console.log([].reduce(Math.pow)); //空数组会报TypeError
</script>
</p>
<p>
<!-- reduce -->
用法
array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
total 必需。初始值, 或者计算结束后的返回值。
currentValue 必需。当前元素
currentIndex 可选。当前元素的索引
arr 可选。当前元素所属的数组对象。
reduce() 是数组的归并方法，与forEach()、map()、filter()等迭代方法一样都会对数组每一项进行遍历，但是reduce()
可同时将前面数组项遍历产生的结果与当前遍历项进行运算，这一点是其他迭代方法无法企及的
<button onclick="myFunction()">点我</button>
<p>数组元素之和: <span id="demo"></span></p>
<script>
var numbers = [15.5, 2.3, 1.1, 4.7];
function getSum(total, num) {
return total + Math.round(num);
}
function myFunction(item) {
document.getElementById("demo").innerHTML = numbers.reduce(getSum, 0);
}
</script>
</p>
<p>
<!-- 实例 -->
先提供一个原始数组：
var arr = [3,9,4,3,6,0,9];
实现以下需求的方式有很多，其中就包含使用reduce()的求解方式，也算是实现起来比较简洁的一种吧。
1. 求数组项之和
var sum = arr.reduce(function (prev, cur) {
return prev + cur;
},0);
由于传入了初始值0，所以开始时prev的值为0，cur的值为数组第一项3，相加之后返回值为3作为下一轮回调的prev值，然后再继续与下一个数组项相加，以此类推，直至完成所有数组项的和并返回。
2. 求数组项最大值
var max = arr.reduce(function (prev, cur) {
return Math.max(prev,cur);
});
由于未传入初始值，所以开始时prev的值为数组第一项3，cur的值为数组第二项9，取两值最大值后继续进入下一轮回调。
3. 数组去重
var newArr = arr.reduce(function (prev, cur) {
prev.indexOf(cur) === -1 && prev.push(cur);
return prev;
},[]);
实现的基本原理如下：
① 初始化一个空数组
② 将需要去重处理的数组中的第1项在初始化数组中查找，如果找不到（空数组中肯定找不到），就将该项添加到初始化数组中
③ 将需要去重处理的数组中的第2项在初始化数组中查找，如果找不到，就将该项继续添加到初始化数组中
④ ……
⑤ 将需要去重处理的数组中的第n项在初始化数组中查找，如果找不到，就将该项继续添加到初始化数组中
⑥ 将这个初始化数组返回
</p>
<p>
<!-- 例子 -->
四舍五入后计算数组元素的总和：
<button onclick="myFunction()">点我</button>
<p>数组元素之和: <span id="demo"></span></p>
<script>
var numbers = [15.5, 2.3, 1.1, 4.7];
function getSum(total, num) {
return total + Math.round(num);
}
function myFunction(item) {
document.getElementById("demo").innerHTML = numbers.reduce(getSum, 0);
}
</script>
</p>
<p>
pow() 方法可返回 x 的 y 次幂的值。
Math.pow(x,y)
参数 描述
x 必需。底数。必须是数字。
y 必需。幂数。必须是数字。
返回值
x 的 y 次幂。
说明
如果结果是虚数或负数，则该方法将返回 NaN。如果由于指数过大而引起浮点溢出，则该方法将返回 Infinity。
<script type="text/javascript">
document.write(Math.pow(0, 0) + "<br />")
// 1
document.write(Math.pow(0, 1) + "<br />")
// 0
document.write(Math.pow(1, 1) + "<br />")
// 1
document.write(Math.pow(1, 10) + "<br />")
// 1
document.write(Math.pow(2, 3) + "<br />")
// 8
document.write(Math.pow(-2, 3) + "<br />")
// -8
document.write(Math.pow(2, 4) + "<br />")
// 16
</script>
</p>
</body>
