【问题标题】:How arguments are passed in callback functions?参数如何在回调函数中传递?
【发布时间】:2022-01-12 19:48:17
【问题描述】:

我已经开始学习用于 Web 开发的 JavaScript,但我目前被困在回调函数的某个点上。问题是我无法理解 JavaScript 中的参数是如何传递的。

代码:

const arr = [1, 2, 3, 4, 5, 6, 7, 8];
function myfunc(value){ //i had set a parameter 'value'
  console.log(value); // i had printed the 'value'
}
arr.forEach(myfunc); // i had not passed any argument in myfunc

我真的很困惑 myfunc (value) 如何从 forEach 函数或任何类似函数中获取“值”参数:

const numbers1 = [45, 4, 9, 16, 25];
function myFunction(value) { //myFunction has parameter 'value'
  return value * 2;
}
const numbers2 = numbers1.map(myFunction); /* here, how value arguments are passed to 
myFunction? */

【问题讨论】:

标签: javascript ecmascript-6


【解决方案1】:

它们被传入是因为forEach 有一些代码可以传入它们。forEach 的实现看起来像这样:

forEach(callback) {
  // `this` is the array we're looping over
  for (let i = 0; i < this.length; i++) {
    callback(this[i], i, this);
  }
}

所以forEach 处理循环遍历数组的逻辑,然后对于数组中的每个元素,它将调用您的函数并传入三个参数(值、它的索引和整个数组)。您只需编写一个函数,以您需要的任何方式使用这些值。如果您不需要使用所有 3 个参数,您可以简单地省略所需参数右侧的任何参数。

【讨论】:

  • 从技术上讲,您不能将它们排除在外。例如,省略参数 2 但需要参数 3 将不起作用,因为它将变量 3 的参数变量视为变量 2。您可以使用 _,但 Javascript 将其视为实际变量而不是占位符。我通常将这 3 个参数命名为“i”、“v”和“arr”(尽管我接下来从不使用后一个参数)并且不使用我不需要的参数。
  • 好的,我已经改写了这个句子,所以不能再将句子解释为暗示可以省略中间参数,同时仍然使用后面的参数。
  • 有点罗嗦,但是很好。这主要只是给看到您答案的任何人的便条。
【解决方案2】:

javascript Array 上的功能扩展需要 function 作为参数。该函数可以是:

  • 命名函数
function doSomething() {} // This is a named function
  • 匿名函数
// This is an anonymous function because we didnt give a name to it
[1,2,3].forEach(function (value) { console.log(value) })
  • 一个粗箭头函数(lambda 表达式)。
// It's called fat arrow because well, the arrow is fat
[1,2,3].forEach((value) => console.log('hey', value))

Array 上的功能扩展的实现总是传递三个参数:值、索引和函数被应用到的数组

函数参数在 JS 中的工作方式是,如果您向函数传递的参数多于所需的参数,JS 将丢弃其余参数,如果您传递的参数多于所需的参数,则这些参数将具有 undefined 的值,除非您已为这些指定了默认值

const array = [1,2,3]

// I am just getting the value and the name "value" could be any name
array.forEach((value) => console.log(value)) 
// here my fat-arrow function takes two parameters, since forEach passes three parameters we're good to go
array.forEach((value, index) => console.log(value, 'at', index))
// Here we're using all arguments without dropping any
array.forEach((value, index, array) => console.log(value, index, array)) 
// that is because  the forEach predicate only passes three arguments and hence the last is undefined
array.forEach((value, index, array, fourth) => console.log('here', fourth, 'is always undefined')) 

【讨论】:

  • 迂腐尼特:“谓词”返回布尔值。这适用于过滤和查找等,但不适用于 forEach 或 reduce 等。“函数”对于一般功能参数(或“闭包”,只要我很傲慢)来说是一个更好的词。
  • 我同意,我会更新答案
  • 定义函数的不同方法是否相关?如果是这样,为什么不包含(对象/类)方法? forEach 不在乎函数对象是如何创建的……
  • 我不知道它们是否相关,但 OP 使用了命名函数和匿名函数,当我回答时我决定在这些区域放一些光,但你是对的,我缺少对象/类函数和方法
【解决方案3】:

这对 OP 来说是有意义的,可能:

const numbers1 = [45, 4, 9, 16, 25];
numbers1.forEach(e => console.log(e));

所以也许这也有意义:

const numbers1 = [45, 4, 9, 16, 25];
const someFunction = e => console.log(e);
numbers1.forEach(someFunction);

如果是这样,那么这也是有道理的:

function someFunction(e) {
  console.log(e));
}
numbers1.forEach(someFunction);

【讨论】:

    【解决方案4】:

    同时使用arr.forEach(myfunc)numbers1.map(myFunction),您将对函数的引用传递给标准函数mapforEach。然后,这两个标准数组函数都在内部使用您的引用,并始终使用相同的参数调用您的函数。

    所以,例如对于forEach,在每个循环中,你的函数都被这样调用myfunc(element, index, array)。参数由forEach 函数定义。您也可以将这样的函数内联定义为arr.forEach(function (element, index, array) {...},但它基本上只是做同样的事情。

    【讨论】:

      猜你喜欢
      • 2021-02-08
      • 2013-02-07
      • 1970-01-01
      • 1970-01-01
      • 2022-01-25
      • 1970-01-01
      • 1970-01-01
      • 2012-02-08
      • 1970-01-01
      相关资源
      最近更新 更多