js 原型繼承方面的理解
1.constructor 構(gòu)造器
1.1 函數(shù)的構(gòu)造器全部指向的是? Function
eg:
function Foo(param1, param2) {
this.param1 = param1;
this.param2 = param2;
this.say = function () {
console.log(this.parma1, this.param2);
}
}
console.log(Foo.constructor);? // ? Function() { [native code] }
function foo() {
console.log('this is a function');
}
console.log(foo.constructor);? // ? Function() { [native code] }
1.2 函數(shù)的實(shí)例的構(gòu)造器指向
eg:
function Foo(param1, param2) {
this.param1 = param1;
this.param2 = param2;
this.say = function () {
console.log(this.parma1, this.param2);
}
}
let f = new Foo('parma', 'param2');
console.log(f.constructor); // 指向當(dāng)前的Foo函數(shù)方法
function foo() {
console.log('this is a function');
}
console.log(foo.constructor);? // ? Function() { [native code] }
2.prototype
2.1 當(dāng)函數(shù)創(chuàng)建的時(shí)候息堂，js就會(huì)自動(dòng)創(chuàng)建一個(gè)protype
eg:
function Foo(param1, param2) {
this.param1 = param1;
this.param2 = param2;
this.say = function () {
console.log(this.parma1, this.param2);
}
}
console.log(Foo.prototype);? // Foo(param1, param2) 指向當(dāng)前函數(shù) 原型
function foo() {
console.log('this is a function');
}
console.log(foo.constructor);? // foo() 指向當(dāng)前函數(shù)
// 創(chuàng)建完函數(shù)的prototype 都會(huì)指向 functionName.prototype，
// 這個(gè)時(shí)候就可以往當(dāng)前原型的基礎(chǔ)之上添加屬性和方法,也可以指向另一個(gè)對(duì)象來(lái)實(shí)現(xiàn)集成。
Foo.prototype.trim = function() {
console.log('the function on prototype');
}
3.__proto__
3.1 每個(gè)對(duì)象或者是函數(shù)都會(huì)存在 __proto__
// javascript 可以通過(guò)prototype和__proto__未檩，在兩個(gè)對(duì)象之間建立一個(gè)聯(lián)系，使當(dāng)前對(duì)象可以訪問(wèn)另一個(gè)對(duì)象的方法和屬性贷屎。
// 這樣的關(guān)聯(lián)稱之為原型鏈贺氓，用來(lái)實(shí)現(xiàn)集成和屬性方法的共享。
3.2 call 和? constructor
// js 函數(shù)就會(huì)有這兩個(gè)方法用來(lái)創(chuàng)建實(shí)例
eg:
function Foo(param1, param2) {
this.param1 = param1;
this.param2 = param2;
this.say = function () {
console.log(this.parma1, this.param2);
}
}
let f = new Foo('parma', 'param2');? // 通過(guò)constructor構(gòu)造器來(lái)創(chuàng)建函數(shù)的實(shí)例
function foo() {
console.log('this is a function');
}
// foo 函數(shù)的執(zhí)行用兩種方式的寫法敬扛，但是是等價(jià)的
3.2.1 常用的執(zhí)行方式
foo(); // 執(zhí)行當(dāng)前函數(shù)
3.2.2 call 執(zhí)行函數(shù)
foo.call(); // 執(zhí)行當(dāng)前函數(shù)
3.3 __proto__ 的指向問(wèn)題
eg:
function Foo(param1, param2) {
this.param1 = param1;
this.param2 = param2;
this.say = function () {
console.log(this.parma1, this.param2);
}
}
let f = new Foo('parma', 'param2');
console.log(f.___proto__) // Foo(param1, param2)? Foo.prototype
console.log(Foo.___proto__) // Function.prototype
function foo() {
console.log('this is a function');
}
console.log(f.___proto__) // Function.prototype
4. 總結(jié)
4.1
let fo = new Foo('parma', 'param2');
fo.__proto__ == Foo.prototype;
fo.__proto__.__proto__ == Foo.prototype.__proto__ == Object.prototype;
fo.__proto__.__proto__.__proto__ == Foo.prototype.__proto__.__proto__ == Object.prototype.__proto__ == null;
Foo.__proto__ == Function.prototype;
Foo.__proto__.__proto__ == Function.prototype.__proto__;
Foo.__proto__.__proto__.__proto__ == Function.prototype.__proto__.__proto__ == Object.prototype.__proto__ == null;
