插件窝 干货文章 Javascript如何实现没有map()的映射数组

Javascript如何实现没有map()的映射数组

const customMap result callback 56    来源:    2025-04-25

在JavaScript中实现没有map()的数组映射

在JavaScript中,如果你需要实现类似Array.prototype.map()的功能但不使用内置的map()方法,有几种替代方案。以下是几种实现方式:

1. 使用for循环

function customMap(arr, callback) {
  const result = [];
  for (let i = 0; i < arr.length; i++) {
    result.push(callback(arr[i], i, arr));
  }
  return result;
}

// 使用示例
const numbers = [1, 2, 3];
const doubled = customMap(numbers, num => num * 2);
console.log(doubled); // [2, 4, 6]

2. 使用forEach()

function customMap(arr, callback) {
  const result = [];
  arr.forEach((item, index, array) => {
    result.push(callback(item, index, array));
  });
  return result;
}

// 使用示例
const numbers = [1, 2, 3];
const squared = customMap(numbers, num => num * num);
console.log(squared); // [1, 4, 9]

3. 使用reduce()

function customMap(arr, callback) {
  return arr.reduce((acc, current, index, array) => {
    acc.push(callback(current, index, array));
    return acc;
  }, []);
}

// 使用示例
const numbers = [1, 2, 3];
const incremented = customMap(numbers, num => num + 1);
console.log(incremented); // [2, 3, 4]

4. 使用for...of循环

function customMap(arr, callback) {
  const result = [];
  let index = 0;
  for (const item of arr) {
    result.push(callback(item, index, arr));
    index++;
  }
  return result;
}

// 使用示例
const numbers = [1, 2, 3];
const halved = customMap(numbers, num => num / 2);
console.log(halved); // [0.5, 1, 1.5]

5. 使用while循环

function customMap(arr, callback) {
  const result = [];
  let i = 0;
  while (i < arr.length) {
    result.push(callback(arr[i], i, arr));
    i++;
  }
  return result;
}

// 使用示例
const numbers = [1, 2, 3];
const stringified = customMap(numbers, num => num.toString());
console.log(stringified); // ["1", "2", "3"]

这些方法都实现了与原生map()相同的功能:对数组中的每个元素应用回调函数,并返回一个新数组,而不修改原始数组。

选择哪种方法取决于你的具体需求和偏好。for循环通常性能最好,而reduce()方法则更函数式编程风格。