本文共 1527 字，大约阅读时间需要 5 分钟。
一、引入：为多个对象统一添加属性
首先看下面一段程序
| function Person(perName,perAge){ this.perName = perName; this.perAge = perAge; this.toString = function(){ return "PersonName="+this.perName+" PersonAge="+this.perAge; }; }
var per01 = new Person("Tom", 20); var per02 = new Person("Jerry", 25);
console.log(per01.toString()); console.log(per02.toString()); |
| 执行结果： |
| PersonName=Tom PersonAge=20 PersonName=Jerry PersonAge=25 |
在这段程序中声明了一个构造器函数Person，使用这个构造器函数创建了两个对象，并在控制台中进行了显示。
现在如果我们需要给每个Person对象都添加一个gender属性，最直接的做法可能是这样：
| function Person(perName,perAge,gender){ this.perName = perName; this.perAge = perAge; this.gender = gender; this.toString = function(){ return "PersonName="+this.perName+" PersonAge="+this.perAge+" PersonGender="+this.gender; }; }
var per01 = new Person("Bob", 20, "male"); var per02 = new Person("Kate", 25, "female");
console.log(per01.toString()); console.log(per02.toString()); |
| 执行结果： |
| PersonName=Bob PersonAge=20 PersonGender=male PersonName=Kate PersonAge=25 PersonGender=female |
可是这样做有一个问题：如果Person这个构造器函数不是我们创建的，我们也不能修改它，还能否添加属性呢？
当然可以，使用JavaScript的原型机制就可以做到。
二、原型
1.函数原型
在JavaScript中，函数不仅仅是一个可以重用的代码块，而且还可以作为一种数据使用。在堆空间中为函数分配了它的存储空间，函数名或函数的其他形式的引用保存了这个存储空间的引用地址。所以JavaScript中的函数是一种引用数据类型，这就是为什么我们说JavaScript中的函数也是对象。
那么函数这样的对象有很多特殊的性质，原型就是其中之一。每一个函数对象都包含一个属性：prototype。当我们声明一个函数时，函数对象就创建好了。而函数对象创建的同时，系统还会同时创建一个对象，并让函数对象的prototype属性指向它。
比如说，当我们执行下面代码时：
| function Person(perName,perAge){ //… }
|
就声明了一个函数，系统会将这个函数对象创建出来。内存中应该是这样的情况：
但是更深层次挖掘一下，我还需要知道创建函数对象的同时，还会创建一个“原型对象”，由函数对象的prototype属性指向这个原型对象。
本教程由尚硅谷教育大数据研究院出品，如需转载请注明来源。