js 之 prototype原型 理解

原型在js中，是一个相对而言较难理解易混淆的概念，这里特对原型做了一个小总结，参照JS 高三的一些总结提取。

1、在js中，创建一个函数的同时，就会根据一组特定规则为该函数创建一个 prototype 属性，这个属性是一个指针，指向函数的原型对象。

     在默认情况下，所有原型对象都会自动获得一个 constructor (构造函数) 属性，这个属性是一个指向 prototype 属性所在函数的指针。

	var Person = function(name,sex,age){
		this.name = name;
	}
	Person.prototype = {
		showName : function(){
			console.log('name : ', this.name)
		}
	}
	var personA = new Person();
	var personB = new Person();

Person.prototype.constructor 指向 构造函数本身，即Person;

personA、personB是构造函数实例化出来的对象，该实例内部包含一个_proto_属性，指向构造函数的原型对象。即：personA、personB的_proto_指向 Person.prototype对象 。

2、在执行某个对象的某个属性(方法)时，首先从对象实例本身开始，查找该属性方法，有则调用；如果没有找到，则去其原型对象上查找该属性方法。

	var Person = function(){
    	    this.name = "box1"
	}
	Person.prototype = {
	    name : "box2",
	    sex : "girl"
	}
	var personX = new Person();
	console.log(personX.name);  // box1
	console.log(personX.sex);   // girl

3、当给对象实例添加某个属性时，这个属性就会屏蔽原型对象中保存的同名属性。添加的这个属性只会阻止我们访问原型中的同名属性，但不会去修改原型中的这个同名属性。

不过使用delete操作符，则可以完全删除实例属性，从而让我们能重新访问原型中的属性。

	var Person = function(){}
	Person.prototype = {
	    name : "Allen",
	}

	var person1 = new Person();
	var person2 = new Person();

	person1.name = 'John';
	console.log(person1.name)  // John ,来自实例
	console.log(person2.name)  // Allen,来自原型

	delete person1.name;
	console.log(person1.name)  // Allen,来自原型

4、hasOwnProperty()：检测 一个属性 是存在于 实例中 还是 原型中。只有属性在对象实例中，才会返回ture。 即hasOwnProperty()仅当 属性存在于对象实例中时，才返回ture。

因此，通过调用 hasOwnProperty() 方法，就能分辨出 访问的是 实例属性 还是 原型属性。

	var Person = function(name){};

	Person.prototype = {
		name : 1,
		showName : function(){
			console.log('name : ', this.name)
		}
	}

	// hasOwnProperty() 判断某个属性是否在 实例属性上
	var personA = new Person('John');
	console.log(personA.hasOwnProperty("name"));  	    // fasle
	personA.name = 2;  				    // 实例属性上 （等同于直接在Person构造函数里添加属性）
	console.log(personA.hasOwnProperty("name"));	    // ture
	console.log(personA.hasOwnProperty("showName"));    // false