简版的jQuery实现过程

封装一个函数

function getSiblings(node){
  let nodes = node.parentNode.children;
  let arr = {}
  let length=0
  for(let i=0;i<nodes.length;i++){
      if(nodes[i] !== node){
        arr[length] = nodes[i]
        length +=1
      }
  }
  return arr
}

再封装一个

function addClass(node, classes){
 for(let key in classes){
   if(classes[key]){
     $(node).addClass(key)
   }
 }
}

命名空间

var dom = {}
dom.getSiblings(node)
dom.addClass(node, {a: true, b: false})

思考：能不能把 node 放在前面？
比如：
node.getSiblings()
node.addClass()

方法一：扩展 Node 接口

直接在 Node.prototype 上加函数

这个方法不太好，容易不小心改变prototype上面的函数。

方法二：新的接口 BetterNode

     function Node2(node){
         return {
             element: node,
             getSiblings: function(){

             },
             addClass: function(){

             }
         }
     }
     let node =document.getElementById('x')
     let node2 = Node2(node)
     node2.getSiblings()
     node2.addClass()

第二种叫做「无侵入」。
把 Node2 改个名字吧

function jQuery(node){
    return {
        element: node,
        getSiblings: function(){

        },
        addClass: function(){
    
        }
    }
}
let node =document.getElementById('x')
let node2 =jQuery(node)
node2.getSiblings()
node2.addClass()