Question

我正在使用这种方法most popular question on closure in JS

进行循环闭包检查

我不明白的是我在哪里更改了关闭代码。我尝试将'help'的值作为参数传递给闭包函数。

function showHelp(help) {
  document.getElementById('help').innerHTML = help;
}

function makeHelpCallback(help) {

/// HERE'S THE CHANGE
  return function (help) {
// instead of return function () {
    showHelp(help);
  };
}

function setupHelp() {
  const helpText = [
    { id: 'email', help: 'Your e-mail address' },
    { id: 'name', help: 'Your full name' },
    { id: 'age', help: 'Your age (you must be over 16)' },
  ];

  for (let i = 0; i < 1; i++) {
    const item = helpText[i];
    document.getElementById(item.id).onfocus = makeHelpCallback(item.help);
  }
}

setupHelp();

我希望'help'的值绑定到外部范围，所以我仍然会得到“您的年龄（您必须年满16岁）”三倍的值。但是，我得到了 [object FocusEvent] 。我不知道这是怎么回事。

我试图用Chrome调试它，但是没有效果。

Answer 1

执行此操作时，您正在使用同名的函数参数来隐藏闭包：

function makeHelpCallback(help) {        // this<- |
                                         //        |
  return function (help) {  // <-- this shadows -  |
    showHelp(help);        // help is no longer refers to the closure it refers to the argument 
  };
}

相反，如果您创建一个不带help参数的内部函数，则函数主体中的帮助将引用外部闭包：

function showHelp(help) {
  console.log(help)
}

function makeHelpCallback(help) {
  return function() {
    showHelp(help); // here help refers to the closure
  };
}

let f = makeHelpCallback("test1")
let f2 = makeHelpCallback("test2")

f()
f2()

如果您的内部函数需要使用一个参数，请将其命名为其他名称，以免破坏外部help。

闭环内部-FocusEvent问题

1 个答案: