各インスタンスの新しいインスタンスを持つネームスペース

Question

d3（ex：d3.select（））と同様のものを作成しようとしていますが、はるかに単純で、ネームスペース関数を呼び出すたびに新しいインスタンスを作成する必要があります。これは可能なのですか、あるいは私はこの間違った方向に近づいていますか？

var dom = new function() { 
    var Element = null; 
    this.select = function (query) { 
     Element = document.querySelector(query); 
     return this; 
    }; 
    this.append = function (elem) { 
     Element.append(elem); 
     return this; 
    }; 
}; 

、所望の用途は

var bodyelement = dom.select("body"); 
var p = dom.select("p"); 

Answer 1

あなたはdomオブジェクトを使用するたびにいくつかのコードを実行する必要があります。したがって、domオブジェクトが関数だった場合は、それを呼び出して新しいインスタンスを取得することができます。

var dom = function() { 
 
    var Element = null; 
 
    var newdom = {}; 
 
    newdom.select = function (query) { 
 
     Element = document.querySelector(query); 
 
     return this; 
 
    }; 
 
    newdom.append = function (elem) { 
 
     Element.append(elem); 
 
     return this; 
 
    }; 
 
    return newdom; 
 
}; 
 

 
console.log(dom() === dom(), "(false means the instances are different)");

Answer 2

var dom = new function() { 
 
    var Element = null; 
 
    this.select = function (query) { 
 
     Element = document.querySelector(query); 
 
     return this; 
 
    }; 
 
    this.append = function (elem) { 
 
     Element.append(elem); 
 
     return this; 
 
    }; 
 
     
 
    // add a way of accessing the resulting Element 
 
    this.element = function() { return Element; } 
 
}; 
 

 
console.log(dom.select("body").element()); 
 
console.log(dom.select("p").element());

<p>blah</p>