소개하다
모든 사람은 생성자에 익숙하지만 초보자라면 여전히 생성자가 무엇인지 이해해야합니다. 생성자는 특정 유형의 객체를 만드는 데 사용됩니다. 사용 된 객체를 선언 할뿐만 아니라 객체가 처음으로 생성 될 때 객체의 멤버 값을 설정하도록 매개 변수를 수락합니다. 자신의 생성자를 사용자 정의하고 사용자 정의 유형 객체의 속성 또는 메소드를 선언 할 수 있습니다.
기본 사용
JavaScript에서 생성자는 일반적으로 인스턴스를 구현하는 데 사용되는 것으로 간주됩니다. JavaScript에는 클래스 개념이 없지만 특별한 생성자가 있습니다. 새 키워드를 사용하여 정의 된 초기 기능을 호출하십시오. 새 객체를 만들고 새 개체의 멤버 선언이 생성자에 정의되어 있다고 JavaScript에 알릴 수 있습니다. 생성자 내부 에서이 키워드는 새로 생성 된 객체를 나타냅니다. 기본 사용량은 다음과 같습니다.
코드 사본은 다음과 같습니다.
기능 차량 (모델, 연도, 마일) {
this.model = 모델;
this.year = 년;
this.miles = 마일;
this.output = function () {
model + "left" + this.miles + "km";
};
}
var tom = 새 차 ( "Uncle", 2009, 20000);
var dudu = 새 차 ( "Dudu", 2010, 5000);
console.log (tom.output ());
console.log (dudu.output ());
위의 예는 매우 간단한 생성자 패턴이지만 약간의 문제입니다. 우선, 상속을 사용하는 것은 매우 번거 롭습니다. 둘째, 객체가 생성 될 때마다 output ()가 재정의됩니다. 가장 좋은 방법은 자동차 유형의 모든 인스턴스 가이 출력 () 메소드를 공유하도록하는 것입니다. 인스턴스의 큰 배치가 있으면 많은 메모리를 절약 할 수 있습니다.
이 문제를 해결하기 위해 다음 방법을 사용할 수 있습니다.
코드 사본은 다음과 같습니다.
기능 차량 (모델, 연도, 마일) {
this.model = 모델;
this.year = 년;
this.miles = 마일;
this.output = FormatCar;
}
함수 형식 카 () {
model + "left" + this.miles + "km";
}
이 방법을 사용할 수 있지만 다음과 같은 더 나은 방법이 있습니다.
생성자 및 프로토 타입
JavaScript에는 프로토 타입이라는 프로토 타입 속성이 있습니다. 생성자가 객체를 작성하도록 호출되면, 생성자 프로토 타입의 모든 속성은 새로 생성 된 객체에서 사용할 수 있습니다. 이러한 방식으로, 다중 자동차 객체 인스턴스는 동일한 프로토 타입을 공유 할 수 있습니다. 위의 예에서 코드를 확장하겠습니다.
코드 사본은 다음과 같습니다.
기능 차량 (모델, 연도, 마일) {
this.model = 모델;
this.year = 년;
this.miles = 마일;
}
/*
참고 : 여기서는 Object.Prototype을 사용했습니다. 객체가 아닌 메소드 이름
주로 프로토 타입 프로토 타입 객체를 다시 쓰는 것을 피하는 데 사용됩니다.
*/
car.prototype.output = function () {
model + "left" + this.miles + "km";
};
var tom = 새 차 ( "Uncle", 2009, 20000);
var dudu = 새 차 ( "Dudu", 2010, 5000);
console.log (tom.output ());
console.log (dudu.output ());
여기서는 output () 단일 인스턴스를 모든 자동차 객체 인스턴스에서 공유하고 사용할 수 있습니다.
또한 : 생성자는 일반 기능을 구별하기 위해 대문자로 시작하는 것이 좋습니다.
새로운 만 사용할 수 있습니까?
위의 예에서 기능 차량은 새로운 것을 사용하여 개체를 만들기 위해 생성됩니다. 한 가지 방법 만 있습니까? 실제로 다른 방법이 있습니다. 두 가지를 나열하겠습니다.
코드 사본은 다음과 같습니다.
기능 차량 (모델, 연도, 마일) {
this.model = 모델;
this.year = 년;
this.miles = 마일;
// 출력 출력을 사용자 정의합니다
this.output = function () {
model + "left" + this.miles + "km";
}
}
// 메소드 1 : 함수로 호출됩니다
자동차 ( "Uncle", 2009, 200000); // 윈도우 객체에 추가합니다
Console.log (Window.output ());
// 방법 2 : 다른 객체의 범위 내에서 호출
var o = new Object ();
car.call (O, "Dudu", 2010, 5000);
Console.log (O.output ());
이 코드의 방법 1은 약간 특별합니다. 새 기능이 직접 기능을 호출하면 글로벌 객체 창을 가리 킵니다. 확인해 봅시다 :
코드 사본은 다음과 같습니다.
// 함수 호출로
var tom = car ( "Uncle", 2009, 200000);
Console.log (Typeof Tom); // "한정되지 않은"
Console.log (Window.output ()); // "삼촌은 20,000 킬로미터를 걸었다"
현재 객체 Tom은 정의되지 않았으며 Window.output ()가 결과를 올바르게 출력합니다. 새 키워드를 사용하는 경우 그러한 문제가 없습니다. 확인은 다음과 같습니다.
코드 사본은 다음과 같습니다.
// 새 키워드를 사용합니다
var tom = 새 차 ( "Uncle", 2009, 20000);
Console.log (Typeof Tom); // "물체"
console.log (tom.output ()); // "삼촌은 20,000 킬로미터를 걸었다"
강제 새로운
위의 예는 새로 사용하지 않는 문제를 보여줍니다. 그렇다면 생성자가 새 키워드를 강요 할 수있는 방법이 있습니까? 답은 예, 위의 코드입니다.
코드 사본은 다음과 같습니다.
기능 차량 (모델, 연도, 마일) {
if (! (이 인스턴스)) {
새 차를 반환합니다 (모델, 연도, 마일);
}
this.model = 모델;
this.year = 년;
this.miles = 마일;
this.output = function () {
model + "left" + this.miles + "km";
}
}
var tom = 새 차 ( "Uncle", 2009, 20000);
var dudu = car ( "Dudu", 2010, 5000);
Console.log (Typeof Tom); // "물체"
console.log (tom.output ()); // "삼촌은 20,000 킬로미터를 걸었다"
Console.log (유형 Dudu); // "물체"
console.log (dudu.output ()); // "Dudu는 5000 킬로미터를 걸었습니다"
이 인스턴스가 자동차인지 판단함으로써, 우리는 새 차를 반환하거나 코드를 계속 실행하기로 결정합니다. 새 키워드가 사용되는 경우 (이 인스턴스)는 사실이며 다음 매개 변수 할당이 계속됩니다. 새로운 사용이 사용되지 않으면 (이 인스턴스)는 거짓이며 새 인스턴스가 다시 반환됩니다.
원래 래퍼 기능
JavaScript에는 3 개의 원본 래퍼 함수가 있습니다 : 숫자, 문자열, 부울, 때로는 둘 다 사용됩니다.
코드 사본은 다음과 같습니다.
// 원래 래퍼 함수를 사용합니다
var s = new String ( "내 문자열");
var n = 새 숫자 (101);
var b = 새로운 부울 (true);
// 이것을 추천합니다
var s = "내 문자열";
var n = 101;
var b = true;
권장되면 수치 상태를 보존하려는 경우이 래퍼 기능 만 사용하십시오. 차이점은 다음 코드를 참조 할 수 있습니다.
코드 사본은 다음과 같습니다.
// 원본 문자열
var greet = "안녕하세요";
// split () 메소드를 사용하여 분할하십시오
greet.split ( '') [0]; // "안녕하세요"
// 원래 유형에 새 속성을 추가하면 오류가보고되지 않습니다.
greet.smile = true;
//이 값은 얻을 수 없습니다 (18 장 ECMAScript 구현 이유에 대해 이야기했습니다)
console.log (typeof greet.smile); // "한정되지 않은"
// 원본 문자열
var greet = new String ( "안녕하세요");
// split () 메소드를 사용하여 분할하십시오
greet.split ( '') [0]; // "안녕하세요"
// 래퍼 기능 유형에 새 속성을 추가하면 오류가보고되지 않습니다.
greet.smile = true;
// 새로운 속성에 정상적으로 액세스 할 수 있습니다
console.log (typeof greet.smile); // "부울"
요약
이 장에서는 주로 생성자 모드 사용, 호출 방법 및 새로운 키워드의 차이점을 설명합니다. 나는 그것을 사용할 때 모든 사람들이 그것에주의를 기울이기를 바랍니다.
참조 : http://www.addyosmani.com/resources/estentialjsdesignpatterns/book/#constructorpatternjavaScript