signed

QiShunwang

“诚信为本、客户至上”

数组map、filter、reduce以及for循环和forEach、push和concat区别

2021/3/21 10:37:11   来源:

数组map、filter、reduce以及for循环和forEach、push和concat区别

  • 图示

图示

在这里插入图片描述
map n–》n
filter n变少
reduce n变1
在这里插入图片描述
相当于劫匪拿着袋子装乘客的钱(作为第三方计数),一路走过去得到总数
[100,200,300].reduce((sum,money) =>{
return sum +money
} )

reduce( (sum,money) =>{ } ,0) 此处的0是sum的初始值,类型也可是**[ ]、{ }**
sum作为劫匪的篓子,money是乘客的钱

在这里插入图片描述
n–》1 类型为数组时通过concat,不用push

arr.reduce((array,item)=>{
	array.push(item)
},[])
//此处不能用push,因为push返回的是数组长度,所以应用concat。
arr.reduce((array,item)=>{
return array.concat(item)
},[])

reduce也可实现map求平方和还有filter选择过滤的操作

//函数作用域{}中要return值
//箭头函数没有return
//一般return空值要看返回值类型,null、undefined、[]、true false
//return后面不加东西则为undefined
let arr4 = [1,2,3,4,5,6]
arr4.reduce((result,item)=>{
           if(item%2===1){console.log(result);return result}else{return result.concat(item)}}    ,[])

arr4.reduce((result,item)=>{
         return  result.concat(item%2===1?[]:item)}    ,[])
// [2, 4, 6]加其它则显示[2,null,4...],所以要注意输出类型

arr4.reduce((result,item)=>
           result.concat(item%2===1?[]:item)    ,[])

数组push和concat区别
共同点:用于数组拼接
push:数组+某个元素
(将一个或多个元素添加到数组的末尾,并返回该数组的新长度)

const animals = ['pigs', 'goats', 'sheep'];

const count = animals.push('cows');
console.log(count);
// expected output: 4
console.log(animals);
// expected output: Array ["pigs", "goats", "sheep", "cows"]

concat:数组+数组,也可以是数组+某个元素
(不会更改现有数组,而是返回一个新数组。)

const array1 = ['a', 'b', 'c'];
const array2 = 2;
const array3 = array1.concat(array2);

console.log(array3);
输出 ["a", "b", "c", 2]

let array= [];
数组的push可以直接加进,不用等号赋值: array.push(x)

数组的concat则需赋值,才能加进array:
array= array.concat(x)

forEach和map、filter·方法区别
forEach返回undefined,forEach()会修改原来的数组。
而map()、filter()方法会得到一个新的数组并返回。

forEach和for区别
for循环是关键字,有break、continue,块级作用域
forEach是函数,没有break。。。,函数作用域

arr.map实现

let arr6 = [0,1,2,2,3,3,3,4,4,4,4,6];let arr7 = arr6.map(r=>{if(r==0){return '周日'}else if(r==1){return '周一'}else if(r==2){return '周二'}else if(r==3){return '周三'}else if(r==4){return '周四'}else if(r==5){return '周五'}else{return '周六'}})
console.log(arr7) // ['周日', '周一', '周二', '周二', '周三', '周三', '周三', '周四', '周四', '周四', '周四','周六']

arr.filter实现 :去除重复的成绩

let scores = [95,91,59,55,42,82,72,85,67,66,55,91]
let scores2 = scores.filter((v,index)=>scores.indexOf(v)===index)
console.log(scores2) //  [95,91,82,72,85,67,66, 91]

算出所有奇数之和(arr.reduce)

let scores = [95,91,59,55,42,82,72,85,67,66,55,91]
let sum = scores.reduce((sum, n)=>{
 if(n%2===1){return sum+n}
  else {return sum}
},0)
console.log(sum) // 奇数之和:598 

此处忽略了奇数算法:n%2(n代表每个数)
函数作用域{}中要return值