`this.some_property` 在匿名回调函数中变为未定义

所以我不太明白为什么这个变量这个任务在我的目标对象内部的添加事件侦听器中变得未定义。我有一种感觉，它可能与异步编程有关（我仍然不完全理解）。抱歉，我有点 JS 菜鸟，但是如果你们能向我解释我做错了什么以及什么可能是更好的解决方案，那就太棒了！谢谢。

function Goal(name) {
        this.gDiv =  document.createElement('div');
        this.name = name || "goal";
        this.tasks = document.createElement('ul');
        //Sets the styling and content and adds it to the parent element
        this.initialize = function() {
            this.gDiv.className = "default";
            this.gDiv.setAttribute("id", this.name);
            this.gDiv.innerHTML = this.name;
            elem.appendChild(this.gDiv);

            this.gDiv.parentNode.insertBefore(this.tasks, this.gDiv.nextSibling);
            this.tasks.style.display = "none";


        };  
        //Creates a list underneath the a dive associated with the Goal object
        this.addTask = function(task) {
            var newLi = document.createElement('li');
                newLi.innerHTML = task;
                this.tasks.appendChild(newLi);
        };

        this.gDiv.addEventListener('click', function(){
            alert(this.tasks);              
        });

    }

感谢你们！你们都回答了我的问题！我对此已经摸不着头脑有一段时间了。向大家致敬！

当您输入匿名闭包并且“this”发生变化时，范围就会发生变化。你可以通过这样做来破解它

var self = this;

然后使用 self 代替它（例如）：

function Goal(name) {
    var self = this;

    /* ... */

    this.gDiv.addEventListener('click', function(){
        alert(self.tasks);              
    });

如果你使用 jQuery，你可以做一些更好的事情：

this.gDiv.addEventListener('click', $.proxy(function() {
    alert(this.tasks);
 }, this));

无论哪种方式都很好。

编辑：在 ES6 中，可以使用箭头函数，因为它们不绑定自己的“this”，所以它变得更加简单：

this.gDiv.addEventListener('click', () => {
    alert(this.tasks);
 });