JavaScript "это" путаница

Question

Это, вероятно, довольно легко, но я в замешательстве, так что, может быть, я все еще могу узнать что-то еще сегодня.Я пытаюсь сделать следующее:

var myObj = {};
myObj.src = {}
myObj.src.A = ['1.png','2.png','3.png'];
myObj.A = new Image();
myObj.A.src = this.src.A[0];

Это приведет к ошибке Uncaught TypeError: Cannot read property 'A' of undefined.Когда я использую myObj.src.A[0] вместо this, он работает нормально.

Как правильно использовать это в этом контексте?

Answer 1

this относится к контексту объекта, в котором выполняется код. Поэтому, если у объекта есть метод aMethod, то внутри aMethod this ссылается на объект, которому он принадлежит.

Я предполагаю, что ваш код выполняется в глобальном пространстве имен, поэтому this не определено. На самом деле вы просто хотите myObj.A.src = myObj.src.a[0];.

http://www.quirksmode.org/js/this.html

Answer 2

this в JavaScript сильно зависит от контекста, в котором вызывается функция. Если ваш код (как это выглядит выше) просто висит в теге script на странице, тогда this будет «глобальным» контекстом, который в браузере является объектом window.

Как правило, this относится к объекту / области видимости, к которой принадлежит функция, но существует ряд особых (и полезных) случаев, которые происходят, потому что функции являются значениями первого класса, которые могут быть назначены различным объектам и вызываться в различных контекстах. ,

Может быть полезно несколько длинных разработок, написанных другими:

• https://stackoverflow.com/a/3320706/87170
• http://yehudakatz.com/2011/08/11/understanding-javascript-function-invocation-and-this/
• http://net.tutsplus.com/tutorials/javascript-ajax/fully-understanding-the-this-keyword/
• https://developer.mozilla.org/en/JavaScript/Reference/Operators/Special_Operators/this_Operator

Вначале это может показаться немного сложным, особенно если вы привыкли к языкам, в которых this означает всегда одно, но после изучения нескольких правил это становится довольно простым и действительно очень полезно.

Answer 3

Ключевое слово this всегда отличается в зависимости от области применения. В фрагменте кода, который вы разместили выше, при условии, что вы просто помещаете это в документ где-то в заголовке, this относится к самой странице. Таким образом, в этот момент довольно очевидно, что this.src.A будет неопределенным. Если вы должны применить к нему событие с делегатом, например:

myObj.click = function() {
    alert(this.src.A[0]);
}

Ключевое слово this получает новую область, принадлежащую владельцу делегата (в данном случае myObj). this очень легко отследить, если вы четко определяете свои области действия и границы границ.

Answer 4

this не относится к var myObj в случае вашего кода.Вполне вероятно, что если вы не находитесь в области действия функции или метода объектов, то this ссылается на окно DOM , которое не имеет атрибута src.A

Answer 5

myObj.src.A[0] будет правильным в этом контексте, потому что this ссылается на своего непосредственного родителя.