自分でjQueryを1つ実現(0.0.1)

What is jQuery?
核心は一言The Write Less,Do More(もっと書く、もっと作る)、ok,let's go!

addClass()機能(スラグ版)

    
  1
    
  2
    
  3
    
  4
    
  5

id=「item 3」にスタイルを追加する方法

function addClass(node,classArr){
    var len = classArr.length;
    for(let i = 0 ;i < len ; i++){
        node.classList.add(classArr[i]);
    }
}
// item3   id         
addClass(item3,['red']); 
//       
addClass(document.getElementById('item4'),['red'])

注意:idを通じて要素を取得するのは100%大丈夫ではありません.もしあなたがid=「parent」でなければ、これはあなたが銀行に行って貯金するようによくありません.他の人は本当のお金を貯めることを知っています.あなたはあいにく何枚かの偽の貯金をしています.わがまま勝手に言っただけだ.
これは初歩的なパッケージ方法ですが、方法はまだグローバルな役割ドメインにあります.addClassと呼ばれています.その時、他の人もaddClassと呼ばれています.あなたはカバーされているかもしれません.私たちは著作権を持っています.かっこいいサインをしてください.
addClass()(署名版)
名前空間:グローバルオブジェクトにオブジェクトをマウントwindow.myDom={}そしてあなたがマウントしたmyDomオブジェクトにあなたの属性、方法をマウントします

これは前よりどこがいいですか?

幸いにも「ばらばら」の変数ではなく「従属」の関係がある(少なくともアリが没落する前に)私はアリの先端で、私が先端であるよりも重みがあるのだろうか.

window.myDom = {};
myDom.addClass = function (node,classArr){
    var len = classArr.length;
    for(let i = 0 ;i < len ; i++){
        node.classList.add(classArr[i]);
    }
}
myDom.addClass(item3,['red']);

君はきっと気分が悪いに違いない.前に使ったほうがいいから.毎回名前の接頭辞myDomをつけなければならない.fn(param) myDom.fn 2(param)直接item 3.addClass(['red'])は需要があれば改善する

どうせノードのapiだから俺が直接原型を変えればいいんじゃないか!君はまた穴を掘った

Node.prototype.addClass =  function (node,classArr){
    var len = classArr.length;
    for(let i = 0 ;i < len ; i++){
        this.classList.add(classArr[i]);
    }
}
 item3.addClass(['red']);  //       

このような結果は他の人もこのように原型を変えて、しかもaddClassを追加して心が疲れているのではないでしょうか.どうして?これは優れた伝統をパクって「私が考えた」機能を変えて、私はあなたより良いと言います!(王者の栄光とdota)why?エジソンの電球を使って、私はあなたに聞いて、あなたは自分で発明したのか、それとも彼を参考にしているのか?私が巨人の肩に立っているからです!

私たちは著作権を話しています.私のです.
私は自分でNode 2を作ってもいいですか?後でNode 3があるかもしれません.

window.Node2 = function(node){
            return {
                addClass:function(classArr){
                    var len = classArr.length;
                    for(let i = 0 ;i < len ; i++){
                        node.classList.add(classArr[i]);
                    }
                }
            }
        }
var node2 = Node2(item4);
node2.addClass(['red']);  //  
// Node2(item5).addClass(['red'])               

約束したjQueryは?Node 2をjQueryに置き換えてみて
これが一番簡単版だと感じたのかな?
jQueryの最強はセレクタSelector
「能力より選択が大きい」という言葉を聞いたことがあるに違いない(あ!聞いたことがない?今聞いたことがある!)

window.jQyery = function(nodeOrSelector){
            let node ; 
            if(typeof nodeOrSelector ==='string'){
                node = document.querySelector(nodeOrSelector);
            }else{
                node = nodeOrSelector;
            }
            return {
                addClass:function(classArr){
                    var len = classArr.length;
                    for(let i = 0 ;i < len ; i++){
                        node.classList.add(classArr[i]);
                    }
                }
            }
        }
var jqyery = jQyery(item4);
jqyery.addClass(['red']); 

jQueryセレクタが偽の配列を返していることを知っている人がいるに違いない.
我々はquerySelectorAll()を使用してノード配列(擬似配列)を返し、内部宣言nodesにコピーして取得した各ノードをノード配列であればコピーします.

window.jQyery = function(nodeOrSelector){
            let nodes = {}; 
            if(typeof nodeOrSelector ==='string'){
                let temp = document.querySelectorAll(nodeOrSelector);
                for(let i=0;i

なぜ毎回return nodes=>答えはチェーン操作なのか疑問に思うに違いない

$('ul li').addClass(['red']).Text('hi'); //Text          ok     

内部でメソッドをマウントし続けるText()パラメータを渡すとtextを設定する代わりにgetを表す

nodes.Text = function (text){
    if(text === undefined){
        var texts = [];
        for(let i=0;i

批判を歓迎します.
END