一 原型：
定义：原型是function对像的一个属性，他定义了构造函数制造出的对象的公共祖先；
1.通过该构造函数产生的对象，可以继承该原型的属性和方法。
原型也是对像。prototype；
Person.prototype.name = 'jams';
function Person(){
}
var person = new Person();
2.当打印：console.log（person.name）时，会先从函数中找看下有没有这个属性值，如果没有就去原型prototype中找；
因此，这时候打印出来的值为：jams
-
prototype 是函数对象默认的属性，可以增删改查；
-
利用原型特点和概念，可以提取共有属性；
3.对象如何查看原型——>隐式属性：proto
proto 中存放的就是构造函数的原型
相当于：在函数中隐藏了一段代码：
var this = {
__proto__: Person.prototype
}
举个例子：
var obj = { name: 'a'}
var obj1 = obj;
obj = {name : 'b'}
console.log(obj1.name);// 输出的值为 a
console.log(obj.name);// 输出的值为 b
对比：
var obj = { name: 'a'}
var obj1 = obj;
obj.name ='b'
console.log(obj1.name);// 输出的值为 b
console.log(obj.name);// 输出的值为 b
原因： 当你修改obj.name 时，修改的是原型中的值，当你重新附值给obj时（obj={name:'b'}）,相当于重新定义了obj这个变量；
换个理解方式为，obj.name 是一个指针，而obj 是一个变量；
4.对象如何查看对象的构造函数：constructor；
constructor 是默认自带的一个属性，他的值指向原函数；
二 原型链：
1.如何构成原型链： 一级一级往上找；
举个例子：
Grand.prototype.lastName = 'a';
function Grand(){
}
var grand = new Grand();
Father.prototype = grand;
function Father() {
this.name = ' b ';
}
var father = new Father();
Son.prototype = father;
function Son(){
this.hobbit = 'smoke';
}
var son = new Son();
console.log( son.name ); // b
console.log(son.lastName); // a
2.原型链上属性的增删改查：跟原型上的增删改查基本一致，其中删除：delete 只能通过原型prototype 才能删除原型的值；
Person.prototype = {
name = 'a',
sayName : function(){
console.log(this.name);
}
}
function Person(){
this.name = 'b';
}
var person = new Person();
sayName 里面的this指向是，谁调用的这个方法，this指向谁；
-
所以最终结果person.sayName() 的值为b
-
而Person.prototype.sayName() 的值为a
3.绝大多数对象的最终都会继承自Object.prototype
但不是所有的对象都可以继承，特例：Object.creat()原型；
例如：object.creat（null） ，该对象没有prototype原型；
4.原型链的重写：
例如常见的如下原型链就是经常被重写试用的，当然自己定义的原型同样也是可以被重写
Object.prototype.toString
Number.prototype.toString
Array.prototype.toString
Boolean.prototype.toString
String.prototype.toString
三 call、apply
call、apply的作用：可以借助别人的函数实现自己的功能
call 可以该表this指向
例如：
function Person(name,age){
//this == obj；
this.name = name;
this.age = age;
}
var person = new Person( 'a' ,100);
var obj = {}
Person.call(obj, 'b' ,300);
这句话的意思就是调用Person的方法，然后将相关值附值给obj，使得obj有相关参数属性值；
执行结果：obj
{name: "b", age: 300}
//这样的好处，借用Person的方法来封装了obj；
例如：
function Person(name,age,sex){
this.name = name;
this.age = age;
this.sex = sex;
}
function otherInformation(tel,grade){
this.tel = tel;
this.grade = grade;
}
function Student(name,age,sex,tel,grade) {
Person.call(this,name,age,sex);
//欢迎加入全栈开发交流圈一起学习交流：864305860
otherInformation.call(this,tel,grade)
} //面向1-3年前端人员
var student = new Student('asd',123,'male',129,2018) ;
//帮助突破技术瓶颈，提升思维能力
// 输出结果：
Student {name: "asd", age: 123, sex: "male", tel: 129, grade: 2018}
call与apply的区别：后面传的参数形式(或者传参列表)不同；
apply 只能传两个参数，一个是this，另一个是数组，例如：
Person.apply(this,[name,age,sex]);
结语
感谢您的观看，如有不足之处，欢迎批评指正。
本次给大家推荐一个免费的学习群，里面概括移动应用网站开发，css，html，webpack，vue node angular以及面试资源等。
对web开发技术感兴趣的同学，欢迎加入Q群：864305860，不管你是小白还是大牛我都欢迎，还有大牛整理的一套高效率学习路线和教程与您免费分享，同时每天更新视频资料。
最后，祝大家早日学有所成，拿到满意offer，快速升职加薪，走上人生巅峰。
网友评论