1. 프로토 타입 객체
1.1 생성자의 단점
JavaScript는 생성자를 통해 새로운 객체를 생성하므로 생성자는 객체의 템플릿으로 간주 될 수 있습니다. 인스턴스 객체의 특성 및 메소드는 생성자 내부에서 정의 될 수 있습니다.
기능 고양이 (이름, 색) {this.name = 이름; this.color = color;} var cat1 = 새로운 고양이 ( '큰 머리', '흰색'); cat1.name // '큰 머리카락'.color // '화이트'위 코드의 CAT 기능은 생성자입니다. 이름 속성 및 색상 속성은 내부적으로 정의됩니다. 모든 인스턴스 객체는이 두 속성을 생성합니다. 그러나 동일한 생성자의 객체 인스턴스간에 속성을 공유 할 수 없기 때문에 시스템 리소스 낭비가 이렇게하는 것이 있습니다.
기능 고양이 (이름, 색) {this.name = 이름; this.color = 색상; this.meow = function () {console.log ( 'Mew, Mew, Mew ...'); .위의 코드에서, CAT1 및 CAT2는 동일한 생성자의 인스턴스이다. 그러나 그들의 meow 방법은 다릅니다. 즉, 새로운 인스턴스가 생성 될 때마다 새로운 Meow 메소드가 생성됩니다. 모든 MEOW 방법은 동일한 동작이며 완전히 공유해야하기 때문에 시스템 자원이 필요하거나 시스템 리소스를 폐기하지 않습니다.
1.2 프로토 타입 속성의 역할
JavaScript 언어에서 각 객체에는 프로토 타입 객체라고하는 해당 프로토 타입 객체가 있습니다. 프로토 타입 객체에 정의 된 모든 속성 및 방법은 파생 된 객체에 의해 상속 될 수 있습니다. 이것은 JavaScript 상속 메커니즘의 기본 설계입니다.
이 접근법 외에도 JavaScript는 인스턴스 객체를 정의하는 또 다른 방법을 제공합니다. 우리는 생성자가 함수, 객체이며 고유 한 속성과 방법이 있음을 알고 있습니다. 하나의 프로토 타입 속성은 일반적으로 프로토 타입 객체라고하는 다른 객체를 가리 킵니다. 이 개체는 매우 특별합니다. 정의 된 속성 및 메소드가 모든 인스턴스 객체에서 공유 할 수있는 한. 즉, 생성자가 인스턴스 객체를 생성 할 때 인스턴스 객체에 자동으로 프로토 타입 속성이 할당됩니다.
기능 동물 (이름) {this.name = name;} 동물성 .prototype.color = "흰색"; var cat1 = new Animal ( '큰 머리카락'); var cat2 = new Animal ( 'erimao'); cat1.color // 'White'cat2.color //'White '위의 코드는 생성자 동물의 프로토 타입 객체에 색상 속성을 추가합니다. 결과적으로 인스턴스 객체 CAT1 및 CAT2는이 특성을 가지고 있습니다.
보다 특히, 프로토 타입 객체가 수정되는 한, 인스턴스 객체에 변경 사항이 즉시 반영됩니다.
Animal.prototype.color = "Yellow"; cat1.color // '옐로우'cat2.color //'옐로우 '
위의 코드는 프로토 타입 객체의 색상 속성 값을 노란색으로 변경하고 두 인스턴스 객체의 색상 속성 값이 즉시 변경됩니다. 인스턴스 객체에는 실제로 색상 속성이 없기 때문에 프로토 타입 객체의 색상 속성을 모두 읽습니다. 즉, 인스턴스 객체 자체에 특정 속성이나 방법이 없으면 생성자의 프로토 타입 객체로 이동하여 속성 또는 방법을 찾습니다. 이것은 프로토 타입 객체에 대한 특별한 점입니다.
인스턴스 객체 자체에 특정 속성 또는 방법이있는 경우 더 이상 프로토 타입 객체 에서이 속성 또는 메소드를 찾지 않습니다.
cat1.color = 'black'; cat2.color // 'Yellow'animal.prototype.color // "Yellow";
위의 코드는 인스턴스 객체 CAT1의 색상 속성을 검정으로 변경하여 더 이상 프로토 타입 객체에서 색상 속성을 읽을 필요가 없으며 후자의 값은 여전히 노란색입니다.
요컨대, 프로토 타입 객체의 기능은 모든 인스턴스 객체에서 공유하는 속성과 메소드를 정의하는 것이므로 인스턴스 객체의 프로토 타입이라고도하며 인스턴스 객체는 프로토 타입 객체에서 파생 된 것으로 간주 될 수 있습니다.
Animal.prototype.walk = function () {console.log (this.name + '가 걷고 있습니다.');};위의 코드는 Animal.protype 객체의 워크 메소드를 정의하며 모든 동물 인스턴스 객체에서 호출됩니다.
1.3 프로토 타입 체인
JavaScript의 모든 객체에는 생성자가 있고 모든 생성자는 프로토 타입 속성 (실제로 모든 기능에는 프로토 타입 속성이 있음)이 있으므로 모든 객체에는 고유 한 프로토 타입 프로토 타입 객체가 있습니다.
따라서 객체의 특성 및 방법은 자체 또는 프로토 타입 객체 (위 코드의 워크 메소드와 같은)에 정의 될 수 있습니다. 프로토 타입 자체는 객체이며 자체 프로토 타입이 있으므로 프로토 타입 체인이 형성됩니다. 예를 들어, 객체 A는 객체 B의 프로토 타입이며, 개체 B는 객체 C의 프로토 타입 등입니다. 소스의 루트를 추적하기 때문에 소스의 객체는 객체 생성자 (새 개체 () 명령 사용)에서 생성되므로 레이어로 레이어를 추적하면 모든 객체의 프로토 타입이 결국 Object.Prototype으로 추적 될 수 있습니다. 그렇다면 Object.prototype에 대한 프로토 타입이 있습니까? 객체의 프로토 타입은 특성과 방법이없는 널이기 때문에 대답은 예 또는 아니오 일 수 있습니다.
object.getPrototype (Object.Prototype) // null
위의 코드는 객체의 프로토 타입이 null임을 나타냅니다. NULL에는 특성이 없기 때문에 프로토 타입 체인은 여기서 끝납니다.
"프로토 타입 체인"의 기능은 객체의 특정 속성을 읽을 때 JavaScript 엔진이 먼저 객체 자체의 속성을 찾는 것입니다. 찾을 수 없다면 프로토 타입을 찾습니다. 여전히 찾을 수 없다면 프로토 타입의 프로토 타입을 찾습니다. 그리고 객체가 최상위 레벨의 프로토 타입을 아직 찾을 수 없으면 정의되지 않은 반환을 반환합니다.
예를 들어, 함수의 프로토 타입 속성이 배열을 가리키면 기능을 배열 생성자로 사용할 수 있음을 의미합니다. 생성하는 인스턴스 객체가 프로토 타입 속성을 통해 배열 메소드를 호출 할 수 있기 때문입니다.
function myArray () {} myArray.prototype = new Array (); myArray.prototype.constructor = myArray; var mine = new myArray (); mine.push (1, 2, 3); mine.length // 3Mine instanceof array // true.위 코드의 광산은 MyArray의 인스턴스 객체입니다. MyArray의 프로토 타입 속성은 배열을 가리키기 때문에 광산은 배열 메소드를 호출 할 수 있습니다 (이 방법은 실제로 배열의 프로토 타입 객체에 정의됩니다). 표현식 인스턴스의 마지막 줄은 연산자 인스턴스가 객체가 생성자의 인스턴스인지 여부를 비교하는 데 사용되며 마지막 줄은 광산이 배열 인스턴스임을 나타냅니다.
배열의 광산 인스턴스 // (array === myArray.prototype.constructor) || (array === array.prototype.constructor) || (배열 === 객체 .prototype.constructor)
위의 코드는 인스턴스 객체의 모든 프로토 타입 객체의 생성자 속성과 비교되는 연산자 인스턴스의 본질을 보여줍니다 (이 속성의 소개는 다음 섹션을 참조하십시오). 하나가있는 한 true를 반환하고 그렇지 않으면 거짓을 반환합니다.
1.4 생성자 속성
프로토 타입 객체에는 프로토 타입 객체가 기본적으로 위치한 생성자 함수를 가리키는 생성자 속성이 있습니다.
함수 p () {} p.prototype.constructor === p // true생성자 속성은 프로토 타입 객체에 정의되므로 모든 인스턴스 객체에 의해 상속 될 수 있음을 의미합니다.
함수 p () {} var p = new p = new p (); pronstructor // function p () {} p.constructor === prototype.constructor // truep.hasownproperty ( 'constructor') // false위의 코드는 P가 생성자 P의 인스턴스 객체임을 나타내지 만 P 자체에는 생성자 속성이 없으며 실제로 프로토 타입 체인에서 p.prototype.constructor 속성을 읽는 것입니다.
생성자 속성의 함수는 프로토 타입 객체가 정의되는 생성자를 구별하는 것입니다.
함수 f () {}; var f = new f (); f.constructor === f // truef.constructor === regexp // false위의 코드는 생성자 특성을 사용하여 변수 f의 생성자 함수가 regexp가 아닌 f임을 결정한다는 것을 의미합니다.
2. object.getPrototypof 방법
object.getPrototype Method는 객체의 프로토 타입을 반환합니다.
// 빈 객체의 프로토 타입은 Object.prototypeObject.getPrototype ({}) === Object.Prototype // true // function의 프로토 타입은 함수입니다 .ProtoTypeFunction f () {} 대상. f.protoTypevar f = new f (); object.getPrototypo (f) === F. prototype // true3. object.create 메소드
객체. 만족 메소드는 새 개체를 생성하는 데 사용되며 새 명령을 대체 할 수 있습니다. 그것은 대상을 인수로 받아들이고 새로운 객체를 반환하는데, 이는 전자의 속성을 완전히 상속합니다. 즉, 전자는 후자의 프로토 타입이됩니다.
var o1 = {p : 1}; var o2 = object.create (o1); o2.p // 1위의 코드에서 Object.create 메소드는 O1을 기반으로 O2를 생성합니다. 현재 O1은 O2의 프로토 타입, 즉 O2는 O1의 모든 특성을 상속합니다.
객체. 크리에이티 메소드는 기본적으로 다음 코드와 동일합니다. 이전 브라우저가 객체를 지원하지 않으면 다음 코드를 사용하여 직접 배포 할 수 있습니다.
if (object.create! == "function") {object.create = function (o) {function f () {} f.prototype = o; 새로운 f ()를 반환합니다. };}위의 코드는 Object.create 메소드가 본질적으로 새 생성자 F를 생성 한 다음 F의 프로토 타입 속성이 Object O를 프로토 타입으로 가리키고 마지막으로 f의 인스턴스를 반환하여 인스턴스가 O의 속성을 상속받을 수 있음을 보여줍니다.
다음 세 가지 방법으로 생성 된 새로운 객체는 동일합니다.
var o1 = 객체.
속성을 상속하지 않는 객체 (예 : Tostring 및 value의 메소드)를 생성하려면 객체를 설정할 수 있습니다.
var o = 객체.
위의 코드는 오브젝트 O의 프로토 타입이 NULL 인 경우 객체의 값과 같은 객체에 정의 된 속성이 없음을 나타냅니다.
객체를 사용하는 경우 객체 프로토 타입을 제공해야합니다. 그렇지 않으면 오류 가보고됩니다.
object.create () // typeerror : 객체 프로토 타입은 객체 일 수도 있고 null 일 수 있습니다.
객체에 의해 생성 된 새로운 객체는 프로토 타입을 동적으로 상속합니다. 프로토 타입에서 메소드를 추가하거나 수정하면 새 객체에 즉시 반영됩니다.
var o1 = {p : 1}; var o2 = object.create (o1); o1.p = 2; o2.p // 2위의 코드는 객체 프로토 타입을 수정하면 새로 생성 된 객체에 영향을 미칩니다.
Object.Create 메소드는 객체 프로토 타입 외에도 객체와 동일한 형식 인 속성을 설명하는 속성 객체를 나타내는 두 번째 매개 변수를 허용 할 수 있습니다. 설명하는 객체 속성은 새 개체에 추가됩니다.
var o = 객체.
객체는 생성자를 사용하지 않기 때문에 인스턴스 연산자를 사용하여 객체가 어떤 생성자 인스턴스인지 결정할 수 없습니다. 이 시점에서 다음 isprototype 메소드를 사용하여 프로토 타입이 어떤 객체인지 해석 할 수 있습니다.
4. 세포 타입의 방법
isprototype의 방법은 물체가 다른 객체의 프로토 타입인지를 결정하는 데 사용됩니다.
var o1 = {}; var o2 = 객체.위의 코드는 객체가 프로토 타입 체인에있는 한 isprotypeof가 true를 반환한다는 것을 보여줍니다.
5. 간단한 예
var classDemo = function () {// 정적 개인 변수 var var private_static_var = 'aaaa'; // 정적 개인 메소드 var private_static_func = function (key) {return key + private_static_var; } // private method, 키는이 var private_func = function (self, key)을 전달하는 것입니다. {return private_static_func (key + self.id); } var _class = function (id) {// 생성자 this.id = id; // public variable} // public method_class.prototype.public_func = function (key) {return private_func (this, key); } return _class;} (); var a = new ClassDemo ( 'Hello World'); Alert (a.public_func ( 'World Hello'));개인 변수와 공개 정적 변수/방법을 구현하는 간단한 방법은 없지만이 정도까지 캡슐화로 충분합니다.