How do higher-order functions like .map() work inside JavaScript?-PHP Chinese Network Q&A

Article Topic Learning Download Q&A Programming Dictionary Game Recent Updates

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW)

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

P粉107772015 2023-08-25 17:41:30

270

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. Suppose I wrote something similar <pre class="brush:js;toolbar:false;">var numbers = [16, 25, 36]; var results = numbers.map(Math.sqrt); console.log(results); // [4, 5, 6]</pre> I know that each element of the "number" array is iterated one by one, but how? I tried looking for it but haven't gotten a satisfactory answer yet.

P粉107772015

reply all(2)

P粉5054505052023-08-26 14:30:37 2 floor

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.

Like +0

Add Reply

P粉3333954962023-08-26 09:51:45 1 floor

.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]

Like +0

Add Reply