How do higher-order functions like .map() work inside JavaScript?

Question

Nowadays everyone is trying to use these higher order functions to get promising results by writing less code. But I want to know how these functions work internally. Let's say I write something like varnumbers=[16,25,36];varresults=numbers.map(Math.sqrt);console.log(results);//[4,5,6] I know the "number" array Each element of is iterated one by one, but how? I've tried looking for it but haven't gotten a satisfactory answer yet.

P粉505450505 · Answer

I think every supplier should follow Specifications

A real implementation (e.g. V8) might be a bit more complex, see this answer as a start. You can also refer to the v8 source code in github, but it may not be easy to understand part of it in isolation.

Quote from the above answer:

ES2015 specification:

Suppose O is ToObject(this value).
ReturnIfAbrupt(O).
Suppose len is ToLength(Get(O, "length")).
ReturnIfAbrupt(len).
If IsCallable(callbackfn) is false, a TypeError exception is thrown.
If thisArg is provided, let T be thisArg; otherwise, let T be undefined.
A is ArraySpeciesCreate(O, len).
A).
k be 0.
k len
1. Pk be ToString(k).
2. kPresent be HasProperty(O, Pk).
3. kPresent).
4. kPresent is true, then
  1. kValue be Get(O, Pk).
  2. kValue).
  3. mappedValue be Call(callbackfn, T, «kValue, k >, or".
  4. mappedValue).
  5. State be CreateDataPropertyOrThrow(A, Pk, mappedValue).
  6. status).
5. k by 1.
A.

P粉333395496 · Answer

.map is just a method that accepts a callback, calls the callback for each item of the array, and assigns the value to the new array. It is nothing special. You can even easily implement it yourself:

Array.prototype.myMap = function(callback) {
  const newArr = [];
  for (let i = 0; i < this.length; i++) {
    newArr.push(callback(this[i], i, this));
  }
  return newArr;
}

var numbers = [16, 25, 36];
var results = numbers.myMap(Math.sqrt);
console.log(results); // [4, 5, 6]