Question

我试图创建类似于d3的东西（例如：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对象是一个函数，则可以调用它来获取新实例。

＆＃13;

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)");

＆＃13;

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>

每个调用都有新实例的命名空间

2 个答案: