为什么使用回调函数后数组中的元素没有变化？

Question

我在理解回调函数的工作方式时遇到了一些问题。我想做一个像 map 方法一样工作的函数。即使我没有收到任何错误，数组中的元素也不会改变。你能指出我做错了什么吗？

function multiplyFn(x) {
    return x * 2;
}
const exampleArray = [1, 2, 3, 4, 5, 6, 8];

function mapFn(array, callback) {
    for (const el of array) {
        callback(el);
        console.log(el)
    }
    console.log(array)
    return array;
}

mapFn(exampleArray, multiplyFn);

Answer 1

您需要根据返回值更新元素：

function multiplyFn(x) {
    return x * 2;
}
let exampleArray = [1, 2, 3, 4, 5, 6, 8];

function mapFn(array, callback) {
    for (let i = 0; i < array.length; i++) {
        let el = array[i];
        array[i] = callback(el);
    }
    return array;
}

mapFn(exampleArray, multiplyFn);

Answer 2

请注意，您可以简单地使用 Array#map() 来完成此操作，它不会更新原始数组，而是 return 一个新数组

function multiplyFn(x) {
    return x * 2;
}
const exampleArray = [1, 2, 3, 4, 5, 6, 8];

function mapFn(array, callback) {    
    return array.map(callback);
}

console.log(mapFn(exampleArray, multiplyFn));

Answer 3

如果您想更改原始数组，您可以更新传入函数的数组参数的索引。

function mapFn(array, callback) {
    array.forEach(function(element,index){
      let val= callback(element)
      array[index] = val
    });
    return array;
}

Answer 4

如果你想实现自己的地图功能，你可以不使用任何in-built数组方法

//Define your map method in the Array prototype object

Array.prototype.mymap = function(callback) {
    const res = [];
    for (let index = 0; index < this.length; index++) {
        res[index] = callback(this[index], index, this);
    }
    return res;
}
const exampleArray = [1, 2, 3, 4, 5, 6, 8];

//Let's test with two examples

function multiplyFn(x) {
    return x * 2;
}
const first = exampleArray.mymap(multiplyFn)
console.log(first)

const second = exampleArray.mymap((el, index, array) => ({el, index}))
console.log(second)

为什么使用回调函数后数组中的元素没有变化？

Why elements in array dont change after using callback function?

javascript

function

callback