后端的数据返回和信息的弹框提示
reduce和迭代方法(map、fliter、forEach)一样,会遍历数组;reduce()方法会遍历数组中的每一个元素,每遍历一次就会执行一次回调函数。当遍历完之后会将最后的结果返回出去。
if(res.data.invalidGoodSIdList){
this.$alert(`${res.data.invalidGoodSIdList.reduce((prev, curr)=>{
return prev + `<p>${curr}</p>`
}, '')}`, '失败的商品ID', {
confirmButtonText: '确定',
dangerouslyUseHTMLString: true
});
}
<script>
const arr=[1,2,3,4,5]
const newarr=arr.reduce(function(previousValue,current){ // reduce的特殊之处就在于它方法里面的形参
console.log(previousValue+'-----'+current);
return previousValue + current // 求和运用
});
console.log(newarr); //输出 15
// -----------------------------------------------------------------------------
const newarr1=arr.reduce(function(previousValue,current){ // reduce的特殊之处就在于它方法里面的形参
console.log(previousValue+'-----'+current);
return previousValue + current // 求和运用
},2); // 这里的reduce有两个参数,第一个是函数、第二个是2,这里的2表示的是previousValue初始值为2,如果没有则默认为数组的第一个元素
console.log(newarr1); //输出 17
// -----------------------------------------------------------------------------
const newarr2=arr.reduce(function(previousValue,current){ // reduce的特殊之处就在于它方法里面的形参
return previousValue * current // // 求积运用
});
console.log(newarr2); //输出 120
// -----------------------------------------------------------------------------
let arr1 = ['name','age','long','short','long','name','name'] // 计算数组中元素出现的次数
let arrResult = arr1.reduce((pre,cur) =>{
// console.log(pre,cur)
if(cur in pre){
pre[cur]++ // 理解一下为什么不可以使用pre.crr ++的形式,因为pre.crr的.crr默认表示为pre对象中一个的crr属性,且其值不可以更换
}else{
pre[cur] = 1 // 这里意思是往pre对象中添加了name属性并且赋值为1
}
return pre
},{});
console.log(arrResult) //输出{name: 3, age: 1, long: 2, short: 1} 重点理解
console.log(arrResult['name']); // 输出 3
</script>