JavaScript原型學習筆記

一、理解誤區

關於 instanceof理解誤區

1.之前一直以爲instanceof是用來判斷一個對象是否某個函數以構造函數調用實例化出來的實例

//導致產生理解誤區的mode
function F1(){};
let f1=new F1();
console.log(f1 instanceof F1);//true

關於isPrototypeOf理解誤區

1.之前一直以爲isPrototypeOf是用來判斷一個對象是否爲另一個實例對象通過原型鏈指向上一層的對象

//導致產生理解誤區的mode
function F1(){};
let f1=new F1();
console.log(F1.prototype.isPrototypeOf(f1));//true

二、重新理解後

重新理解instanceof後

1.instanceof 只認用於構造函數調用的函數的prototype的指向,如果函數的prototype是實例對象通過原型鏈往上查找的任意一層原型,就相等,
2.所以無法用 instanceof 判斷某個對象是否爲某個函數通過構造函數調用後實例化出來的對象,
3.只能用於判斷,某個函數的prototype是否是於某個對象通過[[prototype]]鏈往上查找的某一層原型,如果是這個[[prototype]]鏈的某一層,便返回true

//推翻我理解誤區的demo
let proObj = {};
function Fn1() {}
Fn1.prototype=proObj
function Fn2() {}
Fn2.prototype=proObj

let fn1=new Fn1();

console.log(fn1 instanceof Fn2);//true

重新理解isPrototypeOf後

1.isPrototypeOf無法用於判斷一個對象是否爲另一個對象通過[[prototype]]鏈往上查找的上一層對象;
2.F1.prototype明顯不是f3通過[[prototype]]鏈查找的上一層對象,但是返回true,所以isPrototypeOf的判斷可能僅爲一個函數的prototype是否爲某個對象通過[[prototype]]鏈往上查找的某一層對象,僅此而已
3.instanceof 也是類似的功能,查找的不僅僅是通過[[prototype]]鏈往上查找的上一層而已,是某一層

//推翻我理解誤區的demo
function F1() {}
function F2() {}
F2.prototype=new F1();
function F3() {}
F3.prototype=new F2();
let f3=new F3();
console.log(F1.prototype.isPrototypeOf(f3));//true
console.log(f3 instanceof F1);//true