Javascript addEventListener的最佳方式

我有一个按钮，想将EventListener添加到此按钮。 问题是：编写代码的最佳方式是什么

v1:

v2:

---

注意：BackBtn不用于下面的代码中。在我的项目中，有这么多这样的按钮，如果我将v1用于30个按钮，可能会影响性能吗？

v2非常好，即使有100个按钮和v1，性能也不会明显下降，但v2通常更易于编辑，维护、重读和/或更改代码所需的时间更少。 使用v2。如果你能很好地阅读，那么代码越少越好。

这是怎么回事：

const $ = document.querySelector; // Since you don't use jquery
$('.back').addEventListener('click', load_from_breackpoint);

---

它们是等价的，两者的性能都不比另一个高。这不会对性能产生任何合理的影响，但是有这么多的按钮会使代码难看，在大多数情况下，代码的清晰性应该是最重要的。考虑使用一种不同的方法使代码更干燥，如果你有很多需要相同的侦听器的按钮，给他们所有相同的类，使用<代码> QueRelielTurror（）/代码>，并使用<代码>前缀循环将它们添加到每一个监听器中。不能对30个元素使用v1

querySelector（）

只返回一个元素，因此条件是一个静音点。最坏的情况是，变量在全局范围内，您任意地有一个未使用的延迟变量。这不是一个很大的性能问题。这并不能回答问题，让代码看起来像jQuery，而实际上它不是jQuery，这是在为将来的缺陷做准备。见

document.querySelector('.back').addEventListener('click', load_from_breackpoint);

const $ = document.querySelector; // Since you don't use jquery
$('.back').addEventListener('click', load_from_breackpoint);