使用具有對象文字表示法和繼承的命名空間

Question

我正在使用帶有對象文字表示法的名稱間隔。 我想使用原型對象繼承，以便Scene是Snippet “子類”。

我無法正確啟動Scene對象。

console.log(scen1 instanceof xxx.prototypes.Scene); // false

基本上， Scene對象應具有Snippet Scene +中的所有屬性和方法，結果應為：

console.log(scen1 instanceof xxx.prototypes.Scene); // true

知道我在這里做錯了嗎？

;
(function(xxx, window) {
    xxx.prototypes = {
        Snippet: function(snippetId) {
            var parent = this;
            this.id = snippetId;
            this.data;
            this.isVisible = 'test';
            this.isFocused = false;
            this.focus = function() {};
            this.render = function() {};
        },
        Scene: function(scenaId) {
            xxx.prototypes.Snippet.call(this);
            xxx.prototypes.Scene.prototype = Object.create(xxx.prototypes.Snippet.prototype);
            xxx.prototypes.Scene.prototype.constructor = xxx.prototypes.Snippet;
            xxx.prototypes.Scene.prototype.isScene = true;
            xxx.prototypes.Scene.prototype.isActive;
        }
    };
}(window.xxx= window.xxx|| {}, window));

//-----------------------------------------------------
function start() {
    var snip1 = new xxx.prototypes.Snippet('snip1');
    snip1.data = 'snippet-data-1';
    snip1.focus();

    var scen1 = new xxx.prototypes.Scene('scen1');
    scen1.data = 'scene-data-1';
    scen1.focus();      

    console.log(snip1 instanceof xxx.prototypes.Snippet); // TRUE
    console.log(scen1 instanceof xxx.prototypes.Scene); // FALSE PROBLEM HERE
}

---

回答

(function(xxx, window) {
    xxx.prototypes = {
        Snippet: function(snippetId) {
            var parent = this;
            this.id = snippetId;
            this.data;
            this.isVisible = 'test';
            this.isFocused = false;
            this.focus = function() {};
            this.render = function() {};
        },
        Scene: function(scenaId) {
            xxx.prototypes.Snippet.call(this, scenaId);
            this.isScene = true;
            xxx.prototypes.Scene.prototype.isActive;
        }
    };
}(window.xxx= window.xxx|| {}, window));



//-----------------------------------------------------
function start() {
    var snip1 = new xxx.prototypes.Snippet('snip1');
    snip1.data = 'snippet-data-1';
    snip1.focus();


    var scen1 = new xxx.prototypes.Scene('scen1');
    scen1.data = 'scene-data-1';
    scen1.focus();


    console.log(snip1 instanceof xxx.prototypes.Snippet); // TRUE
    console.log(scen1 instanceof xxx.prototypes.Scene); // TRUE
    console.log(scen1);
}
start();

Answer 1

您在此處更改了場景的原型：

xxx.prototypes.Scene.prototype = Object.create(xxx.prototypes.Snippet.prototype);

查看有關Object.create的本文

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/create

編輯->

   Scene: function(scenaId) {
            xxx.prototypes.Snippet.call(this, scenaId);
            this.isScene = true;
            xxx.prototypes.Scene.prototype.isActive;
   }