forEach,for和map的区别

map方法

 //值类型,不改变原数组,形成新的数组
 let valueArr = [11, 22, 33];
 let newArray = valueArr.map(item => item * 2);
 console.log(valueArr, newArray);  //[11,22,33]   [22,44,66]
 
 //引用类型,改变原数组
 let referArr = [{
    
     width: 100 }, {
    
     width: 200 }];
 referArr.map(item => item.editable = true);   
 console.log(referArr)  //[{width:100,editable:true},{width:200,eidtable:true}]

forEach方法

 //值类型,不改变原数组,返回值undefined
 let valueArr = [11, 22, 33];
 let newArray = valueArr.forEach(item => item * 2);
 console.log(valueArr, newArray);  //[11,22,33]   undefined
 
 //若要改变值,则需配合index来使用
 let newArr1 = valueArr.forEach((item, index) => {
    
    
      valueArr[index] = item * 2;
 });
 console.log(valueArr, newArray);  //[22,44,66]   undefined
  
 //引用类型,改变原数组
 let referArr = [{
    
     width: 100 }, {
    
     width: 200 }];
 referArr.forEach(item => item.editable = true);   
 console.log(referArr)  //[{width:100,editable:true},{width:200,eidtable:true}]

注意点:
无论用forEach还是map遍历数组,用return来终止后面的语句,在循环里是无效的,需要变量来作为一个过渡值,但在for循环里是有效的。

const valids = []
let flag;
this.$refs[formName].forEach((item) => {
    
    
    item.validate((valid) => {
    
    
        !valid && (flag = true)
    })
})

总结:
都是用来遍历数组,forEach和map会为数组中每个元素执行回调函数。
for循环是在确定数组的长度下使用,continue终止当前循环,break终止整个循环。
map方法可以链式编程,但需要return。
map:若数组的类型为值类型,则产生新的数组;若数组的类型为引用类型,则会改变原数组。
forEach的基本原理就是for循环,返回值为undefined。
forEach:若数组的类型为值类型,则不会改变原数组,若想改变原数组通过index这个参数来改变;若数组的类型为引用类型,则会改变原数组

猜你喜欢

转载自blog.csdn.net/m0_48076809/article/details/106590579