Object.assign this 与 NodeList

Question

我正在构建一个简单的 DOM 实用程序库，类似于 jQuery 是 ES6。

class jQuery {

    constructor(selector) {            
        let elements = document.querySelectorAll(selector);
        Object.assign(this, elements);
    }
}

let $ = selector => new jQuery(selector);

console.log($('h1'));

我正在尝试将它与我的元素合并，两种类型都是对象，但结果它只是一个空对象（this）。

但是，如果我将 this 与 { foo: 'bar' } 合并，它的工作原理。

谁能解释一下为什么会这样？

直播https://jsbin.com/zupece/edit?js,console,output

Answer 1

我认为NodeList 不支持get 你想要的方式，Object.assign 使用它。

您可以将其分配为复合：

class jQuery {

    constructor(selectorOrElement) {

        this.elements = selectorOrElement instanceof HTMLElement ? [selectorOrElement] : document.querySelectorAll(selector);
    }

    addClass(className) {

        this.elements.forEach(function (element) {

            element.classList.push(element);
        });
    }

    each(callback) {

        for (var i = 0; i < this.elements.length; i++) {

            var scope = this.elements[i];
            callback.call(scope, i, new jQuery(scope)); 
        }
    }
}

无论如何，这更 OOP。此外，各种 JavaScript 引擎现在可以尝试优化您的代码以获得更好的性能。使用Object.assign 时，这种可能性要小得多。