Question

我在javascript回调函数中有些含糊不清。

第一个代码的结构如下：

    var ARTISTS: Artist[] = [
      {
         "name": "Barot Bellingham",
         "shortname": "Barot_Bellingham",
         "reknown": "Royal Academy of Painting and Sculpture",
         "bio": "Some bio here...",
         "friends": "James, Harry, Bob"
      }

当我运行上面的脚本时，<ul> <li>James</li> <li>Harry</li> <li>Bob</li> </ul>会在不单击按钮的情况下执行。

经过一些研究，我在javascript中读到了function firstFunction() { var message = "something"; secondFunction(message); } function secondFunction(message) { var myButton = document.getElementById("my-button"); myButton.addEventListener('click',thirdFunction(message)); } function thirdFunction(message) { console.log("the messages is: "+message); }。然后我将代码更改为以下结构：

thirdFunction

我得到了预期的结果。只有在单击按钮时才会执行closure。

我不确定我的第二个代码结构是否正确？我不确定我是否正确地获得了闭包概念，因为我以前从未在传统编程中返回过函数。这对我来说是一个新概念。如果我错了，请纠正我。

修改一些解决方案建议像这样编写：

function firstFunction()
{
 var message = "something";
 secondFunction(message);
}

function secondFunction(message)
{
   var myButton = document.getElementById("my-button");
   myButton.addEventListener('click',thirdFunction);
}

function thirdFunction(message)
{
  return function(){
  console.log("the messages is: "+message);
  }
}

为了代码可读性，我试图避免这种情况。我更喜欢将thirdFunction的代码放在myButton.addEventListener('click', function() { thirdFunction(message) });之外。

Answer 1

使用匿名函数在正确的环境中生成闭包：

function secondFunction(message)
{
   var myButton = document.getElementById("my-button");
   myButton.addEventListener('click', function() {
     thirdFunction(message)
   });
}

在将参数传递给回调函数时

1 个答案: