Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

215
Visualizações
map() method mutating the calling Array

map() can't mutate the calling array, instead it returns a new Array with modified values. But, the following code mutating the original Array, is there any wrong in my understanding?

const arr = [1, 2, 3, 4, 5];
arr.map((num, index, arr1) => {
  return arr1[index] = num * 2;
});
console.log(arr); // [2, 4, 6, 8, 10]

about 4 years ago · Juan Pablo Isaza
3 Respostas
Responde à pergunta

0

Well, you're mutating the original array by passing its reference into the callback function inside map() (arr1) and then manually accessing the indices. It will create a new array if you just return the value from that function.

const arr = [1, 2, 3, 4, 5];
const arr1 = arr.map((num) => {
    return num * 2;
});
console.log(arr); // [1, 2, 3, 4, 5]
console.log(arr1); // [2, 4, 6, 8, 10]
about 4 years ago · Juan Pablo Isaza Relatório

0

The third argument to the callback function of map is the original/source array on which the map is called upon

The arr and arr1 are both same i.e both are referencing on the same array, You can see it by using console.log(arr === arr1). So what ever you operation perform on the arr1, it gonna affect the arr.

const arr = [1, 2, 3, 4, 5];
arr.map((num, index, arr1) => {
  console.log(arr1 === arr);
  return num * 2;
});

You can just return num * 2 from the callback function. map internally creates a new array and return it. So you don't have to assign it as

arr1[index] = num * 2

You can also make it one-liner as:

arr.map((num, index, arr1) => num * 2)

const arr = [1, 2, 3, 4, 5];
const result = arr.map((num, index, arr1) => {
  return num * 2;
});
console.log(arr); // [2, 4, 6, 8, 10]
console.log(result); // [2, 4, 6, 8, 10]

about 4 years ago · Juan Pablo Isaza Relatório

0

Array.map creates a new array populated with the results of calling a provided function on every element in the calling array.

Here its specifed that you must call or execute a function on every element of calling array.

What is the issue with your code?

You are not actually calling a function, you are instead updating the original array. If you are looking to create a new array by multiplying each node of the element with 2, you should do something like below.

Working Example

const arr = [1, 2, 3, 4, 5];
const newArray = arr.map((nodeFromOriginalArray, indexOfCurrentElement, arrayFromMapCalled) => {
  return nodeFromOriginalArray * 2;
});
console.log(arr);
console.log(newArray);

Lets debug the paremeters inside the map function.

Here we have provided three arguments.

First argument nodeFromOriginalArray: The current element being processed in the array. This will be each node from your calling array.

Second argument indexOfCurrentElement: The index of the current element being processed in the array. Which means, the index of current element in calling array.

Third argument arrayFromMapCalled: The array map was called upon. This is the array on which the map function is getting executed. Please note, this is the original array. Updating properties inside this array results in updating your calling array. This is what happened in your case.

You should not modify your original array, which is the third parameter. Instead, you should return your node multipled by 2 inside map and assign this to a new array. Updating the third paramater inside the map function will mutate your calling array.

about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda