4

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 のインスタンスが複数あります。それらの 1 つを呼び出すとrefresh()、その 1 つのリストだけが更新されます。次の例では:

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

このrefresh()呼び出しにより、すべての AjaxLists が更新されるようです。これを行う正しい方法は何ですか?

違いがあれば、jQueryを使用しています。

4

3 に答える 3

7

コンストラクターでプロトタイプ関数を再定義しないでください。特権関数を作成する場合は、コンストラクターから 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);
于 2010-07-05T18:55:24.237 に答える
3
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.
于 2010-07-05T18:59:48.267 に答える
2

違いがあれば、私はjQueryを使用しています。

いいえ、そうではありません。ここで私の答えを参照してください:Javascript、Jquery、Ajaxの違いは何ですか?

コンストラクターで完全に宣言されているクラスがあります

Javascriptにはクラスはありません。それらを忘れる。あなたは本当にそれらを使用するためにこの言語のいくつかの基本を学ぶ必要があります。見た目は似ていますが、Javaではありません。

コンストラクター関数がある場合は、インスタンスが作成されます。共有メソッドプロトタイプチェーンに含まれ、インスタンス固有のデータのみがthisキーワードを使用して関数に直接入力されます。

したがって、オブジェクトの基本的な概念は次のようになります。

// 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
  // ...
}

この概念の威力は、メモリ内にリフレッシュ機能が1つしかないことです。そして、それはどんなインスタンスにも対処できます。さらに、別のオブジェクトがMyObjectから継承する場合、更新関数が継承されます。ただし、メモリには、共有リフレッシュ機能が1つ残っています。また、親インスタンスまたは子インスタンスのいずれかを処理できます。

于 2010-07-05T19:05:39.097 に答える