将参数转发给另一个 javascript 函数

Posted 2023-02-23

【中文标题】将参数转发给另一个 javascript 函数

【英文标题】：Passing arguments forward to another javascript function

【发布时间】：2011-04-24 07:04:09

【问题描述】：

我尝试了以下方法但没有成功：

function a(args)
    b(arguments);


function b(args)
    // arguments are lost?


a(1,2,3);

在函数 a 中，我可以使用 arguments 关键字来访问参数数组，但在函数 b 中这些都丢失了。有没有办法像我尝试做的那样将参数传递给另一个 javascript 函数？

【问题讨论】：

@BobStein-VisiBone 同意。另外，请注意arguments实际上不是一个数组（而是一个object that implements array-like semantics），因此乍一看并不完全清楚它是否可以以与实际数组相同的方式使用可以。

@Jules 在这么多年后仍然投票重新开放。烧掉别人有价值的作品的徽章是什么？很多都可以去。

【参考方案1】：

使用.apply() 在函数b 中拥有对arguments 的相同访问权限，如下所示：

console.log = function(x)  document.write(x === undefined ? undefined : JSON.stringify(x) + "<br />"); ;

function a()
    b.apply(null, arguments);

function b()
    console.log(arguments); //arguments[0] = 1, etc

a(1,2,3);

You can test it out here.

【讨论】：

@Brett - 您可以将其复制到一个数组中，然后在传递它之前对其进行操作，例如：var copy = [].slice.call(arguments); <remove what you want> myFunc.apply(this, copy);

但是像这样使用apply 可能会搞砸b 的范围（例如，如果它是对象的一些内部函数）

@vsync 好点，但问题很容易解决：将对象作为第一个参数传递给应用。

一起使用“args”和“arguments”没有意义...

但是“this”可能会更改为 b 的原始 this 以外的其他内容。

【参考方案2】：

没有其他答案提供的解释是原始参数仍然可用，但不在arguments 对象中的原始位置。

arguments 对象为提供给函数的每个实际参数包含一个元素。当您调用a 时，您提供三个参数：数字1、2 和3。所以，arguments 包含 [1, 2, 3]。

function a(args)
    console.log(arguments) // [1, 2, 3]
    b(arguments);

但是，当您调用b 时，您传递的正是一个 参数：a 的arguments 对象。所以arguments 包含[[1, 2, 3]]（即一个元素，即a 的arguments 对象，其属性包含a 的原始参数）。

function b(args)
    // arguments are lost?
    console.log(arguments) // [[1, 2, 3]]


a(1,2,3);

正如@Nick 演示的那样，您可以使用apply 在调用中提供一组arguments 对象。

以下实现相同的结果：

function a(args)
    b(arguments[0], arguments[1], arguments[2]); // three arguments

但是apply在一般情况下是正确的解决方案。

【讨论】：

是否应该始终将this 传递给apply？

@Flimm——是的，因为参数是第二个参数，所以第一个参数必须有一些东西（它可以是 null）。

【参考方案3】：

扩展运算符

扩展运算符允许在需要多个参数（用于函数调用）或多个元素（用于数组字面量）的地方扩展表达式。

ECMAScript ES6 添加了一个新的运算符，让您以更实用的方式执行此操作：...Spread Operator。

不使用apply 方法的示例：

function a(...args)
  b(...args);
  b(6, ...args, 8) // You can even add more elements

function b()
  console.log(arguments)


a(1, 2, 3)

注意 如果你的浏览器仍然使用 ES5，这个 sn-p 会返回一个语法错误。

^{编者注：由于sn-p使用console.log()，所以必须打开浏览器的JS控制台才能看到结果——里面会有no -页面结果。}

它会显示这个结果：

简而言之，如果你使用数组，扩展运算符可以用于不同的目的，所以它也可以用于函数参数，你可以在官方文档中看到一个类似的例子：Rest parameters

【讨论】：

这是一个非常好的运算符，我非常期待使用它。但是，它还不会发生。目前唯一已经支持扩展运算符的浏览器是 FF。有关完整的最新数据，请参阅兼容性表：kangax.github.io/compat-table/es6/#spread_%28...%29_operator

为什么不应该使用它？使用 babel 进行转译相对容易，您可以获得所有新功能，并且与旧浏览器的兼容性更好。

这比第一个解决方案更好，因为它适用于使用箭头运算符定义的函数。

在a 函数中不需要...args。您可以只创建一个没有参数的函数并将它们传递给 b 和 ...arguments

致任何阅读此答案的人：与@cronoklee 的评论相反，如果您有嵌套函数，则将...args 明确指定为a 的输入可能很重要。

【参考方案4】：

如果你只想传递某些参数，你可以这样做：

Foo.bar(TheClass, 'theMethod', 'arg1', 'arg2')

Foo.js

bar (obj, method, ...args) 
  obj[method](...args)

obj 和 method 被 bar() 方法使用，而其余的 args 被传递给实际调用。