Java와 같은 일반적인 객체 지향 언어에는 클래스 개념이 있습니다. 클래스는 객체의 템플릿이고 객체는 클래스의 인스턴스입니다. 그러나 JavaScript 언어 시스템에는 클래스 개념이 없습니다. JavaScript는 '클래스'를 기반으로하지 않지만 생성자 및 프로토 타입 체인을 통해 구현됩니다. 그러나 ES6은 전통적인 언어에 가까운 작문 방법을 제공하여 클래스 (클래스)의 개념을 객체 템플릿으로 도입합니다. 클래스 키워드를 통해 클래스를 정의 할 수 있습니다. 기본적으로 ES6의 클래스는 구문 설탕으로 간주 될 수 있습니다. 대부분의 기능은 ES5에 의해 달성 될 수 있습니다. 새로운 클래스 쓰기 방법은 프로토 타입 객체를 객체 지향 프로그래밍 구문과 유사하게 작성합니다.
내 습관에 따르면, 나는 기사 디렉토리를 작성하기 전에 줄 것입니다.
다음 내용은 다음 하위 섹션으로 나뉩니다.
1. 생성자에 대한 간단한 소개
2. 생성자의 단점
3. 프로토 타입 속성의 역할
4. 프로토 타입 체인
5. 건설자 속성
5.1 : 생성자 속성의 역할
6. 운영자 인스턴스
1. 생성자에 대한 간단한 소개
자바 스크립트의 생성자와 새로운 명령 간의 밀접한 관계에 관한 기사에서, 생성자의 개념과 특성, 새로운 명령의 원칙 및 사용법 등이 자세히 소개됩니다. 생성자에 익숙하지 않으면 가서 신중하게 맛볼 수 있습니다. 간단한 검토가 있습니다.
소위 생성자는 객체를 생성하기위한 템플릿을 제공하고 객체의 기본 구조를 설명하는 함수입니다. 생성자는 각각 동일한 구조를 가진 여러 객체를 생성 할 수 있습니다. 일반적으로 생성자는 객체의 템플릿이고 객체는 생성자의 인스턴스입니다.
생성자의 특성은 다음과 같습니다.
A : 생성자의 함수 이름의 첫 번째 문자는 대문자를 대문자로 삼아야합니다.
B :이 개체를 내부적으로 사용하여 생성 할 객체 인스턴스를 가리 킵니다.
C : 새 연산자를 사용하여 생성자를 호출하고 개체 인스턴스를 반환하십시오.
가장 간단한 예를 살펴 보겠습니다.
function person () {this.name = 'keith';} var boy = new person (); console.log (boy.name); // 'keith'2. 생성자의 단점
모든 인스턴스 객체는 생성자에서 속성 및 메소드를 상속받을 수 있습니다. 그러나 동일한 개체 인스턴스간에 속성을 공유 할 수 없습니다.
기능인 (이름, 높이) {this.name = 이름; this.height = 높이; this.hobby = function () {return '영화보기';}} var boy = new Person ( 'keith', 180); var girl = 새로운 사람 ( 'rascal', 153); Console.log (Boy.Name); // 'keith'console.log (girl.name); // 'rascal'console.log (boy.hobby === girl.hobby); //거짓위의 코드에서 생성자 사람은 두 개의 객체 인스턴스 보이와 소녀를 생성하며 두 개의 속성과 방법이 있습니다. 그러나 그들의 취미 방법은 다릅니다. 즉, 새로 사용하여 생성자를 호출하여 객체 인스턴스를 다시 넣을 때마다 취미 메소드가 생성됩니다. 모든 취미 방법은 유치한 행동이며 두 개의 객체 인스턴스에 의해 완전히 공유 될 수 있기 때문에 이것은 필요하거나 자원 낭비가 아닙니다.
따라서 생성자의 단점은 동일한 생성자의 객체 인스턴스간에 속성 또는 메소드를 공유 할 수 없다는 것입니다.
3. 프로토 타입 속성의 역할
생성자의 객체 인스턴스간에 속성을 공유 할 수 없다는 단점을 해결하기 위해 JS는 프로토 타입 속성을 제공합니다.
JS의 각 데이터 유형은 객체 (NULL 및 정의되지 않은 제외)이며, 각 객체는 다른 객체에서 상속되며, 후자는 자체 프로토 타입 객체가없는 NULL을 제외한 "프로토 타입"객체라고합니다.
프로토 타입 객체의 모든 속성 및 메소드는 객체 인스턴스에서 공유됩니다.
객체 인스턴스가 생성자를 통해 생성되면, 객체 인스턴스의 프로토 타입은 생성자의 프로토 타입 속성을 가리 킵니다. 각 생성자에는 프로토 타입 속성이 있으며, 이는 객체 인스턴스의 프로토 타입 객체입니다.
기능인 (이름, 높이) {this.name = 이름; this.height = 높이; } person.prototype.hobby = function () {return '영화보기'; } var boy = 새로운 사람 ( 'Keith', 180); var girl = 새로운 사람 ( 'rascal', 153); Console.log (Boy.Name); // 'keith'console.log (girl.name); // 'rascal'console.log (boy.hobby === girl.hobby); //진실위 코드에서 취미 메소드가 프로토 타입 객체에 배치되면 두 인스턴스 객체 모두 동일한 메소드를 공유합니다. 모든 사람이 생성자에게 프로토 타입이 생성자로서의 속성이라는 것을 이해할 수 있기를 바랍니다. 객체 인스턴스의 경우 프로토 타입은 객체 인스턴스의 프로토 타입 객체입니다. 따라서 프로토 타입은 속성이자 객체입니다.
프로토 타입 객체는 객체 인스턴스의 속성이 아닙니다. 객체 인스턴스의 속성은 생성자 내부에 생성 할 객체 인스턴스를 가리키는 키워드가 있기 때문에 생성자의 정의에서 상속 된 속성입니다. 객체 인스턴스의 속성은 실제로 생성자가 내부적으로 정의한 속성입니다. 프로토 타입 객체의 특성 및 메소드가 수정되는 한 변경 사항은 모든 객체 인스턴스에 즉시 반영됩니다.
person.prototype.hobby = function () {반환 '수영'; } console.log (boy.hobby === girl.hobby); // true console.log (boy.hobby ()); // 'Swimming'Console.log (girl.hobby ()); //'수영'위의 코드에서, 프로토 타입 객체의 취미 메소드를 수정 한 후, 두 객체 인스턴스가 모두 변경되었습니다. 객체 인스턴스에는 실제로 취미 방법이 없기 때문에 프로토 타입 객체를 읽는 모든 취미 방법입니다. 즉, 객체 인스턴스에 속성과 방법이 없으면 프로토 타입 객체에서 검색됩니다. 인스턴스 객체 자체에 특정 속성 또는 메소드가 있으면 프로토 타입 객체에서 검색되지 않습니다.
boy.hobby = function () {return 'Play Basketball'; } console.log (boy.hobby ()); // 'Basketball'Console.log (girl.hobby ()); //'수영'위의 코드에서 Boy Object 인스턴스의 취미 메소드가 수정되면 프로토 타입 객체의 취미 메소드가 상속되지 않습니다. 그러나 소녀는 여전히 프로토 타입 객체의 방법을 상속받을 것입니다.
요약하려면 :
A : 프로토 타입 객체의 기능은 모든 객체 인스턴스에서 공유하는 속성과 메소드를 정의하는 것입니다.
B : 생성자의 경우 프로토 타입은 속성입니다. 객체 인스턴스의 경우 프로토 타입 객체입니다.
4. 프로토 타입 체인
객체의 특성 및 방법은 그 자체로 또는 프로토 타입 객체로 정의 될 수 있습니다. 프로토 타입 객체 자체는 객체에 대한 객체 인 인스턴스이며 자체 프로토 타입이 있으므로 프로토 타입 체인이 형성됩니다. 예를 들어, 객체 A는 객체 B의 프로토 타입이며, 개체 B는 객체 C의 프로토 타입 등입니다. 모든 객체의 프로토 타입의 상단은 객체입니다. 프로토 타입, 즉 객체 생성자의 프로토 타입 속성에 의해 지적되는 물체입니다.
물론 객체. 프로로 타입 객체에는 고유 한 프로토 타입 객체, 즉 속성과 방법이없는 널 객체가 있으며 Null 객체에는 고유 한 프로토 타입이 없습니다.
1 console.log (Object.getPrototypof (Object.Prototype)); // 널
2 console.log (person.prototype.isprototypof (boy)) // true
프로토 타입 체인의 특성은 다음과 같습니다.
A : 객체의 특정 속성을 읽을 때 JavaScript 엔진은 먼저 물체 자체의 특성을 찾습니다. 찾을 수 없다면 프로토 타입으로 이동합니다. 여전히 찾을 수 없다면 프로토 타입의 프로토 타입으로 이동합니다. Object.prototype 상단 레벨의 프로토 타입을 아직 찾을 수 없으면 정의되지 않은 것이 반환됩니다.
B : 객체 자체와 프로토 타입이 동일한 이름의 속성을 정의하면 객체 자체의 속성을 먼저 읽으며 "재정의"라고합니다.
C : 프로토 타입 체인 레벨에서 특정 속성을 찾는 것은 성능에 영향을 미칩니다. 원하는 프로토 타입 객체의 레벨이 높을수록 성능에 미치는 영향이 커집니다. 존재하지 않는 속성을 찾으면 전체 프로토 타입 체인을 통과합니다.
개념을 보는 것이 모호 할 수 있습니다. 예를 들어 봅시다. 그러나 개념을 이해하는 것이 정말 중요합니다.
var arr = [1,2,3]; Console.log (arr.length); //3console.log (arr.valueof ()) // [1,2,3] console.log (arr.join ( '|')) // 1 | 2 | 3
위의 코드에서 배열 ARR이 배열에 3 개의 요소가있는 배열 ARR이 정의됩니다. 배열에 속성이나 메소드를 추가하지는 않았지만 길이, join () 및 valueof ()를 호출 할 때 오류를보고하지 않았습니다.
길이 속성은 array.prototype에서 상속되며 프로토 타입 객체의 속성에 속합니다. 결합 방법은 또한 배열에서 상속되며 프로토 타입 객체의 메소드에 속합니다. 이 두 가지 방법은 모든 배열에서 공유됩니다. 인스턴스 개체에 길이 속성이 없으면 프로토 타입 객체가 검색됩니다.
메소드의 가치는 Object.Prototype에서 상속됩니다. 우선, ARR 어레이에는 값의 메소드가 없으므로 프로토 타입 객체 배열을 찾아보십시오. 그런 다음 Array.prototype 객체에 value의 메소드가 없다는 것을 알았습니다. 마지막으로 객체를 찾아보세요. 프로로 타입 객체.
배열의 속성과 메소드를 각각 객체와 객체. 프로토 타입 객체를 살펴 보겠습니다.
console.log (Object.getownPropertyNames (array.prototype)) // [ "길이", "tosource", "tostring", "tolocalestring", "join", "reverse", "sort", "푸시", "팝", "shift", "slice", "slice", "slice", "", "", "", "", "", ",", ",", ",", ","slice ","slice ","slice ","slice ","slice " "지도", "필터", "감소", "일부", "모든", "find", "findindex", "copywithin", "fill", "entries", "keys", "keys", "value", "consapertor", "$ set", "$ remove"]) (대상. "Tostring", "Tolocalestring", "Valueof", "Watch", "Unkatch", "HasownProperty", "isprototypof", "propertyiseNumerable", "__defineGetter__", "__definesetter__", "__lookupgetter__", "__lookupgetter__"
나는 당신이 이것을 볼 때, 당신은 여전히 프로토 타입에 대해 매우 약간의 이해를 가지고 있다고 생각합니다. 이것은 정상입니다. 결국, 그것은 JS에서 더 중요하고 추상적 인 개념입니다. 너무 빨리 마스터하는 것은 불가능합니다. 몇 가지 기사를 더 먹으면 본질을 마스터 할 수 있습니다. 어떤 식 으로든 살아있는 예가 있으며, 이는 모든 사람이 직면 할 문제 일 수도 있습니다. JS 생성자 및 프로토 타입 객체를 볼 수 있습니다.
5. 건설자 속성
프로토 타입 객체에는 프로토 타입 객체가 기본적으로 위치한 생성자 함수를 가리키는 생성자 속성이 있습니다.
함수 a () {}; Console.log (a.prototype.constructor === a) // true프로토 타입은 생성자의 특성이며 생성자는 생성자의 프로토 타입 속성, 즉 프로토 타입 객체의 특성에 의해 지적 된 객체입니다. 혼동하지 않도록주의하십시오.
console.log (a.hasownproperty ( '프로토 타입')); // true console.log (a.prototype.hasownproperty ( 'constructor')); //진실
생성자 속성은 프로토 타입 객체에 정의되므로 모든 인스턴스 객체에 의해 상속 될 수 있음을 의미합니다.
함수 a () {}; var a = 새로운 a (); Console.log (a.constructor); //a()console.log(a.constructor==a.prototype.constructor) ;//true위의 코드에서 A는 생성자 A의 인스턴스 객체이지만 A 자체에는 생성자 속성이 없으며 실제로 프로토 타입 체인을 읽는 것입니다.
A.Prototype.constructor 속성.
5.1 : 생성자 속성의 역할
A : 프로토 타입 객체가 속하는 생성자 기능을 결정합니다.
함수 a () {}; var a = 새로운 a (); console.log (a.constructor === a) // true console.log (a.constructor === array) // false위의 코드는 생성자 특성을 사용하여 인스턴스 오브젝트 A의 생성자 함수가 배열이 아닌 A임을 결정합니다.
B : 인스턴스에서 다른 인스턴스를 만듭니다
함수 a () {}; var a = new a (); var b = new a.constructor (); console.log (b 인스턴스 a); //진실위의 코드에서 A는 생성자 A의 인스턴스 객체이며 생성자는 a.constructor에서 간접적으로 호출 될 수 있습니다.
C : 자체 생성자를 호출 할 수 있습니다
a.prototype.hello = function () {return new this.constructor (); }D : 생성자로부터 다른 생성자를 상속하는 패턴을 제공합니다.
기능 아버지 () {} function son () {son.height.constructor.call (this); } son.height = 새로운 아버지 ();위의 코드에서 아버지와 아들은 둘 다 생성자입니다. 아들 안에있는 아버지를 부르는 것은 아버지를 물려받는 아들의 효과를 형성 할 것입니다.
E : 생성자 속성은 프로토 타입 객체와 생성자 간의 관계이므로 프로토 타입 객체를 수정할 때 생성자의 포인팅 문제에주의를 기울여야합니다.
두 가지 솔루션이 있습니다. 어느 쪽이든 생성자 속성을 원래 생성자 함수에 가리키거나 왜곡의 인스턴스를 피하기 위해 프로토 타입 객체에 속성과 방법을 추가하십시오.
6. 운영자 인스턴스
인스턴스 연산자는 지정된 객체가 생성자의 인스턴스인지를 나타내는 부울 값을 반환합니다.
함수 a () {}; var a = new a (); console.log (a 인스턴스); //진실인스턴스는 전체 프로토 타입 체인의 객체에 유효하기 때문에 동일한 인스턴스 객체가 여러 생성자에 대해 true를 반환 할 수 있습니다.
함수 a () {}; var a = 새로운 a (); Console.log (a 인스턴스); //trueconsole.log(a 인스턴스 객체); //진실객체의 인스턴스는 복잡한 데이터 유형 (배열, 객체 등)에만 사용할 수 있으며 간단한 데이터 유형 (부울 값, 숫자, 문자열 등)에는 사용할 수 없습니다.
var x = [1]; var o = {}; var b = true; var c = 'string'; Console.log (x instanceof Array); //trueconsole.log(o 인스턴스 객체); // true console.log (b instanceof boolean); //falseconsole.log(C 인스턴스 문자열); //거짓또한 Null이거나 정의되지 않은 것은 객체가 아니므로 인스턴스는 항상 False를 반환합니다.
Console.log (Null instanceof Object); // false console.log (undefined instanceof object); //거짓
연산자 인스턴스를 사용하면 생성자를 호출 할 때 새 명령을 추가하는 것을 잊어 버리는 문제를 영리하게 해결할 수도 있습니다.
함수 keith (이름, 높이) {if (!이 인스턴스 keith) {return new keith (이름, 높이); } this.name = 이름; this.height = 높이;}위의 코드에서 인스턴스 연산자는 기능 본체의 키워드가 생성자 Keith의 인스턴스를 가리키는 지 여부를 결정하는 데 사용됩니다. 그렇지 않다면 새 명령이 잊혀 졌다는 것을 의미합니다. 현재 생성자는 예상치 못한 결과를 피하기 위해 객체 인스턴스를 반환합니다.
공간 제한으로 인해 당분간 여기에서 소개하겠습니다.
다음 점유율에서는 Object.getPrototypo (), Object.setPrototypof () 등과 같은 프로토 타입 객체의 기본 방법에 대해 이야기하고 기본 객체를 얻는 방법을 비교할 것입니다.
위는 편집자가 귀하에게 소개 한 JavaScript의 프로토 타입 속성 (권장)에 대한 자세한 설명입니다. 나는 그것이 당신에게 도움이되기를 바랍니다.