JS 프로토타입에 대한 자세한 설명

이 글은 주로 JS 프로토타입에 대한 자세한 설명과 프로토타입의 5가지 규칙을 공유합니다. 이 글이 도움이 되기를 바랍니다.

• 모든 참조 유형(배열, 객체, 함수)에는 객체 특성, 즉 자유롭게 확장 가능한 속성("null" 제외)이 있습니다.

var obj ={};obj.a=100//100var arr=[];arr.a=100//100function fn(){}
fn.a=100//100

• 모든 애플리케이션 유형에는 proto 속성(암시적 프로토타입)이 있습니다. , 속성 값은 일반 객체입니다

console.log(obj.__proto__);//{constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}console.log(arr.__proto__);//[constructor: ƒ, concat: ƒ, pop: ƒ, push: ƒ, shift: ƒ, …]console.log(fn.__proto__);
//ƒ () { [native code] }

• 모든 함수에는 프로토타입 속성(명시적 프로토타입)이 있으며, 속성 값도 일반 객체입니다

console.log(fn.prototype)
//{constructor: ƒ}

• All 의 proto 속성 값 참조 유형은 해당 생성자의 프로토타입 속성 값을 가리킵니다(즉, 모든 참조 유형의 암시적 프로토타입은 해당 생성자의 명시적 프로토타입을 가리킵니다).

console.log(obj.__proto__===Object.prototype);  //true//Object是一个构造函数

• 객체의 특정 속성을 얻으려고 할 때, 객체 자체에 이 속성이 없으면 proto(즉, 생성자의 프로토타입)에서

/*测试*/function Foo(name,age){
    this.name = name;
}
Foo.prototype.alertName = function(){//由于Foo.prototype本身也是一个对象，而对象是可以自由扩展属性的
    alert(this.name);
}var f = new Foo('zhan');
f.printName = function(){
    console.log(this.name);
}
f.printName();//zhan 可以直接在这个对象中找到这个属性f.alertName();//alert弹出zhan 这时候在这个对象本身找不到这个属性，去Foo.prototype找,得到值/*******************************//*之前在牛可网碰到到一道面试题*/var A = {n:4399};var B = function(){
    this.n = 9999;
}var C = function(){
    var n = 8888;
}
B.prototype = A;
C.prototype = A;var b = new B();var c = new C();
A.n++;
console.log(b.n);//9999console.log(c.n);//4400//先从他的实例中找，找不到去它的构造函数的prototype中找

this

을 찾습니다. 위 테스트 코드의 경우 항상 다음을 가리킵니다. f.alertName
을 실행하면 zhan

루프 자체의 속성이 팝업될 수 있습니다

또는 위 테스트 코드의 경우 루프를 실행하면 name 속성, AlertName 속성, printName 속성을 찾을 수 있지만 일반적으로 , 우리는 name 속성 및 printName 속성

var itemfor(item in f){    if(f.hasOwnProperty(item)){
        console.log(item);     // 高级浏览器已经在forin中屏蔽了来自原型的属性
     //但在这里建议大家还是加上这个判断，保证程序的健壮性（程序对于规范要求以外的输入情况的处理能力）

    }
}

과 같이 객체 자체에 의해 정의된 속성만 가져오기를 바랍니다. 관련 권장 사항:

인스턴스 분석 js 프로토타입 및 call()

JS 프로토타입의 4단계 상속

js 정보 프로토타입 체인에 대한 7가지 추천 기사

위 내용은 JS 프로토타입에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!