JS原型对象

1.1 理解原型对象

创建每个函数时，每个函数都会自动添加一个属性：prototype，一般我们称此属性为原型，因为它指向的是一个对象，所以称为原型对象。我们拿个例子来说明一下：

//创建一个构造函数
function Person(num){
	this.num = num;		//属性
};
console.dir(Person); //得到函数的结构

在chrom中运行的结果：

其中prototype就是原型对象，除了原型对象和自己定义函数的属性，为什么会多出这么多属性呢？是因为继承了 Object()对象的中的属性，具体可以百度了解下继承。

实例对象中包含 __proto__属性比较特殊，此属性只有在Firefox、Safari、Chrome、Edge支持，IE浏览器(IE10以下)都不支持的，它指向的是构造函数的原型对象，而不是构造函数。

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

function Person(num){
	this.num = num;		//属性
};
console.log(Person.prototype.constructor); 
//得到函数代码
//ƒ Person(num){
//    this.num = num;
//}

当访问对象属性时或者方法时，首先，解析器会搜索实例对象中是否有该属性或方法，如果有，就直接调用实例中的属性或方法，如果没有，那么解析器会通过实例对象中__proto__属性找到构造函数的原型对象，然后搜索原型对象是否有该属性或者方法

function Person(){
	name:"卡卡西";
}
Person.prototype.name = "佐助"; //为原型添加一个属性
Person.prototype.sayHi = function() { //为原型添加一个方法
	console.log("hello world");
};
var per = new Person(); // 创建一个实例对象 per
console.log(per.name); //"卡卡西"  解析器搜索实例对象，有该属性直接访问
per.sayHi(); //"hello world" 解析器在实例对象中搜索不到方法，则在构造函数原型中搜索

===============================================================================
hasOwnProperty(attri)方法可以检测属性是存在实例对象中，还是存在于原型中
attri:属性名称
返回值：布尔类型   只在给定的属性存在实例中则返回true。

function Person(){}
Person.prototype.name = "佐助"; //在原型中添加一个属性
var per1 = new Person();
console.log(per1.hasOwnProperty("name")); //false 属性不在实例中

per1.name = "卡卡西"; //在实例对象中添加name属性
console.log(per1.name); //卡卡西
console.log(per1.hasOwnProperty("name")); //true

==============================================================================
in操作符会在通过对象能够访问给定属性时返回true，无论属性存在于实例对象还是原型对象中。

function Person(){}
Person.prototype.name = "佐助"; //为原型添加一个属性
var per1 = new Person();
console.log("name" in per1); //true
per1.name = "卡卡西"; //在实例对象中添加name属性
console.log("name" in per1); //true

===============================================================================
获取对象的属性常用的方法：
1、Object.keys();这个方法接受一个对象作为参数，返回一个包含所有可枚举属性的字符串数组
function Person(){}
Person.prototype.name = "佐助"; 
Person.prototype.age = 20;
var keys = Object.keys(Person.prototype); //获取实例对象则不需要prototype
console.log(keys);   //"name,age"


2、Object.getOwnPropertyNames();同样传入一个对象参数，返回包含所有属性的字符串数组
function Person(){}
Person.prototype.name = "佐助"; 
Person.prototype.age = 20;
var keys = Object.keys(Person.prototype); //获取实例对象则不需要prototype
console.log(keys);   //"constructor,name,age" 

1.2 原型作用

数据共享,节省内存空间

本身在构造函数中定义的属性和方法,当实例化对象的时候,实例对象中的属性和方法都是在自己的空间中存在的，如果是多个对象，这些属性和方法都会在单独的空间中存在,浪费内存空间，所以，为了数据共享,把想要节省空间的属性或者方法写在原型对象中，达到了数据共享，实现了节点内存空间

原型的写法:

构造函数.prototype.属性=值
构造函数.prototype.方法=值

function Person(name){
 this.name=name;
}
Person.prototype.sex="男";
Person.prototype.sayHi = function(){
	console.log("hello world!");
}
var per=new Person("小明");
conole.log(per1.sex);
per.sayHi();

简单的原型的写法：

构造函数.prototype={};
//如果这这种写法,要把构造器加上

function Person(name){
 this.name=name;
}
Person.prototype = {
	sex:"男",
	sayHi:function(){
		console.log("hello world!");
	},
	constructor:Person		//指向构造函数
};
var per=new Person("小明");
console.log(per.constructor);
per.sayHi();

通过原型为内置对象添加原型的属性或者方法:

String.prototype.方法=匿名函数;

原因:系统的内置对象的属性和方法可能不满足现在需求,所以,可以通过原型的方式加入属性或者方法,为了方便开发，为内置对象的原型中添加属性和方法,那么这个内置对象的实例对象就可以直接使用了

String.prototype.sayHi = function(){
	console.log("hello world!");
}//为内置函数添加自定义方法

var str="";
str.sayHi();  	//实例对象可以直接调用原型中的属性或者方法
//凡是string的实例对象都可以调用刚刚加入的方法