在JavaScript中,所有的东西都是对象,但是JavaScript中的面向对象并不是面向类,而是面向原型的,这是与C++、Java等面向对象语言的区别,比较容易混淆,因此把我自己学习的过程记录下来。
首先说,原型链有什么用?在Java中,继承都是基于类的,在JavaScript中继承都是基于原型链的。也就是说在JavaScript中,原型链是实现继承的基础,想要掌握好JavaScript中的面向对象编程,必须对原型链有一定的了解。
要理解原型链,必须先了解两个对象,一个是 prototype ,另一个是 __proto__ 。当前只需要记住名字,下面会仔细说明。
首先是 prototype : prototype ,或者叫原型对象,是函数特有的一个属性,其类型是 Object ,因此也常常被称作函数的原型对象。虽然每个函数都拥有自己的原型对象,但只有用作构造函数时,这个属性才会发挥作用,关于构造函数的知识这里不说。原型对象其实很简单,他就是一个普通的 Object ,当其作为构造函数时默认有一个 constructor 。
1 // 举个简单的例子2 function fn() { } 3 4 console.log(fn.prototype); // {}
我们可以给原型对象添加一些方法或属性,就可以被其子类继承:
1 // 后面会讲怎么继承 2 function fn() { } 3 4 // 添加一个方法 5 fn.prototype.sayHello = function() { 6 alert('hello'); 7 }; 8 9 // 添加一个属性10 fn.prototype.name = 'my_fn';
上面就完成了对原型对象的介绍,接下来是 __proto__ ,这是一个所有对象都拥有的属性。其实 __proto__ 与原型对象密不可分,因为一个对象的 __proto__ 就是指向其构造函数的原型对象。需要注意的是 __proto__ 并不是JavaScript的规范,只是大多数浏览器都实现了,从ECMAScript 6开始,应该用Object.getPrototypeOf()和Object.setPrototypeOf()来访问这个属性。看一个例子:
1 function fn() { } 2 3 var f = new fn(); 4 console.log(f.__proto__ === fn.prototype); // true
从上面的代码,应该就可以明白这二者的关系了,如果能理解这一点,接下来就可以开始分析继承的实现原理了。
开头说过,继承是基于原型链实现的,那么什么是原型链呢?首先我们看几个例子:

