자 바스 크 립 트 가 대상 을 대상 으로 하 는 생 성 대상 기반 (1)

6228 단어
이번에 우 리 는 자 바스 크 립 트 대상 기술 을 깊이 있 게 배 워 서 학습 하기 전에 대상 을 대상 으로 하 는 용어 들 을 설명해 야 한다.이것 도 모든 대상 언어 가 가 진 공통점 이다.대상       ECMA - 262 는 대상 (object) 을 '속성의 무질서 한 집합, 각 속성 은 원시 값, 대상 또는 함수' 로 정의 합 니 다.엄 밀 히 말 하면 대상 이 특정한 순서 가 없 는 값 의 배열 이라는 뜻 이다.ECMAScript 가 대상 을 이렇게 정의 하지만 더 일반적인 정 의 는 코드 를 기반 으로 하 는 명사 (사람, 장소 또는 사물) 의 표현 입 니 다.종류       모든 대상 은 클래스 에 의 해 정의 되 며, 클래스 를 대상 의 레 시 피 로 볼 수 있다.클래스 는 대상 의 인터페이스 (interface) (개발 자가 방문 하 는 속성 과 방법) 를 정의 해 야 할 뿐만 아니 라 대상 의 내부 작업 (속성 과 방법 이 작용 하 는 코드) 도 정의 해 야 한다.컴 파일 러 와 해석 프로그램 은 모두 클래스 의 설명 에 따라 대상 을 구축한다.실례       프로그램 이 클래스 를 사용 하여 대상 을 만 들 때 생 성 된 대상 을 클래스 의 인 스 턴 스 (instance) 라 고 합 니 다.클래스 생 성 대상 의 개수 에 대한 유일한 제한 은 코드 를 실행 하 는 기계 의 물리 적 메모리 에서 나온다.모든 인 스 턴 스 의 행동 은 같 지만 인 스 턴 스 는 하나의 독립 된 데 이 터 를 처리 합 니 다.클래스 에서 대상 인 스 턴 스 를 만 드 는 과정 을 실례 화 (instantiation) 라 고 합 니 다.       앞에서 언급 한 바 와 같이 ECMAScript 는 정식 클래스 가 없습니다.반면 ECMA - 262 는 대상 을 대상 으로 묘사 한 레 시 피 로 정의 한다.이것 은 ECMAScript 논리 상의 절충 방안 으로 대상 정의 가 실제 대상 자체 이기 때문이다.비록 유형 이 진정 으로 존재 하지 않 더 라 도 우 리 는 대상 을 유형 이 라 고 정의 한다. 왜냐하면 대부분 개발 자 들 은 이 용어 에 대해 더욱 익숙 하고 기능 적 으로 볼 때 이들 은 등가 이기 때문이다.       미리 정 의 된 대상 을 사용 하 는 것 은 대상 언어 를 대상 으로 하 는 능력 의 일부분 일 뿐, 진정 으로 강 한 것 은 자신 만 의 전용 대상 을 만 들 수 있다 는 것 이다.ECMAScript 는 대상 을 만 드 는 방법 이 많 습 니 다.1. 원시 방식       대상 의 속성 은 대상 이 생 성 된 후에 동적 으로 정의 할 수 있 기 때문에 모든 개발 자 들 이 자바 스 크 립 트 가 처음 도 입 했 을 때 다음 과 같은 코드 를 작성 합 니 다.

var Car = new Object(); 
Car.color = "blue"; 
Car.doors = 4; 
Car.mpg = 25; 
Car.showColor = function() { 
  return this.color; 
}; 
document.write(Car.showColor());//  :blue 

       위의 코드 에서 대상 Car 를 만 듭 니 다.그리고 몇 가지 속성 을 설정 합 니 다. 색깔 은 파란색 이 고 네 개의 문 이 있 으 며 갤 런 당 25 마일 을 달 릴 수 있 습 니 다.마지막 속성 은 실제로 함 수 를 가리 키 는 지침 으로 이 속성 이 방법 이라는 것 을 의미한다.이 코드 를 실행 하면 대상 Car 를 사용 할 수 있 습 니 다.그러나 여기 서 문제 가 하나 있 습 니 다. 바로 여러 개의 Car 인 스 턴 스 를 만들어 야 할 수도 있 습 니 다. 그러면 우 리 는 비슷 한 코드 를 많이 반복 할 것 입 니 다. 그러면 매우 번 거 로 울 것 입 니 다.2. 공장 방식       상기 여러 개의 유사 한 대상 성명 문 제 를 풀 려 면 개발 자 는 특정한 유형의 대상 을 만 들 고 돌아 갈 수 있 는 공장 방식 을 만 들 었 습 니 다.이런 방식 은 바로 실례 화 대상 이 대량으로 중복 되 는 문 제 를 해결 하기 위 한 것 이다.(1) 매개 변수 없 는 공장 방식       예 를 들 어 함수 createCar () 는 앞 에 열 거 된 Car 대상 을 만 드 는 작업 을 봉인 하 는 데 사용 할 수 있 습 니 다.

function createCar() { 
var TempCar = new Object(); 
TempCar.color = "blue"; 
TempCar.doors = 4; 
TempCar.mpg = 25; 
TempCar.showColor = function() { 
    return this.color; 
 }; 
 return TempCar; 
}; 
var Car1 = createCar(); 
var Car2 = createCar(); 
document.write(Car1.showColor()+"
");// :blue document.write(Car2.showColor());// :blue

       여기 서 첫 번 째 예 에 있 는 모든 코드 는 createCar () 함수 에 포함 되 어 있 습 니 다.이 밖 에 템 플 카 대상 을 함수 값 으로 되 돌려 주 는 추가 코드 도 있다.이 함 수 를 호출 하면 새 대상 을 만 들 고 필요 한 모든 속성 을 부여 합 니 다. 앞에서 설명 한 Car 대상 을 복사 합 니 다.따라서 이런 방법 을 통 해 우 리 는 Car 대상 의 두 가지 버 전 (Car 1 과 Car 2) 을 쉽게 만 들 수 있 고 그들의 속성 은 완전히 같다.(2) 매개 변수 가 있 는 공장 방식       우 리 는 또한 createCar () 함 수 를 수정 하여 각 속성의 기본 값 을 전달 할 수 있 습 니 다. 속성 기본 값 을 간단하게 부여 하 는 것 이 아 닙 니 다.

function createCar(Color,Doors,Mpg) { 
 var TempCar = new Object(); 
 TempCar.color = Color; 
 TempCar.doors = Doors; 
 TempCar.mpg = Mpg; 
 TempCar.showColor = function() { 
    return this.color; 
 }; 
 return TempCar; 
}; 
var Car1 = createCar("red",4,23); 
var Car2 = createCar("blue",3,25); 
document.write(Car1.showColor()+"
");// :red document.write(Car2.showColor());// :blue

       createCar () 함수 에 파 라 메 터 를 추가 하면 만 들 Car 대상 의 color, doors, mpg 속성 에 값 을 부여 할 수 있 습 니 다.이것 은 두 대상 으로 하여 금 같은 속성 을 가지 게 하지만 서로 다른 속성 치 를 가지 게 한다.       공장 방식 은 반복 적 인 실례 화 문 제 를 해 결 했 지만 문제 가 하나 있다. 바로 앞의 예 에서 함수 createCar () 를 호출 할 때마다 새로운 함수 쇼 Color () 를 만들어 야 한 다 는 것 은 모든 대상 이 자신의 쇼 Color () 버 전이 있다 는 것 을 의미한다.사실상 모든 대상 이 같은 함 수 를 공유한다.일부 개발 자 들 은 공장 함수 밖에서 대상 을 정의 하 는 방법 을 사용 한 다음 에 속성 을 통 해 이 방법 을 가리 키 며 이 문 제 를 피한다.

function showColor() { 
   return this.color; 
}; 
function createCar(Color,Doors,Mpg) { 
 var TempCar = new Object(); 
 TempCar.color = Color; 
 TempCar.doors = Doors; 
 TempCar.mpg = Mpg; 
 TempCar.showColor = showColor; 
 return TempCar; 
}; 
var Car1 = createCar("red",4,23); 
var Car2 = createCar("blue",3,25); 
document.write(Car1.showColor()+"
");// :red document.write(Car2.showColor());// :blue

       위 에 재 작성 한 코드 에서 함수 createCar () 전에 함수 쇼 Color () 를 정의 하 였 습 니 다.createCar () 내부 에서 대상 에 게 이미 존재 하 는 쇼 Color () 함 수 를 가리 키 는 지침 을 부여 합 니 다.기능 적 으로 함수 대상 을 반복 적 으로 만 드 는 문 제 를 해결 합 니 다.그러나 의미 상 이 함 수 는 대상 의 방법 같 지 않다.이 모든 문제 들 은 개발 자가 정의 한 구조 함수 의 출현 을 야기 시 켰 다.3. 구조 함수 방식       구조 함 수 를 만 드 는 것 은 공장 방식 의 함수 처럼 쉽다.첫 번 째 단 계 는 구조 함수 의 이름 을 선택 합 니 다.관례 에 따 르 면 이 이름 의 이니셜 은 이니셜 과 보통 소문 자 변수 명 으로 나 뉜 다.이 점 을 제외 하고 구조 함 수 는 공장 방식 의 함수 처럼 보인다.아래 의 예 를 보십시오.

function Car(Color,Doors,Mpg) { 
 this.color = Color; 
 this.doors = Doors; 
 this.mpg = Mpg; 
 this.showColor = function() { 
    return this.color; 
 }; 
}; 
var Car1 = new Car("red",4,23); 
var Car2 = new Car("blue",3,25); 
document.write(Car1.showColor()+"
");// :red document.write(Car2.showColor());// :blue

       다음은 위의 코드 와 공장 방식 의 차 이 를 설명 하 겠 습 니 다.우선 구조 함수 에 대상 을 만 들 지 않 고 this 키 워드 를 사용 합 니 다.new 연산 자 구조 함 수 를 사용 할 때 첫 번 째 줄 코드 를 실행 하기 전에 대상 을 만 듭 니 다. this 를 사용 해 야 대상 에 접근 할 수 있 습 니 다.그 다음 에 this 속성 을 직접 부여 할 수 있 습 니 다. 기본 적 인 상황 에서 구조 함수 의 반환 값 입 니 다 (return 연산 자 를 명확 하 게 사용 할 필요 가 없습니다).이제 new 연산 자 와 대상 명 Car 로 대상 을 만 드 는 것 이 더 비슷 합 니 다. ECMAScript 의 일반 대상 생 성 방식 입 니 다.      공장 방식 의 함수 처럼 구조 함 수 는 함수 생 성 을 반복 하여 모든 대상 에 게 독립 된 함수 버 전 을 만 듭 니 다.그러나 공장 방식 의 함수 와 비슷 하고 외부 함수 로 구조 함 수 를 다시 쓸 수도 있다. 마찬가지 로 이렇게 하 는 것 은 의미 적 으로 아무런 의미 가 없다.이것 이 바로 아래 에서 말 하고 자 하 는 원형 방식 의 장점 이다.다음 글 에 서 는 대상 을 대상 으로 하 는 원형 방식 과 다른 종합 적 인 방식 을 상세 하 게 분석 할 것 이다.
이상 은 본 고의 모든 내용 입 니 다. 여러분 의 자 바스 크 립 트 프로 그래 밍 학습 에 도움 이 되 기 를 바 랍 니 다.

좋은 웹페이지 즐겨찾기