Jak uzyskać obiekty klasowe w JavaScript za pomocą jQuery?

Question

Próbuję przejść od prototypu do jQuery i jest ostatnia rzecz, której nie mogę znaleźć w nowej bibliotece.

Oto co kiedyś zrobić z Prototype:

MyClass = Class.create(); 

MyClass.prototype = { 
    initialize: function(options) { 
    } 
} 

Wtedy mógłbym stworzyć nową MyClass z:

var mc = new MyClass({}); 

Czy jQuery ma czegoś takiego prototypu Class.create()? A jeśli nie, jak mogę uzyskać takie same rzeczy bez biblioteki?

Answer 1

korzystać z funkcji jquery extend przedłużyć prototyp klasy.

Na przykład:

MyWidget = function(name_var) { 
    this.init(name_var); 
} 

$.extend(MyWidget.prototype, { 
    // object variables 
    widget_name: '', 

    init: function(widget_name) { 
    // do initialization here 
    this.widget_name = widget_name; 
    }, 

    doSomething: function() { 
    // an example object method 
    alert('my name is '+this.widget_name); 
    } 
}); 

// example of using the class built above 
var widget1 = new MyWidget('widget one'); 
widget1.doSomething(); 

Uwaga: zadałem related question o tym samym temacie.

Answer 2

Nigdy tego nie robiłem, ale wyobrażam sobie, że przyjrzenie się niektórym wtyczkom takim jak Thickbox może być pomocne.

Answer 3

jQuery używa standardowej funkcjonalności javascript do tworzenia nowych klas.

Jest kilka dobrych przykładów w sieci, ale polecam zajrzeć do książek Davida Flanagana Javascript: The Definitive Guide.

Object-Oriented JavaScript

JavaScript and Object Oriented Programming (OOP)

---

przepraszam, ja całkowicie niezrozumiany oryginalny post. Zgaduję, że rzeczywiście chcesz wiedzieć, jak rozszerzyć obiekt $ jQuery. Jest to łatwe do zrobienia, istnieje duża liczba wtyczek do tego celu. Jest to poradnik na stronie jQuery dla tej operacji: Getting Started With jQuery

Zasadniczo jednak użyć

jQuery.fn.foobar = function() { 
    // do something 
}; 

Answer 4

fantastyczny plugin klasą zapytania Johna Resig zapewnia dokładnie to, czego szukasz:

http://ejohn.org/blog/classy-query/

Answer 5

W JavaScript, regularny funkcja działa jako konstruktor, jeżeli są stosowane z „nowych” słowa kluczowego.

Więc można zrobić,

function MyClass(options) 
{ 
    this.options = options; 
}; 

MyClass.prototype.initialize = function() { } ; 

MyClass.prototype.sayHello = function() { alert('Hello!'); }; 

var item = new MyClass({ id : 10 }); 
item.sayHello(); //alerts Hello! 
alert(item.options.id); //alerts 10. 

Sugerowałbym, aby spróbować zrozumieć, jak faktycznie działa JavaScript. Wypróbuj understand prototype inheritance as opposed to class based inheritance. Dobra znajomość JavaScriptu pomoże ci wykorzystać moc tego języka.

Answer 6

Można użyć standardowego JavaScript:

MyClass = function(options) { 
    console.log(options); 
}; 

var mc = new MyClass([1,2,3]); 

Można użyć jQuery aby zapewnić dziedziczenie: http://docs.jquery.com/Utilities/jQuery.extend#deeptargetobject1objectN

Answer 7

Można w zasadzie skopiuj odpowiednią część z kodu źródłowego prototypu i pozostawić części o rozszerzenie. http://github.com/sstephenson/prototype/blob/add69978e09653808aedec43ed551df22818ee30/src/lang/class.js

jQuery nie posiada takiego systemu do tworzenia i rozbudowy obiektu, ponieważ cały system wydaje się zależeć od jQuery łańcuchowych (do jeresig: Przepraszam, jeśli się nie mylę). Więc i tak musisz stworzyć swój własny system.

Aby uzyskać pomysł, Douglas Crockford ma dobrze znany wzorzec do tworzenia obiektów i dziedziczenia w JavaScript. http://javascript.crockford.com/prototypal.html

Answer 8

jQuery nie definiuje prymitywów OOP, więc jesteś sam. Ale to jest łatwe do zrobienia, co chcesz ze zwykłego JavaScript:

MyClass = function(options){ 
    // whatever were in your initialize() method 
}; 

i można tworzyć instancje jak dawniej:

var mc = new MyClass({}); 

Jeśli używane mieć więcej rzeczy w prototypie można dodać im jak dawniej:

MyClass.prototype = { 
    // no need for initialize here anymore 
    /* 
    initialize: function(options) { 
    }, 
    */ 

    // the rest of your methods 
    method1: function() { /*...*/ }, 
    method2: function() { /*...*/ } 
} 

Ewentualnie można dodać metody dynamicznie:

$.extend(MyClass.prototype, { 
    method1: function() { /*...*/ }, 
    method2: function() { /*...*/ } 
}); 

I wreszcie można podać swoje własne klasy Autor:

var CreateClass = function(){ 
    return function(){ this.initialize.apply(this, arguments); }; 
}; 

// the rest is a copy from your example 

MyClass = CreateClass(); 

MyClass.prototype = { 
    initialize: function(options) { 
    } 
} 

var mc = new MyClass({}); 

Answer 9

Dobrym rozwiązaniem Johna Resig: Simple JavaScript Inheritance

Answer 10

można spróbować JS.Class (Portable, modułowa biblioteka JavaScript klasa) - http://jsclass.jcoglan.com/

Answer 11

myślę, theres easyer sposób ...

function Dashboard() { 
    var dashboard = this; 
    dashboard.version = 'Version 0.1'; 
    dashboard.__init = function() { 
      console.log('init'); 
    }; 
    dashboard.__init(); 
} 
var dash = new Dashboard(); 

will log 'init'