Javascript JS：使用嵌套函数的正确方法？_Javascript

Javascript JS：使用嵌套函数的正确方法？

javascript

Javascript JS：使用嵌套函数的正确方法？,javascript,Javascript,如果我有一个事件监听器，并且希望使用一个点击事件来定位一个函数，那么定义该函数的首选方法是在范围之外，还是可以将其嵌套在范围内例如： function createNewDiv(str) { let target = document.getElementById('answer-500'); target.addEventListener('click', addNewEl); function addNewEl() { // should it be def

如果我有一个事件监听器，并且希望使用一个点击事件来定位一个函数，那么定义该函数的首选方法是在范围之外，还是可以将其嵌套在范围内

例如：

function createNewDiv(str) {
   let target = document.getElementById('answer-500');
   target.addEventListener('click', addNewEl);

   function addNewEl() {
      // should it be defined here out as a new function in the same parent scope as `createNewDiv(str)`
   }
}

如果函数依赖于

createNewDiv

中的变量，则函数通常应在内部定义。例如，要在内部记录

str

，函数也应在内部：

function createNewDiv(str) {
   let target = document.getElementById('something');
   target.addEventListener('click', doLog);

   function doLog() {
      console.log(str);
   }
}

因为

doLog

依赖于

str

的作用域，所以参数

如果函数不依赖于

createNewDiv

的任何本地内容，那么您可以将函数放在内部或外部，这可能无关紧要

如果您希望以后能够从外部删除侦听器，那么应该在外部定义函数，这样您就可以执行

removeEventListener（elm，fn）

。（如果函数在内部定义，则除非

removeEventListener

调用在词汇上也在内部，否则该函数将不起作用）

将函数放在外部可能会导致通常微不足道的性能改进，因为这样一来，函数只需创建一次（好的，每次外部块运行时），而不是每次

createNewDiv

运行时

如果每个这样的元素连接的侦听器不超过一个，那么使用单个外部侦听器而不是多个内部侦听器的一种可能方法是使用映射将每个元素映射到关联的

str

，例如：

const strsByElm = new Map();
function adNewEl() {
  const str = strsByElm.get(this);
  console.log(str);
}
function createNewDiv(str) {
   let target = document.getElementById('answer-500');
   target.addEventListener('click', addNewEl);
   strsByElm.set(target, str);
}