像 .map() 这样的高阶函数在 JavaScript 内部是如何工作的?
P粉107772015
P粉107772015 2023-08-25 17:41:30
0
2
344

现在每个人都试图使用这些高阶函数来通过编写更少的代码来获得有希望的结果。但我想知道这些函数内部是如何工作的。

假设我写了类似的东西

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

我知道“number”数组的每个元素都在逐一迭代,但是如何

我试图寻找它,但尚未得到满意的答案。

P粉107772015
P粉107772015

全部回复 (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. 重复,同时klen
    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]
      最新下载
      更多>
      网站特效
      网站源码
      网站素材
      前端模板
      关于我们 免责声明 Sitemap
      PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!