자바스크립트 프로토타입 프로토타입에 대한 자세한 설명(기본과정)

프로토타입은 JavaScript에서 특히 중요한 개념이므로 잘 이해하지 않으면 기본적으로 JS를 잘 사용하거나 배우는 것이 불가능합니다. 게다가 이 개념은 처음 접하는 사람들에게는 어려울 수도 있습니다. 친구들에게는 조금 어려울 수 있으니 코드 예시를 통해 프로토타입 프로토타입의 사용법을 간략히 소개하겠습니다

자바스크립트 프로토타입 프로토타입에 대한 간략한 소개:
프로토타입 프로토타입은 자바스크립트에서 특히 중요한 개념으로, 익히면 꼭 마스터해야 하는 개념입니다. 잘 이해하지 못해서, js를 더 잘 사용하거나 배우는 것은 기본적으로 불가능하고, 이 개념이 조금 어려워서 처음 접하는 친구들에게는 조금 어려울 수도 있으니, 코드 예시를 통해 프로토타입의 사용법을 간략하게 소개하겠습니다. .

1. 기본 개념:

모든 함수에는 프로토타입 속성이 있습니다.
이 속성은 객체를 가리킬 수 있는 포인터이며 이 객체는 생성자가 만든 객체 인스턴스에 의해 공유됩니다. 즉, 이 객체를 상속합니다.
요약: 프로토타입이 가리키는 객체는 생성자가 만든 객체 인스턴스에 의해 공유됩니다.
생성된 객체 인스턴스에는 생성자 프로토타입(프로토타입)이 가리키는 객체에 대한 포인터인 내부 속성 [[프로토타입]]이 있습니다.
먼저 코드를 보세요:

<script>
function antzone(name,age){
 this.webname=name;
 this.age=age;
}
antzone.prototype.getName=function(){
 return this.webname;
}
var oantzone=new antzone("PHP中文网",10);
console.log(oantzone.getName());
</script>

II. 코드 예:
예제 1:

function antzone(name,age){
 this.webname=name;
 this.age=age;
}
var obj={
 address:"江苏省徐州"
}
var oantzone=new antzone("PHP中文网",10);
antzone.prototype=obj;
console.log(oantzone.address);

위 코드를 보면 많은 친구들이 출력 값이 "Xuzhou, Jiangsu Province"이지만 실제 출력 내용은 정의되지 않았습니다. 이는 생성자를 사용하여 oantzone 객체를 생성할 때 oantzone 객체의 내부 속성 [[Prototype]]이 프로토타입 프로토타입이 가리키는 객체를 가리키기 때문입니다. antzone() 생성자 이후 antzone.prototype=obj가 반복됩니다. 생성자의 프로토타입을 설정하고 oantzone의 내장 속성 [[Prototype]]은 여전히 ​​원래 객체를 가리킵니다. 당연히 oantzone.address는 정의되지 않습니다.
예제 2:

<script>
function antzone(name,age){
 this.webname=name;
 this.age=age;
}
var obj={
 address:"江苏省徐州"
}
antzone.prototype=obj;
var oantzone=new antzone("PHP中文网",10);
console.log(oantzone.webname+oantzone.address);
</script>

이 코드와 이전 코드의 유일한 차이점은 8번째와 9번째 줄을 바꿔서 "Xuzhou, Jiangsu Province"가 출력될 수 있다는 점입니다. , 프로토타입을 재설정한 후에 객체 인스턴스가 생성되기 때문입니다.
예제 3:

function antzone(name,age){
 this.webname=name;
 this.age=age;
}
var obj={
 address:"江苏省徐州"
}
antzone.prototype.add=obj;
var oantzone=new antzone("PHP中文网",10);
console.log(oantzone.add.address);

위 코드는 객체 프로토타입을 수정만 하고 재설정하지는 않습니다.

위 내용은 모두를 위해 제가 정리한 내용입니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련글 :

JS에서 JSON 데이터를 가져오는 간단한 호출에 대하여(코드 첨부, 단순, 조악)

JS에서 EL 표현식 사용에 대한 자세한 소개

Entry- 레벨 동영상.js사용 참고 사항(코드 첨부)

위 내용은 자바스크립트 프로토타입 프로토타입에 대한 자세한 설명(기본과정)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!