2014-11-27 4 views
0

Часть 1:JS Обозначение «это» при обратном вызове

Как можно динамически ссылаться на родительское свойство из обратного вызова?

Например, если бы у нас была эта структура.

var someClass = { 

    htmlClass : 'aFunClass', 

    bindEvents: function(){ 

     jQuery(function(){ 
      alert(this.htmlClass); 
     }); 
    }); 
} 

В настоящее время это вернет «неопределенный», как его refrencing функции JQuery, а не родители.

Часть 2:

Что бы наиболее динамичный способ сделать это? который поддерживает следующее следующее условие.

var someClass = { 

    htmlClass : 'aFunClass', 

    bindEvents: function(){ 
     var self = this; 

     jQuery(function(){ 
      if(!jQuery('body').hasClass(self.htmlClass)){ 
       self = {}; 
      } 
     }); 
    }); 
} 

В настоящее время, если вы это сделаете, то someClass останется прежним и не станет пустым объектом. Таким образом, назначение его непосредственно другой переменной не работает.

ответ

1

Использовать переменные области видимости «это» вы хотите, чтобы помнить:

var someClass = { 

    htmlClass : 'aFunClass', 

    bindEvents: function(){ 
     var that = this; 
     jQuery(function(){ 
      alert(that.htmlClass); 
     }); 
    }); 
} 

Стандарты именования локальной переменной включают self, THIS, that и т.д. Просто идти с чем-то вам нравится (я предпочитаю использовать THIS в объектно-ориентированном JS, но я в основном работаю с C#, так что-нибудь «thisy» хорошо для меня) :)

+0

Этот метод кажется хорошо для просто доступа к информации внутри нее - однако это не решает дополнительную проблему, которая возникает при этом, если вы посмотрите на мое дополнение к вопросу, который вы сможете увидеть. Спасибо! – Owen

0

Обычная практика держит ссылку на this контекст в переменной:

bindEvents: function(){ 
     var self = this; // keep a reference to this 
     jQuery(function(){ 
      alert(self.htmlClass); 
     }); 
    }); 

Другим решением является binding функция в определенном контексте:

bindEvents: function(){ 
     jQuery(function(){ 
      alert(this.htmlClass); 
     }.bind(this)); 
    }); 
Смежные вопросы