设置button.onclick后首次点击提前触发函数，如何优雅实现？

问题根源 #

你写b1.onclick = pageFlip(2)时，代码会立即执行pageFlip(2)，并将函数的返回值（这里是undefined）赋值给onclick事件，所以首次触发pageFlip(1)的时候就直接执行了case 2的逻辑，而不是等下次点击触发。

简洁实现方案 #

以下两种写法都比你当前的匿名函数写法更精简：

• 方案1：使用Function.prototype.bind绑定参数
  bind方法会创建一个新函数，调用时会将指定参数传入原函数，不会立即执行：

b1.onclick = pageFlip.bind(null, 2);

第一个参数是绑定函数运行时的this指向，你的逻辑里不需要用到this，传null即可，第二个参数就是要传给pageFlip的入参。

• 方案2：使用箭头函数简化匿名函数写法

b1.onclick = () => pageFlip(2);

内容的提问来源于stack exchange，提问作者Fort-P