Объектно-ориентированные инструменты JavaScript - PullRequest
5 голосов
/ 13 апреля 2011

Я работал над пользовательским интерфейсом моего веб-сайта ( www.swalif.com : используйте хром, чтобы переводить, если хотите). Не будучи знакомым с jQuery, я начал с JavaScript, и теперь файл огромен: около 1000 строк кода. Кроме того, код становится сложным для обработки и изменения.

Поэтому я искал способ, которым я мог бы подойти к этой проблеме объектно-ориентированным способом, который привел бы к чистой, повторно используемой системе с хорошей архитектурой. Также было бы неплохо использовать функции, предоставляемые JQuery, чтобы сохранить код небольшим .

Проблема в том, что существует множество инструментов, и я не могу решить, в какой из них потратить время для выполнения этой задачи. например mootools, prototype, jQuery и т. д. Поэтому мне нужен кто-то, чтобы вести меня в правильном направлении.

Это наш сайт www.swalif.com . Любые другие предложения также приветствуются.

Ответы [ 4 ]

3 голосов
/ 13 апреля 2011

На самом деле не используйте фреймворк для реализации вашего ООП. Вы получаете более глубокое понимание Javascript как языка, когда сталкиваетесь с мелочами использования очень гибкой системы-прототипа функций Javascript для реализации ООП-подобных операций.

Читайте об этом здесь: http://phrogz.net/JS/Classes/OOPinJS.html.

3 голосов
/ 13 апреля 2011

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

Именно поэтому MooTools был создан.

Тем не менее, если вы не знакомы с JS, было бы довольно трудно понять MooTools, так как это не фреймворк для начинающих.Опять же, если вы поймете понятие ООП, у вас все будет в порядке.

3 голосов
/ 13 апреля 2011

Для объектно-ориентированной разработки javascript я бы порекомендовал John Resig's Simple javascript Inheritance .Это небольшой кусочек JavaScript, который позволяет вам определять классы, наследовать от базовых классов и переопределять методы.

var Person = Class.extend({
  init: function(isDancing){
    this.dancing = isDancing;
  },
  dance: function(){
    return this.dancing;
  }
});
var Ninja = Person.extend({
  init: function(){
    this._super( false );
  },
  dance: function(){
    // Call the inherited version of dance()
    return this._super();
  },
  swingSword: function(){
    return true;
  }
});

var p = new Person(true);
p.dance(); // => true

var n = new Ninja();
n.dance(); // => false
n.swingSword(); // => true

// Should all be true
p instanceof Person && p instanceof Class &&
n instanceof Ninja && n instanceof Person && n instanceof Class
0 голосов
/ 13 апреля 2011

Если вам нужно только организовать свой код и не нужны библиотеки, вы можете использовать http://code.google.com/p/joose-js/. В противном случае используйте модель oop используемой вами библиотеки.

Простой пример

Module("Test", function (m) {
    Class("Point", {
        has: {
            x: {
                is:   "rw",
                init: 0
            },
            y: {
                is:   "rw",
                init: 0
            }
        },
        methods: {
            clear: function () {
                this.setX(0);
                this.setY(0);
            }
        }
    })
})
...