Wie funktionieren Funktionen höherer Ordnung wie .map() in JavaScript?
P粉107772015
P粉107772015 2023-08-25 17:41:30
0
2
427
<p>Heutzutage versucht jeder, diese Funktionen höherer Ordnung zu nutzen, um vielversprechende Ergebnisse zu erzielen, indem weniger Code geschrieben wird. Aber ich möchte wissen, wie diese Funktionen intern funktionieren. </p> <p>Angenommen, ich hätte etwas Ähnliches geschrieben</p> <p> <pre class="brush:js;toolbar:false;">var zahlen = [16, 25, 36]; var results = zahlen.map(Math.sqrt); console.log(results); // [4, 5, 6]</pre> </p> <p>Ich weiß, dass jedes Element des Arrays „Zahl“ einzeln iteriert wird, aber <em>wie</em>? </p> <p>Ich habe versucht, danach zu suchen, habe aber noch keine zufriedenstellende Antwort erhalten. </p>
P粉107772015
P粉107772015

Antworte allen(2)
P粉505450505

我想每个供应商都应该按照 规格

实际实现(例如 V8)可能有点复杂,请参阅此答案作为开始。您也可以参考 github 中的 v8 源码,但孤立地理解其中的一部分可能并不容易。

引用上面的答案:

ES2015 规范:

  1. O为ToObject(this值)。
  2. ReturnIfAbrupt(O)。
  3. len 为 ToLength(Get(O, "length"))。
  4. ReturnIfAbrupt(len)。
  5. 如果 IsCallable(callbackfn) 为 false,则抛出 TypeError 异常。
  6. 如果提供了 thisArg,则令 TthisArg;否则让T未定义
  7. A 为 ArraySpeciesCreate(O, len)。
  8. ReturnIfAbrupt(A)。
  9. k为0。
  10. 重复,同时 k len
    1. Pk为ToString(k)。
    2. kPresent为HasProperty(O, Pk)。
    3. ReturnIfAbrupt(kPresent)。
    4. 如果kPresenttrue,则
      1. kValue为Get(O, Pk)。
      2. ReturnIfAbrupt(kValue)。
      3. mappedValue为Call(callbackfn, T, «kValue, k >,»。
      4. ReturnIfAbrupt(mappedValue)。
      5. 状态为CreateDataPropertyOrThrow(APkmappedValue)。
      6. ReturnIfAbrupt(状态)。
    5. k增加1。
  11. 返回A
P粉333395496

.map 只是一个接受回调、为数组的每个项目调用回调并将值分配给新数组的方法。没什么特别的。您甚至可以自己轻松实现:

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]
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!