如何使用箭头功能提醒某些东西

Question

我有这张带有onclick功能的图片

<img src="assets/images/logo.svg" id="logo" onclick="alertPlay()">

如果我执行以下功能，该功能不起作用吗？

const alertPlay => alert("play");

如果没有，也许我只是对一般的箭头功能感到困惑。

此外，还有

之类的简写形式吗？

<img src="assets/images/logo.svg" id="logo" onclick="alert('play')">

Answer 1

您使用了错误的语法。 () => alert("play");是函数体。您需要使用=将其分配给变量。
OP在评论中问：此外，为什么还要在()和= 之间放置=> ：
因为docs

描述了其正确的语法

  

不带参数的函数的参数列表应写一对括号。

const alertPlay = () => alert("play");

<img src="assets/images/logo.svg" id="logo" onclick="alertPlay()">

Answer 2

我将尝试解释所有可以使用的箭头功能。

const funcName = (parameters) => alert('message');

const funcName表示函数的名称，并且该函数是不可变的，如果尝试重新分配其值，则会引发错误。

=（参数）=> alert（'消息'）;

为funcName分配值，首先是函数所有参数的圆括号，在圆括号和alert（'message'）之前使用箭头代替函数关键字；是您要运行的JavaScript。您的JavaScript代码可能更长，然后您可以使用方括号{}。

工作示例：

<img src="assets/images/logo.svg" id="logo" onclick="alertPlay('play')">

const alertPlay = (message) => alert(message);

Answer 3

您的function将

const alertPlay = (message) => alert(message);

还有HTML

<img src="assets/images/logo.svg" id="logo" onclick="alertPlay('play')">

Answer 4

更新：

您需要这样使用：

const alertPlay = () => () => alert("play");

在您的html中，它应该是：（不需要括号）

onclick="alertPlay"

如果您要传递动态值而不是仅传递play，则需要使用以下命令：

const alertPlay = (str) => () => alert(str);

HTML：

onclick="alertPlay('play')"

如果需要，第二个箭头功能块是传递事件：

const alertPlay = (str) => (e) => {
  console.log(e, str);
}

符合您兴趣的实际答案：

顺便说一句，() => () => {}是public class method。否则，您可以使用内联箭头功能，例如：

onclick="() => alertPlay('play')"

JS：

const alertPlay = (str) => alert(str);

或不带任何参数：

const alertPlay = () => alert('play');

HTML：

onclick="alertPlay()"