Object.assign与NodeList

Question

I'm building a simple DOM utility library, similar to jQuery is ES6.

class jQuery {

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

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

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

I'm trying to merge this with my elements, both types are objects but the results its just an empty object (this).

But, if I merge this with { foo: 'bar' } its working.

Can someone explain me why this is happening?

Live at https://jsbin.com/zupece/edit?js,console,output

Answer 1

I think that NodeList does not support get the way you want it to, which is used by Object.assign .

You could just assign it as an composite:

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

This is more OOP anyway. Besides, various JavaScript engines can now try to optimize your code for better performance. This is much less possible while using Object.assign .