原型
- 原型是
function
对象的一个属性,它定义了构造函数制造出的对象的公共祖先。通过该构造函数产生的对象,可以继承该原型的属性和方法。原型也是对象。
// 增加原型属性/修改原型的值
Person.prototype.lastName = 'Sun';
// 下面这种写法把整个原型都替换了,换了一个新的对象
Person.prototype = {
lastName: 'Sun',
age: 18
}
function Person (name) {
/**
* new的时候会发生
* var this = { __proto__: Person.prototype}
**/
this.name = name;
}
var person = new Person('luoluo');
Constructor 构造器
在原型内部,自带一个constructor属性,返回这个构造对象的构造函数
// constructor是可以改变的
function Car() {}
function Person() {}
Car.prototype = {
constructor: Person
}
原型链
原型链的构成:
Grand.prototype.lastName = 'Sun';
function Grand() {
}
var grand = new Grand();
Father.prototype = grand;
function Father () {
this.name = 'Lee';
}
var father = new Father();
Son.prototype = father;
function Son () {
this.hobbit = 'drink';
}
var son = new Son();
Object.create()
用法: var obj = Object.create(原型);
如果括号中不填原型,也可以填 null
,只不过生成的东西没有原型。
var obj = {
name = 'Sun',
age = 24
};
var obj1 = Object.create(obj);
obj1.name // Sun
Person.prototype.name = 'Sun';
function Person() {
}
var person = Object.create(Person.prototype);
call / apply
- 作用: 改变 this指向
- 区别: 后面传的参数形式不同
call
-
call
需要把实参按照形参的个数传进去 - 一个函数的运行,比如
test()
,实际上是test.call()
。下面例子中,Person.call(obj, xxx, xxx)
实际上是将Person里面所有的this,变成obj。
function Person(name, age) {
this.name = name;
this.age = age;
}
var person = new Person('Sun', 24);
var obj = {};
Person.call(obj, 'Lee', 27);
举个栗子: Student 完美涵盖了 Person的功能。不需要重新写一遍,这个时候就用的到 call 啦。
function Person(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
}
function Student(name, age, sex, tel, grade) {
// this.name = name;
// this.age = age;
// this.sex = sex;
Person.call(this , name, age, sex);
this.tel = tel;
this.grade = grade;
}
var student = new Student('Sun', 20, 'female', 111, 2017);
apply
-
apply
只能传一个实参,而且必须是数组形式;需要传一个 arguments
function Person(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
}
function Student(name, age, sex, tel, grade) {
Person.call(this , [name, age, sex]);
this.tel = tel;
this.grade = grade;
}
var student = new Student('Sun', 20, 'female', 111, 2017);
- 在数组的指定位置插入一个数组
例子,在数组的第1位后面插入 4, 5, 6
arr1 = [1, 2, 3];
arr1.splice.apply(arr1, [1, 0, 4, 5, 6]);
继承
- 公有原型
下面例子中的Target.prototype = Origin.prototype;
代码实现的。
Father.prototype.lastName = 'Sun';
function Father() {}
function Son() {}
function inherit(Target, Origin) {
Target.prototype = Origin.prototype;
}
inherit(Son, Father);
- 圣杯模式
实现个体化的继承,即 Son 继承 Father的原型,但是Son往自己身上加属性方法,不影响 Father。
Father.prototype.lastName = 'Sun';
function Father() {}
function Son() {}
function F() {}
F.prototype = Father.prototype;
Son.prototype = new F();
数组去重,要求在原型链上编程
Array.prototype.unique = function {
}
笔记整理:https://ke.qq.com/course/231577 给小可爱们安利一波js课程。