在箭头函数体上,使用括号、直接放置条件或使用括号有什么区别?

  • 本文关键字:条件 区别 函数体 javascript function
  • 更新时间 :
  • 英文 :


在我多年的JS开发中,我见过以下例子:

let a = () => console.log("a");
let b = () => { console.log("b"); }
let c = () => (console.log("c"));

我知道前两个选项之间的区别,但最后一个选项对我来说总是有点不对劲。我还尝试了以下操作,令人惊讶的是,这些操作有效:

let c = () => (console.log("c1"), console.log("c2")); // Outputs both console logs.

还有这个:

let c = () => (1, 2, 3, 4 ,5);
let x  = c(); // 5

我已经搜索了这种定义函数体的方式,但是我对我所发现的并不满意,因为我偶然发现的每个例子都解释得很差。

谁能给我解释一下这三个例子之间的区别,最后一个例子有什么特别之处?

提前感谢。

let c = () => (console.log("c"))

我知道前两个选项之间的区别,但最后一个选项对我来说总是有点不对劲。

Arrow语法允许您直接返回表达式的值,而不必将其括在花括号中并使用return语句。在上面的例子中,将值(由console.log返回)括在括号中并不会改变它的值。

还有这个:

let c = () => (1, 2, 3, 4, 5);

您看到的是逗号操作符。它将返回最后一个操作数的值,这就是为什么c返回5

我还尝试了以下操作,令人惊讶地工作:

let c = () => (console.log("c1"), console.log("c2")); // Outputs both console log

在这种情况下,两个表达式都被求值,因此两个字符串都被记录。但是,由于console.log返回undefined,因此表达式的值为undefined

首先,您正在谈论特别是关于箭头(=>)函数。传统的函数必须有一个包含在{ }中的函数体。

一个箭头函数可以有一个传统的包含在{ }中的体。它也可以使用单个表达式作为主体,在这种情况下,表达式的求值结果隐式地为返回值。鉴于此,请注意,在任何上下文中,JavaScript中的任何表达式都可以被括在括号( )中,其值与所括表达式相同。

逗号效果是JavaScript表达式语法,中的操作符,它允许将不同的表达式链接到一个列表中,在语法上仍然是单个表达式。逗号操作符有时很有用,因为表达式可能有副作用;例如,函数调用是一个表达式,函数调用几乎可以做任何事情。逗号操作符列表中表达式列表的值为计算后最后一个表达式的值。

最新更新