Как организовать мой код в «модулях»? - PullRequest
Новая
       37

Как организовать мой код в «модулях»?

2 голосов
/ 13 марта 2011

Я пытаюсь обернуть голову вокруг организации своего кода. У меня есть несколько модулей в моем проекте, которые я бы хотел организовать.

Дело в том, что все, что пришло мне в голову, не сработало. В настоящее время я думаю о четырех идеях:

  1. Простой объект - бесполезен из-за проблем с областями видимости. Использование this.a будет работать, но this имеет различное значение в зависимости от того, кто его назвал, поэтому оно ненадежно. Например, я однажды назначил функцию классу WebSocket, но внезапно this сослался на экземпляр WebSocket, когда функция была вызвана событием WebSocket. Я мог бы использовать bind(foo) каждый раз, когда вызываю функцию, но, наверное, должен быть другой способ. 

    var foo = {
    a: 3,
    s: function() {
        alert(a); // a doesn't exist in this scope
        alert(this.a); // 'this' isn't always foo
        alert(foo.a); // I would have to put 'foo.' before each variable
                      // reference, but I'm sure that's not the way to do it
   }
};

  2. Экземпляр - a не определен. Опять же, this не надежно. 

    var foo = function() {
    this.a = 3;
    this.s = function() {
        alert(a);
    };
};
var foo_instance = new foo();
foo_instance.a = 4;
foo_instance.s(); // Error: a is not defined

  3. Закрытие экземпляром - ничего не возвращает; остается undefined. 

    var foo = (function() {
    this.a = 3;
    this.s = function() {
        alert(a);
    };
})();
// foo === undefined

  4. Закрытие с помощью метода получения / установки - Прекрасно работает в Chrome, однако IE не поддерживает методы получения / установки. 

    var foo = (function() {
    var a = 3;
    return {
        get a() { return a; },
        set a(v) { a = v; },

        s: function() {
            alert(a); // Doesn't work in IE as getters/setters are
                      // not supported
        }
    };
})();

Как мне эффективно организовать свои модули, чтобы я мог получить доступ к свойствам безопасным и кросс-браузерным способом?

Спасибо.

Ответы [ 3 ]

2 голосов
/ 13 марта 2011

3 не определено, потому что вы ничего не возвращаете. вместо присвоения свойств и методов «this», попробуйте следующее: 

var foo = (function() {
    var self = {};

    self.someProperty = someValue;

    self.someFunction = function () {

    }

    return self;
}());

foo теперь будет возвращать объект с определенными свойствами и методами. Делая это таким образом, вам никогда не придется задумываться о том, что на самом деле означает это.

1 голос
/ 13 марта 2011

Ваш первый фрагмент кода использует замыкание и соответствует шаблону, который был популярен в библиотеке yui . Второй шаблон соответствует понятию частных, общедоступных и привилегированных членов объекта.

Я рекомендую вам прочитать эту основную статью о приватных членах javascript Дугласа Крокфорда и выбрать либо первый, либо второй вариант. Они семантически эквивалентны .

(третий и четвертый фрагменты кажутся мне слишком сложными по сравнению с первыми двумя)

1 голос
/ 13 марта 2011

Мне кажется, что вы не совсем понимаете, как this и замыкания работают в JavaScript.

Пожалуйста, прочтите обе из этих тем, а также посмотрите пространства имен .

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

...