Улучшите этот фрагмент из класса прототипа

Question

Это фрагмент из класса-прототипа, который я собираю вместе. Обходное решение для области видимости мне кажется немного странным, его можно улучшить или сделать по-другому?

var myClass = Class.create({
    initialize: function() {
        $('formid').getElements().each(function(el){
            $(el).observe("blur", function(){
                this.validateEl(el);
            }.bind(this,el));
        },this);
     },
    validateEl: function(el){
      // validate $(el) in here...
    }
});

Кроме того, мне кажется, что я мог бы сделать что-то подобное для наблюдателей событий:

$('formid').getElements().invoke("observe","blur" ...

Не знаете, как передать ссылки на элементы?

Answer 1

Я не вижу ничего плохого в вашем коде:)

Про наблюдателей можно что-то вроде этого:

$('formid').getElements().invoke("observe","blur", function(e) {
    this.validateEl(e.element());
}.bind(this));

Answer 2

Я думаю, что это будет выглядеть немного менее многословно, если вы создадите метод registerBlur:

var myClass = Class.create({
    initialize: function() {
        $('formid').getElements().each(this.registerBlur, this);
    },
    registerBlur: function(el) {
        Event.observe(el, 'blur', this.validateEl.bind(this, el));
    },
    validateEl: function(el){
      // validate $(el) in here...
    }
});

Но я согласен с Руи Карнейру, я тоже не вижу ничего плохого в вашем коде.

Answer 3

Вы действительно можете упростить этот справедливый бит:

var myClass = Class.create({
    initialize: function() {
        var self = this;

        // To demo that we keep the instance reference, set a
        // property on the instance
        this.message = "Hi there";

        $('formid').getElements().invoke("observe", "blur", blurHandler);

        function blurHandler() {
            // `self` references our instance
            // `this` references the element we're observing
            self.validateEl(this);
        }
    },
    validateEl: function(el){

        // validate $(el) in here...

        // note that because of the way we called it, within this function,
        // `this` references the instance, so for instance:
        this.foo(); // alerts "Hi there!"
    },
    foo: function() {
        alert(this.message);
    }
});

, который использует invoke (как вы предложили) и именованную функцию для обработчика (не нужно именовать, но я нахожучто очень полезно, чтобы у ваших функций были имена).Обработчик является закрытием.В функции initialize я использую переменную для указания на this, потому что переменная будет доступна для замыкания.(Я назвал это self, потому что это стандартная практика, когда псевдоним this по этой причине.) Обработчик использует встроенную функциональность Prototype для установки this в обработчике событий для наблюдаемого элемента.Когда мы вызываем validateEl через ссылку self замыкания, мы вызываем ее как функцию-член, как обычно, поэтому в validateEl, this ссылается на экземпляр.

Говоря об именифункции, ваши функции initialize и validateEl являются анонимными, что означает, что в стеке вызовов и т. д. в отладчиках вы просто увидите "(?)", а не красивое, удобное имя.Я всегда рекомендую реальные именованные функции; больше здесь .