实现一个jQuery的API

window.jQuery = function(nodeOrSelector){
    let nodes={}
    if(typeof nodeOrSelector === 'string'){
        let temp = document.querySelectorAll(nodeOrSelector)    
        for(let i=0;i<temp.length;i++){
            nodes[i] = temp[i]
        }
        nodes.length = temp.length;
    }else if(nodeOrSelector instanceof Node){
        nodes ={
            0:nodeOrSelector,
            length:1
        }
    }
    nodes.addClass = function(classes){
        classes.forEach((value) => {
            for(let i=0;i<nodes.length;i++){
                nodes[i].classList.add(value)
            }
        })
    }
    nodes.text = function(text){
        if(text === undefined){
            var texts = []
            for(let i = 0;i<nodes.length;i++){
                texts.push(nodes[i].textContent)
            }
            return texts
        }else{
            for(let i=0;i<nodes.length;i++){
                nodes[i].textContent = text
            }
        }
    }
    return nodes
}

window.$ = jQuery
var $div = $('div')
$div.addClass('red') // 可将所有 div 的 class 添加一个 red
$div.text('hi') // 可将所有 div 的 textContent 变为 hi

jQuery实质上是一个函数，这个函数返回一个对象nodes，在这个对象里有key和value，其中一部分是外部传给它的参数，根据这个参数，找到其节点，将节点的内容存在对象中，除此以外，还有length属性，length的值是根据传入的参数的长度确定的，并有addClass和text两个属性，他们是两个函数方法。

let nodes={}
    if(typeof nodeOrSelector === 'string'){
        let temp = document.querySelectorAll(nodeOrSelector)    
        for(let i=0;i<temp.length;i++){
            nodes[i] = temp[i]
        }
        nodes.length = temp.length;
    }else if(nodeOrSelector instanceof Node){
        nodes ={
            0:nodeOrSelector,
            length:1
        }
    }

这一段代码是将传入的参数放进jQuery这个对象中，首先判断传入的参数是什么类型，如果是字符串类型，那就根据document.querySelectorAll()这个方法找到节点，并存入nodes中，这里的temp是为了使nodes更加纯净，否则它的_proto_就会指向类似于Nodelist.prototype的地方，不能直接指向Object.ptototype，如果传入的参数是个节点，那就存入nodes对象当中，值得注意的是，因为nodes是一个对象，我们要用对象的方法存，这里不能直接写成nodes = nodeOrSelector。

nodes.addClass = function(classes){
        classes.forEach((value) => {
            for(let i=0;i<nodes.length;i++){
                nodes[i].classList.add(value)
            }
        })
    }

这一段代码是给节点加class的函数，classes是外部给的一个参数，遍历这个参数，将这个参数的内容作为class，加入到nodes中。

nodes.text = function(text){
        if(text === undefined){
            var texts = []
            for(let i = 0;i<nodes.length;i++){
                texts.push(nodes[i].textContent)
            }
            return texts
        }else{
            for(let i=0;i<nodes.length;i++){
                nodes[i].textContent = text
            }
        }
    }

这一段代码是获得或设置节点的textContent，text是外部得到的参数，对text进行判断，如果text是undefined（即为空），说明是获取节点本身的textContent，那将nodes的textContent放入数组texts中，并返回texts。如果text不为空，就将text中的内容赋给节点的textContent，改变节点的文字内容。