ExtJS 3: Два способа создания собственного класса: в чем разница? - PullRequest
12 голосов
/ 07 ноября 2010

Я пытаюсь изучить ExtJS и объектно-ориентированный JavaScript в целом. Я видел людей, определяющих классы в пользовательских пространствах имен несколькими способами. В чем разница между этими двумя методами?

Метод 1

Ext.ns('myapp.cars');
(function(){
    var Car = Ext.extend(Object, {
       //...
    })

    myapp.cars.Car = Car;
})()

Метод 2

Ext.ns('myapp.cars');
myapp.cars.Car = Ext.extend(Object, {
       //...
});

Метод 2 легче читается и требует меньше кода; Есть ли причина, почему метод 1 лучше? Спасибо!

Ответы [ 2 ]

6 голосов
/ 07 ноября 2010

Следующие значения практически эквивалентны:

var Car = Ext.extend(Object, {
   //...
});

myapp.cars.Car = Car;

... и:

myapp.cars.Car = Ext.extend(Object, {
   //...
});

В первом примере вы будете использовать временную переменную для хранения ссылки на вновь созданный объект, который затем копируется в myapp.cars.Car (ссылка копируется, а не объект). Во втором примере вы бы присваивали ссылку на объект непосредственно myapp.cars.Car.

Причина, по которой ваш первый пример был заключен в самовозглашающуюся анонимную функцию (function(){ })(), заключается в ограничении области действия этой временной переменной. Обычно это делается для того, чтобы не загрязнять глобальное пространство имен этой переменной Car. Если в другом месте определена другая переменная Car, она не будет конфликтовать с этой. Пример:

var Car = "My Nice Car";

(function(){
    var Car = Ext.extend(Object, {
       //...
    });

    myapp.cars.Car = Car;
})();

alert(Car); // Still "My Nice Car"
            // No conflict with the `Car` variable in the self invoking function.
6 голосов
/ 07 ноября 2010

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

Например:

Ext.ns('myapp.cars');
(function(){

    var carInfo = {
      goodEngine: true
    };

    var Car = Ext.extend(Object, {
       info: carInfo
    });

    myapp.cars.Car = Car;
})()

// carInfo is undefined here, so this will give an error
alert( carInfo.goodEngine );

Итак, первый метод весьма полезен, если вы работаете с множеством переменных, которые не будете использовать позже.

...