일반 JavaScript 함수에는 프로토타입이 있나요?

JavaScript 일반 함수에는 프로토타입이 있습니다. JavaScript에서 모든 함수에는 함수의 프로토타입 개체를 가리키는 프로토타입 속성이 있습니다. 프로토타입의 기능은 실제로 클래스(함수)에 대한 "공개 영역"을 제공하는 것입니다. 이 공개 영역에 선언된 속성과 메서드는 이 클래스를 통해 생성된 모든 객체에서 액세스할 수 있으므로 메모리 소비를 줄일 수 있습니다.

이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.

함수의 Prototype 속성(prototype)

1. 함수를 생성하는 동안 함수는 자동으로 함수의 프로토타입 개체를 가리키는 프로토타입 속성을 얻습니다.

fn 함수를 생성하면 함수의 프로토타입 객체인 프로토타입 속성이 자동으로 획득됩니다. 프로토타입 객체에는 기본적으로 함수 자체를 가리키는 생성자 속성이 있음을 알 수 있습니다. 그것은 fn입니다.

프로토타입의 기능은 실제로 클래스(함수)에 대한 [공개 영역]을 제공하는 것입니다. 이 공개 영역에 선언된 속성과 메서드는 이 클래스를 통해 생성된 모든 개체에서 액세스할 수 있습니다. 메모리 소비를 줄입니다.

2. 함수의 프로토타입 속성은 객체입니다.

typeof fn.prototype  //"object"

프로토타입 속성은 객체입니다. 그러면 일반 객체 형태로 해당 속성과 메서드에 액세스하는 것 외에 어떻게 접근할 수 있나요? 대답은 함수가 '생성자' 역할을 할 때 '인스턴스를 생성하는 새 키워드'를 사용하여 프로토타입 속성의 해당 속성과 메서드에 액세스한다는 것입니다

function Fn(){
    this.name = "CJF"}
Fn.prototype.name="CJF1";
Fn.prototype.getName = function(){
    return this.name;
}var f = new Fn();
f.name;//输出 'CJF'f.getName(); //输出 'CJF'Fn.prototype.getName();//输出 'CJF1'

함수가 작동할 때 이를 볼 수 있습니다 인스턴스를 생성하기 위한 생성자로서 이 인스턴스는 프로토타입 객체에 대한 메서드를 호출할 수 있습니다. 이때 this는 f를 가리키며, name 속성이 있고 액세스할 수 있으므로 '를 출력합니다. CJF'에는 이름 속성이 없습니다. 그런 다음 스크립트 엔진은 현재 개체를 만드는 데 사용된 생성자의 프로토타입을 쿼리합니다(생성자 프로토타입 개체에 이름 속성이 있는 경우 f.constructor.prototype에 대한 액세스와 동일). , 'CJF1'을 반환합니다. (f와 해당 프로토타입 객체는 모두 name 속성을 가지며 객체 자체의 속성은 프로토타입 객체보다 우선순위가 높습니다.)

function Fn(){}
Fn.prototype.name="CJF1";
Fn.prototype.getName = function(){
    return this.name;
}var f = new Fn();
f.name;//输出 'CJF1'f.getName(); //输出 'CJF1'Fn.prototype.getName();//输出 'CJF1'

3. 프로토타입 프로토타입 객체의

"실시간"

왜냐하면 javascript에서는 , 모든 객체는

참조로

를 전달함으로써 새 함수 인스턴스를 생성할 때마다 자체 프로토타입의 복사본을 갖지 않습니다. 즉, 프로토타입을 수정하면 프로토타입 객체가 모든 인스턴스에서 공유됩니다 . 함수에 의해 생성된 모든 인스턴스 객체의 프로토타입은 그에 따라 변경됩니다.

function Fn(){}
Fn.prototype.name="CJF1";
Fn.prototype.getName = function(){
    return this.name;
}var f = new Fn();
f.name;//输出 'CJF1'f.getName(); //输出 'CJF1'f.getAge();//此时没有实例f并没有getAge方法  浏览器会报错 Uncaught TypeError: f.getAge is not a function//加上后面的就可以正常访问了Fn.prototype.getAge = function(){
    return 20;
}
f.getAge();//20

4. 프로토타입 체인

방금 우리는 객체의 자체 속성과 프로토타입 속성이 동일할 때 자체 속성의 우선순위가 프로토타입 속성의 우선순위보다 높지만 객체 자체에 프로토타입 속성이 없는 경우를 배웠습니다. 우리가 액세스하려는 속성이나 메소드는

현재 객체 생성자의 프로토타입 생성
(프로토타입 체인)을 따라 액세스할 속성을 검색합니다. 발견되면 해당 속성이 반환됩니다. 해당 프로퍼티가 없으면 undefound 가 반환됩니다. 그러나 접근하려는 메소드가 없으면 에러가 발생합니다. (아직 해당 메소드를 실행해야 하는 메소드가 없기 때문에 에러가 발생합니다.)

function Fn(){}
Fn.prototype.name="CJF1";
Fn.prototype.getName = function(){
    return this.name;
}var f = new Fn();
f.constructor.prototype == Fn.prototype //true

위 그림에서 인스턴스 f.

_proto_(앞뒤에 두 개의 밑줄)이 객체를 가리키는 것을 볼 수 있으며, 이 객체는 Fn.prototype 속성에 액세스합니다. 또는 이 비밀 링크(_proto_)를 따라가서 Object.prototype을 찾을 때까지 액세스하려는 항목을 찾는 것입니다. 해당 속성이 반환되면 해당 속성이 반환됩니다. 찾을 수 없으면 undef를 반환하지만, 액세스할 메서드를 찾으면 오류가 보고됩니다. 이 비밀 링크는 학습 및 디버깅에만 사용되며 실제 개발에는 사용되지 않습니다(Object.getPrototypeOf 메서드를 사용하는 것이 좋습니다).

f.toString()을 호출하면 인스턴스 f에 toString 메소드가 없기 때문에 비밀 링크를 따라 Object.prototype을 검색합니다. 왜냐하면 Object는 최상위 상위 클래스이고 다른 객체는 그로부터 직접 또는 간접적으로 상속되며, 비밀 링크가 이를 찾은 후 결과가 있으면 반환하고, 그렇지 않으면 정의되지 않은 것을 반환하거나 오류를 보고합니다. 따라서 Object.prototype.

_proto_ = null이 나타납니다. 【관련 추천:

javascript 비디오 튜토리얼

, 프로그래밍 비디오】

위 내용은 일반 JavaScript 함수에는 프로토타입이 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!