jQuery 원본 노트--2

jQuery 선택

var jQuery = function( selector, context ) {

        return new jQuery.fn.init( selector, context );// jQuery.fn      

};

jQuery.fn = jQuery.prototype = { //  jQuery.prototype，           。

    init: function(){

        console.log("     ");

        return this;

    }
　　//    

}

jQuery.fn.init.prototype = jQuery.fn //      jQuery.fn.init           。

console.log(jQuery());//{...}

여기에 중요한 지식이 하나 있다. new가 도대체 무엇을 했는지: new 구조 함수 jQuery.fn.init, 하나의 대상을 되돌려줍니다. 이 대상은 구조 함수의 원형 jQuery를 계승합니다.fn.init.prototype, 이 원형은 내가 만든 것으로 jQuery를 가리킨다.fn, 즉 하나의 대상, 대상에 init와 모든 기능 방법을 가지고 있다.이것은 우리가 모든 기능 방법을 가진 대상으로 돌아가고 싶다는 것을 실현시켰다.
저희도 그럴 수 있어요.

var jquery = function(){

    if(!(this instanceof jquery)) return new jquery();

    console.log("     ");

}

jquery.fn = jquery.prototype = {

    //    

}

console.log(jQuery());//{...}

사실 근본적으로 해결해야 할 문제는 하나의 대상을 되돌려주는 것이다. 이 대상은 기본적으로 기능 방법을 가지고 있어야 한다.최대 효율을 위해 두 가지 예 모두 기능 방법을 대상에 쓰지 않고 원형에 대한 개작을 통해 실례화된 기본 계승을 선택한다.
체인 호출

var jQuery = function( selector, context ) {

        return new jQuery.fn.init( selector, context );

};

jQuery.fn = jQuery.prototype = {

    init: function(){

        console.log("     ");

        return this;

    },

    add:function(){

        console.log("add  ")

        return this;

    }

}

jQuery.fn.init.prototype = jQuery.fn

console.log(jQuery().add().add());

javascript에서 함수의this는 호출 대상을 가리킨다.이 예에서 jQuery ()는 하나의 대상을 실례화했다. 이 대상은dd () 방법을 사용하고 dd를 출력한 다음this로 돌아간다. 이this는 실제적으로 그 대상을 호출하는 jQuery () 이기 때문에 얼마나 많은 방법을 실행하든this로 되돌아가면 그 전의 결과는 모두 최초의 대상이고 최초의 이 대상의 기능 방법을 계속 사용할 수 있다.
대상에 방법을 추가하는 함수

var object = {

    name: "winderby"

}

object.extend = function(obj){

    for (var key in obj)

        this[key] = obj[key];

    return this;

}

object.extend({

    getName:function(){

        console.log(this.name);

    }

})

object.getName();

객체 결합

function extend() {

    for (var i = 1; i < arguments.length;i++){

        for(var key in arguments[i]){

            arguments[0][key] = arguments[i][key]

        }

    }

}

var student = {

    name:"winderby",

    age: "18"

}

var arrangement = {

    name:"winderby",

    lesson:"english"

}

extend(student,arrangement);

console.log(student)

jQuery의 extend

var jQuery = function( selector, context ) {

        return new jQuery.fn.init( selector, context );

};

jQuery.fn = jQuery.prototype = {

    init: function(){

        return this;

    }

}

jQuery.fn.init.prototype = jQuery.fn

jQuery.fn.extend = jQuery.extend = function(){//       

    var i = 1;

    var target = arguments[0];

    var length = arguments.length;

    if(length === 1){ //1    

        target = this;

        i--;

    }

    for (; i < arguments.length;i++){ //     ，  ，  

        for(var key in arguments[i]){

            target[key] = arguments[i][key]

        }

    }

}



//jQuery.extend      

var student = {

    name:"winderby",

    age: "18"

}

var arrangement = {

    name:"winderby",

    lesson:"english"

}

jQuery.extend(student,arrangement);

console.log(student);



//jQuery.fn.extend  jQuery    

jQuery.fn.extend({

    setName: function(myName) {

        this.myName = myName

        return this;

    },

    getName: function() {

        console.log(this.myName)

        return this;

    }

})

jQuery().setName("winderby").getName();

앞의 두 기능을 하나의 jQuery 함수에 합치면 jQuery의 extend가 됩니다.현재 이 extend는 jQuery를 통과할 수 있습니다.extend 병합 대상은 jQuery를 통해서도 가능합니다.fn.extend, jQuery.fn 추가 방법
세 번째 사용법 jQuery(true, {.})에 대해서는간단해서 군말하지 않겠다.