0

継承を加えたモジュールのパターンを把握しようとしています。私は大学出身で、主に Java をトランクに入れていますが、Web 技術に携わって約 10 年になります。私は JavaScript を始めて 1 年ほどしか経っていませんが...

とにかく、単純な継承 ( .prototype) の例を試しています。Peopleオブジェクトからを追加し、それらのメソッドGentlemanを使用してそれらを一覧表示できます。.toString()AGentlemanは a の子Humanです。「abstract」を実装するまではうまくいきましHumanたが、コードが実行されなくなりました。

私のコードで何が悪いと考えられているかについてコメントしてください。モジュール/プロトタイプのアプローチにとどまりたいのですが、何が間違っていますか? thisまた、さまざまな文脈で何を意味するのかを聞きます。つまり、Peopleプライベート_peopleを直接使用できますが、サブモジュールでは使用する必要がありますthis._name-なぜですか?

var People = People || {};

People = (function() {
    var People = function(){
        this._people = [];
    };

    var addGentleman = function (name) {
        this._people.push(new People.Gentleman(name));
    };

    var getList = function () {
        var temp = [];

        for (var i = 0; i < this._people.length; i++) {
            temp.push(this._people[i].toString());
        }

        return temp;
    };

    People.prototype.constructor = People;
    People.prototype.addGentleman = addGentleman;
    People.prototype.getList = getList;

    return People;
})();

People.Human = (function () {
    var Human = function (name, hasLadyParts) {
        this._name = name;
        this._hasLadyParts = hasLadyParts;
    };

    var hasLadyParts = function () {
        return this._hasLadyParts;
    };

    var toString = function () {
        var str = this._name;
        if (!this._hasLadyParts) str += ' no';
        return str + ' lady parts.';
    };

    Human.prototype.constructor = Human;
    Human.prototype.hasLadyParts = hasLadyParts;
    Human.prototype.toString = toString;

    return Human;
})();

People.Gentleman = (function () {
    var Gentleman = function (name) {
        People.Human.call(this, name, false);
    }

    var toString = function () {
        return 'Mr.' + People.Human.toString();
    };

    // Gentleman.prototype = Object.create(People.Human.prototype);
    Gentleman.prototype.constructor = Gentleman;
    Gentleman.prototype.toString = toString;

    return Gentleman;
})();

$(function () {
    var people = new People();
    people.addGentleman('Viktor');
    people.addGentleman('Joakim');
    var list = people.getList();
    var $ul = $('#people');

    for (var i = 0; i < list.length; i++) {
        $ul.append('<li>' + list[i] + '</li>');
    }
});

フィドル: http://jsfiddle.net/5CmMd/5/

編集:コードを更新し、少しいじりました。これが機能するようになれば、設計のほとんどを理解できたと思います。この例は、JavaScript の世界を訪れる将来の OOP プログラマーのための簡単なチュートリアルとしても機能すると思います。

4

2 に答える 2