js forEach和map的区别

forEach

let basicArr = [1, 2, 3, 4, 5];
let objArr = [{
    
    name: 'wq'}, {
    
    name: 'qwq'}, {
    
    name: 'qqq'}];

let newArr1 = basicArr.forEach((item, index) => {
    
    
    return item += 1;
});

// 基本数据数组未改变原数组 
console.log(basicArr);  // [1, 2, 3, 4, 5]
console.log(newArr1);  // undefined

let newArr2 = objArr.forEach((item, index) => {
    
    
    return item.name = '温情';
})

// 复合数据数组会改变原数组  
console.log(JSON.stringify(objArr));  // [{"name":"温情"},{"name":"温情"},{"name":"温情"}]
console.log(newArr2);  // undefined

map

let basicArr = [1, 2, 3, 4, 5];
let objArr = [{
    
    name: 'wq'}, {
    
    name: 'qwq'}, {
    
    name: 'qqq'}];

let newArr1 = basicArr.map((item, index) => {
    
    
    return item += 1;
});

// 基本数据数组未改变原数组 
console.log(basicArr);  // [1, 2, 3, 4, 5]
console.log(newArr1);  // [2, 3, 4, 5, 6]

let newArr2 = objArr.map((item, index) => {
    
    
    return item.name = '温情';
})

// 复合数据数组会改变原数组  
console.log(JSON.stringify(objArr));  // [{"name":"温情"},{"name":"温情"},{"name":"温情"}]
console.log(newArr2);  // ["温情", "温情", "温情"]

都说forEach会改变原数组，map不会改变原数组
但是试了下发现好像不是那样
只发现了forEach没有返回值，map会返回处理过的新数组

复合数据数组不改变原数组

通过展开运算符深拷贝，不使用原数组的元素

let objArr = [{
    
    name: 'wq'}, {
    
    name: 'qwq'}, {
    
    name: 'qqq'}];

let newArr2 = objArr.map((item, index) => {
    
    
    let obj = {
    
     ...item, name: '温情' }
    return obj
})

console.log(newArr2);  // ["温情", "温情", "温情"]
console.log(JSON.stringify(objArr));  // [{"name":"wq"},{"name":"qwq"},{"name":"qqq"}]