时间戳

首页 > 解决方案 > Javascript中箭头函数（胖箭头=>）的确切解析优先级是什么？

javascript - Javascript中箭头函数（胖箭头=>）的确切解析优先级是什么？

问题描述

我从eslint 文档中看到了一个关于箭头函数的例子：

// The intent is not clear
var x = a => 1 ? 2 : 3;

所以我对箭头函数的优先级进行了一些研究。这似乎=>不被视为运算符，因为在 MDN 上的运算符优先级表中找不到它。从页面箭头功能，它说

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

但它没有进一步详细说明特殊的解析规则。所以我的问题是，关于箭头函数的优先规则是什么？

根据我的测试，它的优先级似乎高于赋值，但低于条件（三元）运算符？

var x = 0, a = 5;
console.log(x = a => 1 ? 2 : 3);
// same as x = (a => (1 ? 2 : 3))
console.log(x);
console.log(a);

但我不确定这在不同的浏览器和平台上是否一致。任何人都可以对这种行为给出明确的答案吗？

标签： javascriptecmascript-6

解决方案

正如你所说，=>不是运营商。箭头函数是主要语法。

它们的规则在规范中定义，从ArrowFunction产生开始。ArrowFunction被定义为ArrowParameters后跟=>有误导性命名的ConciseBody。ConciseBody有两种形式。您正在使用ExpressionBody询问表单，这=> 是 not 之后的第一个非空白标记{。如果那里有一个左花括号，它将表示打开一个称为FunctionBody的块。

ExpressionBody的定义非常简单：它是一个AssignmentExpression。

这让我们进入了非常熟悉的领域，因为AssignmentExpression是赋值（或变量初始化器）右侧的语法、数组初始化器中的条目、属性初始化器的值部分、函数的参数等。因此=>，简洁正文中的任何内容都具有与我们在下面的 AssignmentExpression 中放置的相同的解析规则：

x = AssignmentExpression;
y = AssignmentExpression, z = AssignmentExpression;
a1 = [AssignmentExpression];
a2 = [AssignmentExpression, AssignmentExpression];
o1 = {foo: AssignmentExpression};
o2 = {foo: AssignmentExpression, bar: AssignmentExpression};
doSomething(AssignmentExpression);
doSomething(AssignmentExpression, AssignmentExpression);

只是为了细节，一个AssignmentExpression是任何一个：

（你可能想知道，正如我所做的那样，在给定上面的定义的情况下，yinx = y如何匹配AssignmentExpressiony ，因为它显然是一个标识符，而且这些看起来都不会导致标识符的产生。这是规范很难做到的地方阅读。事实证明，如果你继续走足够长的时间，你就会到达那里。路径是（深呼吸）：AssignmentExpression  → ConditionalExpression  → LogicalORExpression  → LogicalANDExpression  → BitwiseORExpression  → BitwiseXORExpression  → BitwiseANDExpression  → EqualityExpression  → RelationalExpression  → ShiftExpression  → AdditiveExpression  → MultiplicativeExpression  → ExponentiationExpression  → UnaryExpression  → UpdateExpression  → LeftHandSideExpression  → NewExpression  → MemberExpression  → PrimaryExpression  → IdentifierReference  → Identifier  — 哇！[擦眉毛]。谢谢奥里奥尔！）

推荐阅读