js 原型繼承方面的理解
1.constructor 構造器
1.1 函數的構造器全部指向的是? 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 函數的實例的構造器指向
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); // 指向當前的Foo函數方法
function foo() {
console.log('this is a function');
}
console.log(foo.constructor);? // ? Function() { [native code] }
2.prototype
2.1 當函數創建的時候，js就會自動創建一個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) 指向當前函數 原型
function foo() {
console.log('this is a function');
}
console.log(foo.constructor);? // foo() 指向當前函數
// 創建完函數的prototype 都會指向 functionName.prototype，
// 這個時候就可以往當前原型的基礎之上添加屬性和方法,也可以指向另一個對象來實現集成。
Foo.prototype.trim = function() {
console.log('the function on prototype');
}
3.__proto__
3.1 每個對象或者是函數都會存在 __proto__
// javascript 可以通過prototype和__proto__，在兩個對象之間建立一個聯系，使當前對象可以訪問另一個對象的方法和屬性。
// 這樣的關聯稱之為原型鏈，用來實現集成和屬性方法的共享。
3.2 call 和? constructor
// js 函數就會有這兩個方法用來創建實例
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');? // 通過constructor構造器來創建函數的實例
function foo() {
console.log('this is a function');
}
// foo 函數的執行用兩種方式的寫法，但是是等價的
3.2.1 常用的執行方式
foo(); // 執行當前函數
3.2.2 call 執行函數
foo.call(); // 執行當前函數
3.3 __proto__ 的指向問題
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. 總結
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;
