js의 Prototype 속성 사용법에 대한 자세한 설명

모든 생성자에는 프로토타입이라는 속성이 있습니다(프로토타입은 아래에서 번역되지 않으므로 원본 텍스트를 사용하세요). 이 속성은 특정 클래스에 대한 공통 변수나 함수를 선언하는 데 매우 유용합니다.

프로토타입 정의 프로토타입 특성은 모든 생성자에 존재하므로 명시적으로 선언할 필요가 없습니다. 다음 예를 살펴보세요.

예제 PT1

CODE:

function Test()
{
}
alert(Test.prototype); // 输出 “Object"

Add attribute to 프로토타입

위에서 볼 수 있듯이 프로토타입은 객체이므로 속성을 추가할 수 있습니다. 프로토타입에 추가하는 속성은 이 생성자를 사용하여 생성된 객체의 공통 속성이 됩니다.

예를 들어, 아래에 Fish라는 데이터 유형이 있고 모든 물고기가 다음 속성을 갖기를 원합니다. 이를 달성하려면 해당 속성을 생성자의 프로토타입에 추가할 수 있습니다. 물고기.

예제 PT2

CODE:

function Fish(name, color)
{
this.name=name;
this.color=color;
}
Fish.prototype.livesIn="water";
Fish.prototype.price=20;

다음으로 몇 가지 물고기를 만들어 보겠습니다.

CODE:

var fish1=new Fish("mackarel", "gray");
var fish2=new Fish("goldfish", "orange");
var fish3=new Fish("salmon", “white");

물고기의 속성을 살펴보겠습니다.

CODE:

for (int i=1; i<=3; i++)
{
var fish=eval_r("fish"+i);   // 我只是取得指向这条鱼的指针
alert(fish.name+","+fish.color+","+fish.livesIn+","+fish.price);
}

출력은 다음과 같아야 합니다. :

CODE:

"mackarel, gray, water, 20"
"goldfish, orange, water, 20"
"salmon, white water, 20”

모든 물고기에는livesIn 및 가격 속성이 있다는 것을 알 수 있지만, 우리는 각 물고기에 대해 이러한 속성을 구체적으로 선언하지도 않습니다. 이는 객체가 생성될 때 이 생성자가 해당 속성 프로토타입을 새 객체의 내부 속성인 __proto__에 할당하기 때문입니다. 이 __proto__는 이 개체에서 해당 속성을 찾는 데 사용됩니다.

프로토타입을 통해 모든 객체에 공통 기능을 추가할 수도 있습니다. 이는 객체를 생성할 때마다 이 함수를 생성하고 초기화할 필요가 없다는 장점이 있습니다. 이를 설명하기 위해 예제 DT9를 다시 방문하여 프로토타입을 사용하여 다시 작성해 보겠습니다.


프로토타입을 사용하여 객체에 함수 추가

예 PT3

CODE:

function Employee(name, salary)
{
this.name=name;              
this.salary=salary;
}
Employee.prototype.getSalary=function getSalaryFunction()
{
return this.salary;
}
Employee.prototype.addSalary=function addSalaryFunction(addition)
{
this.salary=this.salary+addition;
}

평소와 같이 객체를 생성할 수 있습니다.

CODE:

var boss1=new Employee("Joan", 200000);
var boss2=new Employee("Kim", 100000);
var boss3=new Employee("Sam", 150000);

확인하세요:

CODE:

alert(boss1.getSalary());   // 输出 200000
alert(boss2.getSalary());   // 输出 100000
alert(boss3.getSalary());   // 输出 150000

다음은 프로토타입이 어떻게 작동하는지 보여주는 그림입니다. 이 개체의 각 인스턴스(boss1, boss2, boss3)에는 생성자(Employee)의 프로토타입 속성을 가리키는 __proto__라는 내부 속성이 있습니다. getSalary 또는 addSalary를 실행하면 이 객체는 __proto__에서 이 코드를 찾아 실행합니다. 참고하세요: 여기에는 중복된 코드가 없습니다(예제 DT8의 다이어그램과 비교). ㅋㅋㅋ 맞춤 배열

위 내용은 js의 Prototype 속성 사용법에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!