1

本の 3 つの章があり、次のような独自の URL に配置されているとします。

  • 第 1 章 = /1.html
  • 第 2 章 = /2.html
  • 第 3 章 = /3.html

ここで、OO を考えて 2 つの JS オブジェクトを作成するとします (jQuery の助けを借りて):

  • Chapter : 章を要素に読み込みます。
  • Book : チャプターを縦に (1 つずつ) 表示します。

JS コード:

// Chapter
function Chapter(chapterId)
{
    this.chapterId = chapterId;
}

Chapter.prototype =
{
    getChapterId: function()
    {
        var chapterId = this.chapterId;
        return chapterId;
    },
    loadChapter: function(el)
    {
        $(el).load( this.getChapterId + ".html" ); // Ajax
    }
}

// Book
function Book()
{
    // ?
}

Book.prototype =
{
    // ?
}

あなたの意見では、オブジェクト指向を考えて、オブジェクト「Book」とそのプロトタイプのメソッドを定義する最良の方法は何ですか?

Book.prototype でオブジェクト「章」のインスタンス化を処理する最もエレガントな方法は何ですか?

ありがとうございました

4

4 に答える 4

0

これを試しましたか:

(function (namespace, chapterId) {

var Chapter = function (chapterId) {
    this.chapterId = chapterId;
}

Chapter.prototype ={
getChapterId: function () {
    var chapterId = this.chapterId;
    return chapterId;
},

loadChapter: function (el) {
    $(el).load(this.getChapterId + ".html"); // Ajax
}}

namespace.Chapter = Chapter;
})(new Book(), chapterId);
于 2013-06-19T09:16:58.450 に答える
0

ああ、私はあなたの質問をよく読んでいませんでした。私はこのようなことをします:

// Chapter
var Chapter = function(chapterId) {
    this.chapterId = chapterId;
}

Chapter.prototype.loadChapter: function(el) {
    $(el).load( this.chapterId + ".html" ); // Ajax
}


// Book
var Book = function(chapters) {
    this.chapters = (chapters) ? chapters : [];
    this.numberOfChapters = (chapters) ? chapters : 0; 
    // assume that this has to make sence, so if it is number of chapters, 
    // it start with 0.
}

Book.prototype.addChapter = function () {
    this.chapters.push(new Chapter(++this.numberOfChapters));
}
于 2013-06-19T09:24:00.223 に答える
0

OO スタイルの JavaScript を書き始めたとき、この記事を読みました。そこにいくつかの良いヒントと解決策があります!

于 2013-06-19T09:10:32.430 に答える
0

チャプター ID をパラメーターとして渡し、チャプターBookを配列にロードするだけです。このようなもの:

// Book
function Book(chapters) {
  this.chapters = chapters.map(function(id){ return new Chapter(id) });
}

var book = new Book([1,2,3,4]);

その後、必要に応じてチャプターをループして操作するメソッドを作成できます。

于 2013-06-19T09:12:31.240 に答える