JavaScript：公共方法和原型

Question

我不完全確定如何在JS中實現OOP概念。

我這是在它的構造完全聲明的類：

function AjaxList(settings) 
{ 

    // all these vars are of dubious necessity... could probably just use `settings` directly 
    var _jq_choice_selector = settings['choice_selector']; 
    var _jq_chosen_list = settings['chosen_list']; 
    var _cb_onRefresh = settings['on_refresh']; 
    var _url_all_choices = settings['url_choices']; 
    var _url_chosen = settings['url_chosen']; 
    var _url_delete_format = settings['url_delete_format']; 

    var jq_choice_selector_form = _jq_choice_selector.closest("form"); 
    if (DEBUG && jq_choice_selector_form.length != 1) 
    { 
     throw("There was an error selecting the form for the choice selector."); 
    } 

    function refresh() 
    { 
     _updateChoicesSelector(); 
     _updateChosenList(); 
     _cb_onRefresh(); 
    }; 

    AjaxList.prototype.refresh = refresh; // will this be called on all AjaxLists, or just the instance used to call it? 
    // AjaxList.refresh = refresh; // will this be called on all AjaxLists, or just the instance used to call it? 

    // ... 
} 

有AjaxList的多個實例。當我在其中一個電話上撥打refresh()時，我只想要一個列表來刷新自己。在以下情況下：

term_list = AjaxList(settings); 
term_list.refresh(); 

調用refresh()調用似乎使所有AjaxLists自己刷新。什麼是正確的方法來做到這一點？

我使用jQuery，如果它有任何區別。

Answer 1

您不應該在構造函數中重新定義原型函數。 如果你想創建一個特權函數，使用this.methodname = ...從構造函數。

function AjaxList() { 
    var privateVar = 0; 
    function privateFunction() { 
    //... 
    } 
    //create a refresh function just for this instance of the AjaxList 
    this.refresh = function() { 
    //privileged function, it can access the 'privateVar & privateFunction' 
    privateVar++; 
    } 
} 
//public functions that don't need access to the private variables/functions 
AjaxList.prototype.publicFunction=function() { 

}; 

此外，如果你想創建一個合適的對象，您需要更改

term_list = AjaxList(settings); 

到

term_list = new AjaxList(settings); 

Answer 2

AjaxList = function(settings) { 
    this._jq_choice_selector = settings["choice_selector"]; 
    this._jq_chosen_list = settings["chosen_list"]; 
    this._cb_onRefresh = settings["on_refresh"]; 
    this._url_all_choices = settings["url_choices"]; 
    this._url_chosen = settings["url_chosen"]; 
    this._url_delete_format = settings["url_delete_format"]; 

    this.jq_choice_selector_form = _jq_choice_selector.closest("form"); 
    if (DEBUG && jq_choice_selector_form.length != 1) { 
     throw "There was an error selecting the form for the choice selector."; 
    } 
}; 

AjaxList.prototype = { 
    _updateChoicesSelector: function() { }, 
    _updateChosenList: function() { }, 
    _cb_onRefresh: function() { }, 

    refresh: function() { 
     this._updateChoicesSelector(); 
     this._updateChosenList(); 
     this._cb_onRefresh(); 
    } 
}; 

鑑於結構，你應該能夠撥打：

var ajaxList = new AjaxList(settings); 
ajaxList.refresh(); // etc. 

Answer 3

我使用jQuery，如果它使任何 區別。

不，它不。見我的答案在這裏：What's the difference between Javascript, Jquery and Ajax?

我有一個類，這是在其構造完全 宣佈

有在Javascript沒有課。忘記他們。你真的需要學習一些這種語言的基礎知識才能使用它們。這不是Java，儘管它看起來很相似。

如果你有一個構造函數它會創建一個實例。所述共享方法將在原型鏈，和唯一的實例特定的數據進入正確的與此關鍵字的功能。

所以對象的基本概念是這樣的：

// constructor of an instance 
function MyObject(param1, param2) { 
    this.param1 = param1; 
    this.param2 = param2; 
    this.param3 = 32; 
    return this; // [optional] 
} 

// Public methods can be called by any instance. 
// Instances share their prototype object. 
// The this keyword always points to the current 
// instance that calls the method. 
MyObject.prototype.sum = function() { 
    return this.param1 + this.param2 + this.param3; 
} 

// refresh should be a shared method, since it 
// does the same thing on every instance 
MyObject.prototype.refresh = function() { 
    // do the refresh 
    // ... 
} 

的動力這一概念的是有記憶只有一個刷新功能。它可以處理任何實例。另外，如果另一個對象繼承自MyObject，則刷新功能將被繼承。但是在內存中還是會有共享刷新功能。它可以處理任何父或子實例。