How Are Array.Each and Array.Map Different

JavaScript: Difference between .forEach() and .map()

They are not one and the same. Let me explain the difference.

forEach: This iterates over a list and applies some operation with side effects to each list member (example: saving every list item to the database) and does not return anything.

map: This iterates over a list, transforms each member of that list, and returns another list of the same size with the transformed members (example: transforming list of strings to uppercase). It does not mutate the array on which it is called (although the callback function may do so).

References

Array.prototype.forEach() - JavaScript | MDN

Array.prototype.map() - JavaScript | MDN

Array#each vs. Array#map

Array#each executes the given block for each element of the array, then returns the array itself.

Array#map also executes the given block for each element of the array, but returns a new array whose values are the return values of each iteration of the block.

Example: assume you have an array defined thusly:

arr = ["tokyo", "london", "rio"]

Then try executing each:

arr.each { |element| element.capitalize }
# => ["tokyo", "london", "rio"]

Note the return value is simply the same array. The code inside the each block gets executed, but the calculated values are not returned; and as the code has no side effects, this example performs no useful work.

In contrast, calling the array's map method returns a new array whose elements are the return values of each round of executing the map block:

arr.map { |element| element.capitalize }
# => ["Tokyo", "London", "Rio"]

array.forEach.call vs array.map.call

forEach operates on the original array elements. (If you want just iterate over all element you should use forEach)

map is running through your array, applying a function to each element, and emitting the result as a new array. (if you want to apply some changes to each element you should use map)

How are array.each and array.map different?

The side effects are the same which is adding some confusion to your reverse engineering.

Yes, both iterate over the array (actually, anything that mixes in Enumerable) but map will return an Array composed of the block results while each will just return the original Array. The return value of each is rarely used in Ruby code but map is one of the most important functional tools.

BTW, you may be having a hard time finding the documentation because map is a method in Enumerable while each (the one method required by the Enumerable module) is a method in Array.

As a trivia note: the map implementation is based on each.

What is the difference between .map, .every, and .forEach?

The difference is in the return values.

.map() returns a new Array of objects created by taking some action on the original item.

.every() returns a boolean - true if every element in this array satisfies the provided testing function. An important difference with .every() is that the test function may not always be called for every element in the array. Once the testing function returns false for any element, no more array elements are iterated. Therefore, the testing function should usually have no side effects.

.forEach() returns nothing - It iterates the Array performing a given action for each item in the Array.

Read about these and the many other Array iteration methods at MDN.

What is the big difference between forEach and map?

The difference is that forEach "iterates over an array" and map "iterates over an array and returns the result"

var numbers = [1, 4, 9];

var roots = numbers.forEach(Math.sqrt);
// roots is undefined, numbers is still [1, 4, 9]

var roots = numbers.map(Math.sqrt);
// roots is [1, 2, 3], numbers is still [1, 4, 9]

What's so good about map? It keeps your code small and smart because you don't need to define anonymous functions for built-in functions.

var numbers = [1, 4, 9];

var roots = [];
numbers.forEach(function(val){ roots.push( Math.sqrt(val) ); });
// roots is now [1, 2, 3], numbers is still [1, 4, 9]

The value of returning the result (no pun intended) is proven in your existing example...

var kvArray = [{key:1, value:10}, {key:2, value:20}, {key:3, value: 30}];
var reformattedArray = kvArray.map(function(obj){ // <---------------- map
   var rObj = {};
   rObj[obj.key] = obj.value;
   return rObj;
});
// reformattedArray is now [{1:10}, {2:20}, {3:30}], 
// kvArray is still [{key:1, value:10}, {key:2, value:20}, {key:3, value: 30}]

var kvArray = [{key:1, value:10}, {key:2, value:20}, {key:3, value: 30}];
var reformattedArray = kvArray.forEach(function(obj){ // <---------------- forEach
   var rObj = {};
   rObj[obj.key] = obj.value;
   return rObj;
});
// reformattedArray is now undefined, 
// kvArray is still [{key:1, value:10}, {key:2, value:20}, {key:3, value: 30}]

How to update an array of objects with data taken from the corresponding elements of another same-size array?

myNumberArray  = [1,2,3,4]

data = [
 {
  "id":34
 },
 {
  "id":35
 },
 {
  "id":36
 },
 {
  "id":37
 }
]

data.forEach((elem, index)=>{
  data[index]["number"]=myNumberArray[index];
})

console.log(data);

This should solve your problem.

Explanation:

I used forEach to iterate over the data array, forEach accepts two parameters, the current value at an index, and the value.

Since, yours is a one-to-one mapping, we are using the current index to access the value at the same index in myNumberArray and assigning that new value in data for number key.

JavaScript Map Array

In the map function you returned the newNotes array within the for loop instead of after it. However I would suggest to use the built in map function.

var notes = [
   {
       title: "Home",
       message: "is a good story",
       status: 'new',
       author:"dala",
   },
   {
       title: "School",
       message: "Have to go everday",
       status: 'new',
       author:"aisha",
   },
   {
       title: "study",
       message: "we have exam to pass",
       status: 'new',
       author:"Omar",
   },
   {
       title: "Work",
       message: "dead line is close",
       status: 'new',
       author:"Said",
   },
   {
       title: "homework",
       message: "as today we need to do it",
       status: 'new',
       author:"Amal",
   },
];

function map(notes,callback){
   const newNotes =[];
   for(var i=0; i<notes.length; i++) {
       const result = callback(notes[i].status = "completed",i);
       newNotes.push(result);
   }
   return newNotes;
}
var outp = map(notes,function(value, i){
   console.log(i)
   for(var a= 0; a<value.length; a++){
       return notes;
   }
})
console.log(outp);