Question

如果我按如下方式创建一个Object：

window.Something = {
    X: function() {
        // statements...
    }
};

在不使用this的情况下访问此对象的最佳方法是什么？

示例：

如果我使用以下方式调用X属性：

window.addEventListener("DOMContentLoaded", window.Something.X);

在这种情况下，使用this将访问窗口，而不是Something。我想过这种方法，但我认为这是一种不好的做法。

window.Something = {
    X: function() {
        var This = window.Something;

        // statements...
    }
};

有一种隐式方法可以始终访问创建属性的real对象吗？

Answer 1

如果我正确理解您的问题，那么您可能想要使用bind：

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_objects/Function/bind

做这样的事情：

window.addEventListener("DOMContentLoaded", Something.X.bind(Something));

这将确保在Something.X的通话中，this指向Something。

更有用的信息：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this

Answer 2

使用bind()使用相应的this：

调用处理程序

window.addEventListener("DOMContentLoaded", window.Something.X.bind(window.Something));

Answer 3

没有人指出 为什么 正在发生这种情况。

根据MDN：

使用addEventListener()将处理函数附加到元素时，处理程序中this的值是对元素的引用。它与传递给处理程序的事件参数的currentTarget属性的值相同。

换句话说，this引用window对象，因为事件侦听器附加到window对象。例如，如果您将事件监听器附加到input元素，则this.name将引用该事件所附加的name元素的input属性。

Example Here

＆＃13;

window.Something = {
  name: 'Some name',
  X: function() {
    console.log(this.name); // 'test'
  }
};

document.getElementById('target').addEventListener('input', Something.X);

＆＃13;

<input id="target" name="test" />

＆＃13;

正如其他人所指出的那样，您可以使用bind() method更改this的值：

Example Here

＆＃13;

window.Something = {
    name: 'Some name',
    X: function () {
        console.log(this.name); // 'Some name'
    }
};

window.addEventListener("DOMContentLoaded", Something.X.bind(Something));

＆＃13;

或者，您也可以在匿名函数中执行X方法。这会阻止addEventListener()方法修改this的值。

Example Here

＆＃13;

window.Something = {
    name: 'Some name',
    X: function () {
        console.log(this.name); // 'Some name'
    }
};

window.addEventListener("DOMContentLoaded", function () {
    Something.X();
});

＆＃13;

Answer 4

不需要引用窗口（当您在全局范围内声明变量时，窗口始终是对象），您也可以使用bind（）或包装器函数。这将引用范围中的第一个对象。请尝试以下代码

Something = {
    X: function()
    {
        // statements...
        console.log(this);

    }
};
window.addEventListener('click',function(){Something.X()});

JavaScript - 始终访问特定对象的最佳方式

4 个答案: