OOP 및 jQuery(둘): 객체

이 시리즈의 문장은 석천창작, 이송봉번역, W3ctech.com 최초, 도령 커뮤니티 전재.
 
 
'OOP과 jQuery'는'디코딩 jQuery'시리즈 중의 하위 시리즈로 주로 jQuery의 내부 구성과 관련된 OOP(Object Oriented Programming, 대상을 대상으로 프로그래밍) 개념을 논의한다.
 
 
이전 편에서 우리는 jQuery 코드를 예로 삼아 변수(데이터)와 함수의 개념을 설명했다.이 편에서는 jQuery를 통해 대상을 소개할 것이다.
 
1. 대상은 대상, 사람과 의자처럼
 
기왕 우리가 토론한 것이 대상을 대상으로 프로그래밍한 바에야 그 대상은 무엇입니까?대상은 대상이다. 예를 들어 창정공 선생님은 대상이고 책상과 의자, 개도 대상이다.대상을 향한다.단지 프로그래밍 언어로 대상을 표시할 뿐이다.
 
위에서 말한 바와 같이 샤카투는 하나의 대상이다.따라서 OOP에서는 객체로 표현할 수 있습니다.
 
 

var shichuan = {};

 
 
각 객체에는 속성과 방법(비헤이비어)이 있을 수 있습니다.예를 들어 샤카투의 머리카락은 검은색인데 이것이 그의 속성이다.태어날 때부터 검은색이었기 때문에, 그는 때때로 머리를 검게 염색하지 않아도 된다. 모든 것은 방법이 아니다.이 등록 정보를 shichuan 객체에 추가할 수 있습니다.
 
 

var shichuan = {
      hair : "black"
};

 
 
자, 시츄안의 특기가 딱정벌레를 타는 것이라고 가정하면 딱정벌레(riding unicorn)를 타는 것이 그의 방법(행위)이다.OOP을 사용하여 다음과 같이 나타냅니다.
 
 

var shichuan = {
      hair : "black",
      ridingUnicorn : function() {
              //        
      }
};

 
 
개체의 개념을 요약합니다.
 
      1. 대상을 포함하는 변수의 이름은 vshichuan입니다.
2. 객체의 컨텐트가 에 포함됩니다.
3. 객체의 요소(속성 및 방법)는 쉼표로 구분됩니다.
4. 키/값 쌍은 사칭으로 구분한다. 예를 들어 키:value(또는 상기 예의hair: "Black") 등이다.
 
2. jQuery의 객체
 
그렇다면 jQuery에서는 어떻게 대상을 사용합니까?우리가 첫 번째 문장에서 언급한 jQuery의 국부 사본을 기억하지?다음은 jQuery 함수의 내부(대략 네 번째 줄에 있다를 살펴보자. 실제로 이 함수에는 한 줄의 코드만 있다. 그 주석은 jQuery 대상은 사실상'강화판'인 init 구조 함수라고 한다.그럼 이 강화된 init는 어떤 건가요?
 
 

var jQuery = function() {
      // jQuery         “    ”init    
      return new jQuery.fn.init(selector, context, rootjQuery);
}

 
코드에서 'jQuery.fn' 을 검색하면 약 76행 대체로 다음과 같습니다.
 

jQuery.fn = jQuery.prototype = {
        constructor : jQuery,
        init : function(selector, context, rootjQuery) {
        .......
        },
        ......
}

 
jQuery의 원형(다음 글은 원형을 소개합니다)--jQuery.prototype, 하나의 대상, 하나의 큰 대상.이 대상은 매우 많은 속성과 방법이 있다.예를 들어 그의 속성은constructor,selector,jquery,length 등이 있다.그것의 방법은 init,size,toArray,get,pushStack 등이 있다.
 
3. 함수는 데이터이자 대상
 
첫 번째 글에서 우리는 함수는 데이터라고 말했는데 다음과 같은 두 가지 방식으로 jQuery 함수를 정의했는데 결과는 같다.
 

//    jQuery

function jQuery(selector, context) {

        //  .......

}

//    jQuery

var jQuery = function(selector, context) {

      // ........

}

 
실제로 세 번째 방법도 있다.
 

//    jQuery

var jQuery = new Function("selector", "context", "// .......");

 
OOP에서 new 및 구조 함수(이곳의 Function)를 사용하는 것이 새 객체를 작성하는 일반적인 방법입니다.이런 방법도 함수를 만들 수 있지만, 자바스크립트는 eval을 사용하여 전송된 원본 코드에 값을 구하기 때문에 보통 가장 좋은 방법은 아니다.