우리가 물체 중심에 대해 이야기 할 때, 우리는 클래스, 물체, 포장, 상속, 다형성을 생각할 수 있습니다. "JavaScript Advanced Program Design"(People 's Post and Telecommunications Press, Cao Li, Zhang Xin. 영어 이름은 : 웹 개발자를위한 Professional JavaScript)라는 책 에서이 책에 설명되어 있습니다. JavaScript로 정의 된 다양한 방법을 살펴 보겠습니다.
1. 공장 방법
자바 스크립트로 우리 자신의 클래스와 객체를 만들려면, 우리는 객체의 객체의 속성을 다음 코드와 같은 객체 작성 후 동적으로 정의 할 수 있음을 모두 마스터해야합니다.
다음과 같이 코드 코드를 복사하십시오.
<script type = "text/javaScript">
//정의
var ocar = new Object ();
ocar.color = "빨간색";
ocar.doors = 4;
ocar.showcolor = function () {
경고 (this.color);
}
// 부르다
ocar.showcolor ();
</스크립트>
OCAR 객체를 사용하기 쉽지만 여러 차량 인스턴스를 만듭니다. 기능을 사용하여 위의 코드를 캡슐화하여 구현할 수 있습니다.
다음과 같이 코드 코드를 복사하십시오.
<script type = "text/javaScript">
//정의
함수 createcar () {
var ocar = new Object ();
ocar.color = "빨간색";
ocar.doors = 4;
ocar.showcolor = function () {
경고 (this.color);
}
오카를 반환;
}
// 부르다
var ocar1 = createcar ();
var ocar2 = createcar ();
ocar1.color = "black";
Ocar1.showColor ();
OCAR2.ShowColor ();
</스크립트>
그건 그렇고, JavaScript 객체의 기본 멤버십 속성은 공개됩니다. 이런 식으로, 우리는 그것을 공장 방법이라고 부르며 특정 유형의 객체를 만들고 반환 할 수있는 공장을 만들었습니다.
이것은 약간 흥미롭지 만 객체 지향 객체에서 객체를 만드는 방법은 다음과 같습니다.
자동차 자동차 = 새 차 ();
새로운 키워드의 사용은 사람들의 마음에 깊은 뿌리를두고 있으므로 위의 방법을 사용하여 항상 어색합니다 . 생성자의 양식 정의를 살펴 보겠습니다.
2. 건설자
이 방법은 공장 기능처럼 보입니다. 특정 성능은 다음과 같습니다.
다음과 같이 코드 코드를 복사하십시오.
<script type = "text/javaScript">
//정의
기능 차량 (색, 문) {
this.color = 색상;
this.doors = 문;
this.showcolor = function () {
경고 (this.color);
};
}
// 부르다
var car1 = 새 차 ( "빨간색", 4);
var car2 = 새 차 ( "파란색", 4);
car1.showcolor ();
car2.showcolor ();
</스크립트>
분명해 보이면 차이가 있습니다. 조금 흥미 롭습니다. 이 키워드를 사용하여 구성 함수 내부에 객체를 작성하고 새 컴퓨팅 기호를 사용하여 객체를 만드는 것이 매우 친절합니다. 그러나 몇 가지 문제가 있습니다. 새로운 객체가 생성 될 때마다 함수 생성을 포함한 모든 속성, 즉 여러 객체가 완전히 독립적이지만 CAR1 객체와 CAR2 객체는 적어도 독립적 인 속성의 방법과 기능을 공유해야합니다. 이것이 원래 형태의 장점입니다.
3. 원기
개체의 프로토 타입 속성을 사용하여 새 객체가 의존하는 프로토 타입을 볼 수 있습니다. 이 방법은 다음과 같습니다.
다음과 같이 코드 코드를 복사하십시오.
<script type = "text/javaScript">
//정의
fuinction car () {
};
car.prototype.color = "빨간색";
car.prototype.doors = 4;
car.prototype.drivers = New Array ( "Tom", "Jerry");
car.prototype.showColor = function () {
경고 (this.color);
}
// 부르다:
var car1 = 새 차 ();
var car2 = 새 차 ();
car1.showcolor ();
car2.showcolor ();
경고 (CAR1.DRIVER);
car1.drivers.push ( "Stephen");
경고 (Car1.drivers); // 결과 : Tom, Jerry, Stephen
Alert (Car2.drivers); // 결과 : Tom, Jerry, Stephen
// JSON을 사용하여 프로토 타입의 정의를 단순화 할 수 있습니다.
car.prototype =
{{
색상 : "빨간색",
문 : 4,
드라이버 : [ "Tom", "Jerry", 'Safdad'],
showcolor : function () {
경고 (this.color);
}
}
</스크립트>
우선,이 코드의 생성자 인 코드가없고 개체의 속성을 추가하여 객체의 프로토 타입 속성을 통해 자동차 객체의 속성을 정의합니다. 이 방법은 매우 좋지만 자동차의 객체는 배열 포인터를 가리 킵니다. CAR2도 동시에 허용되지 않습니다.
동시에, 초기화 매개 변수를 가져올 수없는 프로토 타입에서 문제가 나타납니다. 이는 생성자가 정상적으로 초기화 할 수 없게합니다. 이를 위해서는 또 다른 방법을 해결해야합니다. 혼합 생성자/프로토 타입 모드입니다.
4. 혼합 생성자/프로토 타입 모드
생성자와 프로토 타입의 조합은 클래스를 정의하는 데 매우 편리합니다.
다음과 같이 코드 코드를 복사하십시오.
<script type = "text/javaScript">
//정의
기능 자동차 (색, 문)
{{
this.color = 색상;
this.doors = 문;
this.drivers = new Array ( "Tom", "Jerry");
}
car.prototype.showColor = function () {
경고 (this.color);
}
// 부르다:
var car1 = 새 차 ( '빨간색', 4);
var car2 = 새 차 ( '파란색', 4);
car1.showcolor ();
car2.showcolor ();
경고 (CAR1.DRIVER);
car1.drivers.push ( "Stephen");
경고 (Car1.drivers); // 결과 : Tom, Jerry, Stephen
Alert (Car2.drivers); // 결과 : Tom, Jerry
경고 (CAR1 인스턴스);
</스크립트>
이 방법은 내부 속성을 정의하고 프로토 타입을 사용하여 외부를 정의하는 것입니다. 세 번째 방법을 해결하는 문제.
이 방법은 실제로 매우 친절해야하지만 Java의 문법과 비교할 때 부조화가 있어야합니다 J2EE R & D 직원의 경우이 방법은 항상 어색합니다. 그것은 항상 친근한 포장이 아니라고 생각합니다 , 그것이 더 번거로운 것으로 간주됩니다. 그것이 역동적 인 프로토 타입입니다.
5. 동적 프로토 타입
다른 언어 사용에 익숙한 개발자의 경우 혼합 생성자/프로토 타입의 사용은 그렇게 조화롭지 않습니다. 결국, 카테고리를 정의 할 때, 대부분의 객체 지향 언어는 속성 및 메소드에 시각적으로 포장됩니다. 다음 c#클래스를 고려하십시오.
다음과 같이 코드 코드를 복사하십시오.
클래스 카 // 클래스
{{
공개 문자열 색상 = "빨간색";
공개 int 도어 = 4;
공개 int mpg = 23;
공공 차 (문자열 색상, int 문, int mpg) // 생성자
{{
this.color = 색상;
this.doors = 문;
this.mpg = mpg;
}
공개 void showcolor () // medhod
{{
Console.WriteLine (this.Color);
}
}
C#은 자동차 클래스의 모든 속성과 메소드가 잘 포장되어 있으므로이 코드를 볼 때 어떤 기능을 달성 해야하는지 알 수 있으며 객체의 정보를 정의합니다. 혼합 생성자의 생성자/프로토 타입을 비판하는 사람들은 생성자의 메모리에서 속성을 찾는 방법과 그 외부의 방법을 찾는 방법이 논리적이지 않다고 생각합니다. 따라서 그들은보다 친근한 코딩 스타일을 제공하기 위해 동적 프로토 타입을 설계했습니다.
동적 프로토 타입 방법의 기본 아이디어는 혼합 구조의 생성자/프로토 타입과 동일합니다. 즉, 생성자의 비 기능 속성을 정의하며 기능 속성은 프로토 타입 속성을 사용하여 정의됩니다. 유일한 차이점은 객체 방법의 위치입니다. 다음은 Dynamic 프로토 타입으로 다시 작성한 자동차 클래스입니다.
다음과 같이 코드 코드를 복사하십시오.
<script type = "text/javaScript">
//정의
fuinction car () {
this.color = "빨간색";
this.doors = 4;
this.drivers = new Array ( "Tom", "Jerry");
ifof car._initialized == "undefined") {{
car.prototype.showColor = function () {
경고 (this.color);
}
// ............
}
// 마지막 정의
car._initialized = true;
}
</스크립트>
CAR의 타입을 확인할 때까지 "정의되지 않은"과 동일 하게이 생성자는 변경되지 않았습니다. 이 코드 라인은 동적 프로토 타입 방법의 가장 중요한 부분입니다. 이 값이 정의되지 않으면 생성자는 프로토 타입으로 객체 방법을 계속 정의 한 다음 CAR._Initialized를 true로 설정합니다. 이 값이 정의되면 (값이 참이면, Typeof의 값이 부울 임),이 방법은 생성되지 않습니다. 요컨대,이 방법은 로고 (_initialized)를 사용하여 프로토 타입에 메소드를 제공했는지 여부를 결정합니다. 이 방법은 전통적인 OOP 개발자를 기쁘게하기 위해 한 번만 만들어지고 할당됩니다.
6 하이브리드 공장 방법
이 방법은 일반적으로 이전 방법을 적용 할 수없는 방식을 변경하는 방법입니다. 그 목적은 가짜 생성자를 만들고 다른 객체의 새로운 예만 반환하는 것입니다. 이 코드는 공장 기능과 매우 유사한 것 같습니다.
다음과 같이 코드 코드를 복사하십시오.
fuinction car () {
var ompcar = new Object ();
IONMPCAR.COLOR = "RED";
IONMPCAR.DOORS = 4;
IONMPCAR.MPG = 23;
IONMPCAR.SHOWCOLOR = function () {
경고 (this.color);
}
OTEMPCAR을 반환합니다.
}
클래식 방법과는 달리이 방법은 새 연산자를 사용하여 실제 구조 기능처럼 보이게합니다.
var ocar = 새 차 ();
새 연산자는 CAR () 생성자 내부에서 호출되므로 두 번째 새 연산자는 (생성자 외부에 위치) 무시됩니다. 생성자에 생성 된 객체는 변수 var로 다시 전달됩니다. 이 방법은 객체 방법의 전형적인 방법과 동일한 문제가 있습니다. 강력하게 추천 : 필요하지 않는 한 (15 장 참조), 여전히이 방법을 피하십시오.
요약 : (사용되는 방법)
현재 가장 널리 사용되는 것은 혼합 생성자/프로토 타입입니다. 또한, 동적 프로토 타입은 또한 매우 인기가 있으며 기능의 기능적 기능/프로토 타입과 동일합니다. 이 두 가지 방법 중 하나를 사용할 수 있습니다. 그러나 클래식 생성자 나 프로토 타입을 사용하지 마십시오. 이로 인해 코드가 문제에 대한 코드를 도입하므로.
다음과 같이 코드 코드를 복사하십시오.
// ps
// 정적 클래스 (1 : 함수)
varcollection = new function () {
var _carcollection = new Array ();
this.add = function (objcar) {
경고 ( 'add');
}
this.get = function (carid) {
경고 ( 'get');
}
}
// 정적 클래스 (2 : json)
var car = {
색상 : '빨간색',
문 : 4,
showcolor : function () {alert (this.color);}
}
car.showcolor ();