prototype.md

在 JavaScript 中，函数是一个包含属性和方法的 Function 类型的对象。而原型（Prototype）就是 Function 类型对象的一个属性。

在函数定义时就包含了 prototype 属性，它的初始值是一个空对象。在 JavaScript 中并没有定义函数的原型类型，所以原型可以是任何类型。

原型是用于保存对象的共享属性和方法的，原型的属性和方法并不会影响函数本身的属性和方法。

```javascript
function foo(a,b){
	return a + b;
}
console.log( typeof foo.prototype );// object
```

## 获取原型

通过如下两种方式可以获取对象的原型，从而设置共享的属性和方法:

- 通过构造函数的 prototype 属性。

```javascript
function Person() {
	console.log('Person instantiated');
}
console.log( Person.prototype );
```

- 通过 Object 对象的 getPrototypeOf( obj ) 方法。

```javascript
function Person() {
	console.log('Person instantiated');
}
console.log( Object.getPrototypeOf( Person ) );
```

## 原型的属性和方法

通过如下两种方式可以设置原型的属性和方法:

- 原型的属性和方法单独进行定义。

```javascript
构造函数.prototype.属性名 = 属性值;

构造函数.prototype.方法名 = function(){}
```

- 直接为原型定义一个新对象。

```javascript
构造函数.prototype = {
	属性名 : 属性值,
	方法名 : function(){}
}
```

## 自有属性与原型属性

- 自有属性: 通过对象的引用添加的属性。其它对象可能无此属性；即使有，也是彼此独立的属性。
- 原型属性: 从原型对象中继承来的属性，一旦原型对象中属性值改变，所有继承自该原型的对象属性均改变。

```javascript
function Emp( ename, salary ){
	this.ename = ename;
	this.salary = salary;
}
Emp.prototype = { city : "北京市", dept : "研发部" }
var emp1 = new Emp("Mary",3800);
var emp2 = new Emp("Tom",3000);
```

上述代码的内存结构图如下:

![](19.png)

## 检测自有或原型属性

- 使用 hasOwnPrototype() 方法检测对象是否具有指定的自有属性:

```javascript
function Hero(){}
var hero = new Hero();

console.log( hero.hasOwnPrototype("name") );
```

- 使用 in 关键字检测对象及其原型链中是否具有指定属性:

```javascript
function Hero(){}
var hero = new Hero();

console.log( "name" in hero );
```

## 扩展属性或方法

通过原型可以为指定构造函数或对象扩展其属性或方法，如下代码示例:

```javascript
functon Hero(){}

Hero.prototype = {
	name : "Mary",
	salary : 3800
}

var hero = new Hero();
console.log( hero.name );// Mary
```

## 重写原型属性

通过构造函数或对象的自有属性可以重写原型的属性，如下代码示例:

```javascript
functon Hero(){}

Hero.prototype = {
	name : "Mary",
	salary : 3800
}

var hero = new Hero();
hero.name = "Tom";

console.log( hero.name );// Tom
```

## 删除属性

通过 delete 关键字可以删除对象的属性，如果该对象既具有原型属性又具有自有属性的话，先删除自有属性，再删除原型属性。如下代码示例:

```javascript
functon Hero(){}
Hero.prototype = { name : "Mary", salary : 3800 }
var hero = new Hero();
hero.name = "Tom";

delete hero.name;// 删除 Tom
console.log( hero.name );// Mary
delete hero.name;// 删除 Mary
console.log( hero.name );// undefined
```

## isPrototypeOf() 方法

每个对象中都会具有一个 isPrototypeOf() 方法，该方法用来判断一个对象是否是另一个对象的原型。

```javascript
var monkey = {}

function Human(){}
Human.prototype = monkey;

var man = new Human();

monkey.isPrototypeOf( man );// true
```

## `__proto__` 属性

```javascript
functon Hero(){}

Hero.prototype = {
	name : "Mary",
	salary : 3800
}

var hero = new Hero();
console.log( hero.name );// Mary
```

上述代码说明 hero 对象存在一个指向构造函数 Hero 的原型，这个链接被叫做 `__proto__` 属性。

> **值得注意的是:** `__proto__` 属性与 prototype 属性并不等价。
> 
> - `__proto__` 属性是指定对象的属性。
> - prototype 属性是指定构造函数的属性。
> 
> 再有就是，`__proto__` 属性只能在学习或调试的时候使用。

## 扩展内建对象

JavaScript 中的内置对象有些也具有 prototype 属性，利用内置对象的 prototype 属性可以为内置对象扩展属性或方法。

通过原型扩展内置对象的属性和方法非常灵活，根据个性化要求制定 JavaScript 语言的具体内容。

一般建议慎用这种方式，如果 JavaScript 的版本更新时可能会提供个性化的属性或方法，导致冲突。

如下代码示例，利用 Array 对象的 prototype 属性扩展了 inArray() 方法。

```javascript
Array.prototype.inArray = function(color){
	for(var i = 0, len = this.length; i < len; i++){
		if(this[i] === color){
			return true;
		}
	}
	return false;
}
var a = ["red", "green", "blue"];

alert(a.inArray("red")); //true
alert(a.inArray("yellow")); //false
```