【原型链】基础知识扩展--通俗易懂

函数与对象

想学会原型链,需要先知道函数与对象的关系。

js的函数中每次new都会生成一个对象,也就像是一个构造方法一样。(箭头函数不会)

function Animal(){
    this.name = '动物';
    this.age = 1;
}

var dog = new Animal();

console.log(dog.name);
//动物
console.log(dog.age)
//1
console.log(dog)
// {
//  name:'动物', 
//  age:1
// }

每次new这个函数,这个函数都会自动return this,也就是指向他自己的对象。

原型链

通过上面的例子,我们能够看出函数其实会生成一个对象,尽管不new出来这个对象,这个函数在被创建的时候就已经生成了一个原型,它的原型可以用prototype获取到。

function Car(){
}

Car.prototype.name = '凯迪拉克';

var car1 = new Car()
var car2 = new Car()

console.log(car1.name);
console.log(car2.name);
//凯迪拉克
//凯迪拉克

我们在上面的例子里直接将Car的原型的name修改为凯迪拉克,所以以Car为原型的所有对象都能获取到原型链上的对象。

这里这个prototype就叫做:原型

而每个被new出来的对象都能获取到自己的原型,也就是__proto__,我们接着上面写:

console.log(car1.__proto__ == Car.prototype);
//true

能看出来car1获取到的原型和Car的原型是一个东西,所以打印出来了true。

每个原型都会有个属性,叫做constructor(构造函数),通过构造函数能获取到最原始的函数,就是在开始的function Car()

console.log(Car == Car.prototype.constructor);
//true

那么原型链就是js中的对象、构造函数、实例互相串联起来的链条,这一连串就叫做原型链,而原型链的最上方,就是万物皆空:null

猜你喜欢

转载自blog.csdn.net/FishWooden/article/details/129041870