【问题标题】:Why can't an IIFE be used with Douglas Crockford's style when I rewrite it with an arrow function?为什么当我用箭头函数重写 IIFE 时,它不能与 Douglas Crockford 的风格一起使用?
【发布时间】:2019-08-13 23:56:59
【问题描述】:

我有一个可以工作的 IIFE,但是当我使用箭头函数重写它时,它不起作用!

1.- 这个很好用:

let j = 3;

(function (n) {
  while (n--)
    console.log("n only", n);
}(j));

2.- 这个不行!:

((n) => {
  while (n--)
    console.log("n only", n);
}(j));

3.- 我已经测试过下一个也可以使用的版本:

((n) => {
  while (n--)
    console.log("n only", n);
})(j);

但我真的很想了解为什么 (2) 上的版本不起作用。

【问题讨论】:

  • 看起来箭头函数需要被 ()s 包围才能完全解析为表达式,或者类似的东西,而 functions 不需要
  • @CertainPerformance,在 nº1 中有一个小错字,已更正。谢谢

标签: javascript iife


【解决方案1】:

这就是语言定义它的方式。正如mdn 所说:

虽然箭头函数中的箭头不是运算符,但箭头函数具有特殊的解析规则,与常规函数相比,它们与运算符优先级的交互方式不同。

继续举另一个例子,但原理是一样的:

let callback;

callback = callback || function() {}; // ok

callback = callback || () => {};
// SyntaxError: invalid arrow-function arguments

callback = callback || (() => {});    // ok

尽管 Crockford 表示倾向于将 IIFE 的右括号放在最后(在参数之后),但我个人认为将它放在与箭头函数所需的位置相同的位置更直观(在右大括号,在参数之前)。

原因是括号的目的是将 函数 转换为函数表达式,因此参数在该转换中实际上并不重要。所以这似乎更重要:

(function (n) => {
  while (n--)
    console.log("n only", n);
})(j);

【讨论】:

  • 我也更喜欢在参数之前使用括号括起函数,从数学的角度来看更有意义。如果我从一开始就遵循这个偏好,我将永远不会遇到这个问题。
【解决方案2】:

什么是有效的语法和什么是无效的语法取决于语言grammar

CallExpression 定义为

MemberExpression Arguments

但是ArrowFunction 不是MemberExpression,而是AssignmentExpression

为什么会是 TC39 委员会的问题。

【讨论】:

  • 与函数相比,箭头函数的语法看起来有点乱。 mdn上的文档说“[...]箭头函数中的箭头不是运算符”,同时,箭头函数是AssignmentExpression!!??
  • 其实没关系。不要将“AssignmentExpression”与实际分配混淆。它只是一个描述语言规则的非终结符号。每个表达式基本上都是一个“AssingmentExpression”。如果您考虑描述树的语法,AssignmentExpression 几乎位于顶部。 5 也是一个 AssignmentExpression。
【解决方案3】:

两者都有效,但你打错了:确保你写(<function def>)()

let a = 3;

((b) => {
  while(b--) console.log(b);
})(a);

(function(b){
  while(b--) console.log(b);
})(a);

【讨论】:

  • 很确定 OP 所询问的不一致之处是 function 确实 not 需要被 ()s 包围,而箭头函数 确实.
  • 我认为你没有理解这个问题。
  • 在我的辩护中,这个问题有点不清楚......我没有投反对票,但this 的内容反映了我对这个问题的反应
  • 提问的方式有很多种。在这种情况下,我可以问一下CertainPerformance 所指的不一致
猜你喜欢
  • 2017-10-09
  • 2016-03-24
  • 2018-06-29
  • 1970-01-01
  • 2015-01-31
  • 1970-01-01
  • 2014-04-13
  • 2022-12-14
  • 2019-07-10
相关资源
最近更新 更多