构造函数和原型
概述
在典型的OOP的语言中 （如java），都存在类的概念 ，类就是对象的模板 ，但是在ES6（2015年发布的ECMAscript6.0）之前 JS中并没有引入类的概念
在这之前 对象不是基于类创建的 而是用一种被称为 构造函数 的特殊函数来定义对象和他们的特征
构造函数基本介绍：
构造函数
案例
function Zwjs(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
this.jn = function () {
console.log("睡觉");
};
}
let x = new Zwjs('shaco',18,'男');
console.log(x);
x.jn()
成员
javascr的构造函数中可以添加一些成员 可以在构造函数本身上添加 也可以在构造函数内部的this上进行添加 通过这两个方法添加的成员 我们分别称之为 静态成员 和 实例成员
静态成员： 在构造函数本身添加的成员称之为静态成员，只能由构造函数本身来访问
实例成员：在构造函数内部创建的对象成员称为实例成员 ， 只能由实例化的对象来访问
function Zwjs(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
this.jn = function () {
console.log("睡觉");
};
}
let x = new Zwjs('shaco',18,'男');
// 实例成员就是构造函数内部通过this添加的成员
// 如上面的 name age sex jn就是实例成员
// 实例成员只能通过实例化的对象来访问
// 如
console.log(x.name);
// 我们不可以通过构造函数来访问实例成员
//如
// console.log(zwjs.name); 报错
// 静态成员 在构造函数本身上添加的成员
Zwjs.lol = '白银';
// 因为js是动态语言 我们可以动态添加语言 所以我们可以添加属性
// 这类添加的对象就是静态成员
// 静态成员只能通过构造函数来访问
console.log(Zwjs.lol);
// 不可以通过实例化的对象来访问
// console.log(x.lol0);//undefined
构造函数的问题
构造函数虽然很好用 但还是有问题的存在
我们使用构造函数的时候 会开辟一个新的内存空间
但是因为我们的对象中常常有函数作为方法使用 而函数是复杂数据类型 当我们多次使用构造函数的时候 都会开辟一个新的内存空间来存放同一个函数
案例如下 我们用构造函数创建两个对象
function Zwjs(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
this.jn = function () {
console.log("睡觉");
};
}
let x = new Zwjs('shaco',18,'男');
let y = new Zwjs('yasuo', 18 ,'男');
console.log(x.jn===y.jn);
但是他们的方法不相等 因为复杂数据类型的 存储方式是将地址放在栈中 而实际的对象放在堆中 所以他们不相等
简单的说 构造函数大量使用 就会不停的开辟很多空间来存放同一个函数 造成内存浪费 对性能造成很大的影响
所以这时候我们可以用到原型对象来解决
原型对象 prototype
在js中 每一个构造函数都有一个prototype属性 指向另外一个对象
需要注意的是 prototype自己就是一个对象
而这个对象的所有方法和属性 都会被构造函数拥有
我们可以把公共的方法放到原型对象中
构造函数通过原型分配的函数是所有对象共享的
因此我们可以把一些不变的方法 直接定义到prototype对象上 这样所有对象的实例都可以共享这些方法
function Zwjs(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
}
// console.dir(Zwjs);
Zwjs.prototype.jn = function (){
console.log('恰饭');
}
let shaco =new Zwjs('shaco',18,'男');
let yasuo =new Zwjs('yasuo',19,'男');
shaco.jn();
yasuo.jn()
如上列代码 我们利用原型对象创建了jn这个方法
然后实例化俩个对象
并让他们使用这个方法 我们来看看结果如何
说明我们实现了方法的共享
一般情况下 我们的公共属性定义到构造函数里面
（如上面代码中的 name，age等属性）
公共的方法我们定义到原型对象身上
（如我们通过原型对象定义的jn方法）
对象原型__proto__
也可以写为[[Prototype]]
实例化对象都会有一个属性__proto__指向构造函数中的原型对象prototype，
之所以我们可以用构造函数prototype 原型对象的属性和方法 就是因为实例化对象有 proto 对象原型的存在
简单的说 实例化对象的__proto__(对象原型) 和构造函数的原型对象 prototype 是一样的
对象原型__proto__的意义就是给对象的查找机制提供一个方向 或者说是一条路线 但是对象原型是一个非标准的属性 所以在我们实际开发的过程中 不可以使用这个属性
它的作用只是从对象的内部指向原型对象 prototype
原型constructor 构造函数
对象原型prototype和原型对象__proto__中 都有一个属性constructor
我们称constructor为构造函数 因为它指回构造函数本身
我们打印他们的constructor属性 都是指向我们一开始的构造函数
作用
举个例子 当我们使用对象原型来存放多个我们的方法函数的时候，经常会以对象的方式来书写使结构更加清晰
function Zwjs(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
}
Zwjs.prototype = {
sleep: function () {
console.log('睡觉');
},
eat: function () {
console.log('恰饭');
}
}
然后我们再次打印 构造函数的的原型对象的constructor
发现他并没有指向我们的构造函数 而是指向了 一个对象
为了避免可能发生的错误 我们可以调用constructor属性 使原型对象指向我们原来的构造函数
原型链
因为每个对象都有自己的对象原型(prototype) 那么我们的原型对象（proto）的对象原型是什么呢
function Zwjs(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
}
console.log(Zwjs.prototype.__proto__);
结果如下 我们可以理解为内置对象
所以我们吧原型链升级
我们在打印内置对象的构造函数
console.log(Object.constructor);
得到一个构造函数
由此我们可以再次完事原型链
顺藤摸瓜 我们在试试内置对象的原型对象的对象原型是什么
console.log(Object.prototype.__proto__);
得到
由此 原型链完成
JavaScript的成员查找机制
当我们访问一个对象的属性或者方法的时候 首先先查找这个对象本身有没有这种属性或者方法
如果没有的话 旧查找他的对象原型（也就是实例化对象使用原型对象__proto__取对象原型prototype中查找）
如果还没有 就去查找内置对象的原型（内置对象的原型对象）
最后如果还没找到就返回underfind或者null
案例如下
我们注释x.sex
我们在注释Zwjs.prototype.sex =‘女’
最后我们注释掉 Object.prototype.sex = ‘人妖’;
原型对象的this指向
首先我们需要理解的是
在构造函数中 里面的this指向的是对象实例
我们创建一个变量x 但不赋值
然后加入方法中 使他等于this 于是我们实例化对象调用原型对象中的方法使
x 就等于this
然后分别打印
this的代表（得到构造函数 然后因为构造函数指向对象实例）
所以我们打印this是否等于实例对象 得到true
function Zwjs(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
}
let x ;
Zwjs.prototype.jn = function (){
console.log('恰饭');
x=this;
}
let shaco =new Zwjs('shaco',18,'男');
let yasuo =new Zwjs('yasuo',19,'男');
shaco.jn()
console.log(x);
console.log(x===shaco);