- 原型链下端的属性会屏蔽原型链上端的属性(最下端为实例对象)
- 构造函数创建的原型对象,因为Foo.prototype.constructor === Foo(原型对象的构造器是构造函数Foo)
- 构造函数首字母大写是JavaScript世界的惯例!标识它是一个“类”
- new调用普通函数就是变成了构造函数调用
- 实例对象不是由构造函数构造的,实例的constructor有时候不等于构造函数,比如重写原型对象,所以constroctor不表示由谁构造,避免使用实例对象的constructor属性。
- 原型的机制就是指对象中的一个内部链接引用另一个对象,其本质就是对象之间的关联关系。
创建关联
es6之前需要抛弃原型对象,例如
Bar.prototype = Object.create(Foo.prototype)
es6语法不用抛弃,例如Object.setPrototypeOf(Bar.prototype,Foo.prototype)
instance = Object.create(obj)
- 找实例的祖先
- a instanceof Foo a的原型链上是否有Foo函数的原型(对象和函数的关系)
- Foo.prototype.isPrototypeOf(a) a的原型链上是否出现过Foo的原型(对象和对象的关系)
- 获取原型 Object.getPrototypeOf(a) === Foo.prototype
原型prototype继承(原型链继承)
function Animal(name,arr) {
this.name = name;
this.arr = arr;
this.sleep = function () {
console.log(this.name + '正在睡觉')
}
}
Animal.prototype.eat = function (food) {
console.log(this.name + '正在吃'+food)
}
function Cat() {
}
// 关键代码
Cat.prototype = new Animal()
// 关键代码
Cat.prototype.constructor = Cat
Cat.prototype.age= 2
var cat1 = new Cat()
var cat2 = new Cat()
cat1.arr.push(1)
// 优缺点
// 子类新增原型属性和方法,必须在new Animal()之后执行,无法实现多继承
// 创建子类实例时无法向超类传递参数,new Cat
// 构造函数中引用类型的属性arr,一个实例修改该属性,其他实例都会使用修改后的值(引用类型值的共享问题)
- 直接继承proptotype
// 关键代码
Cat.prototype = Animal.prototype
// 关键代码
Cat.prototype.constructor = Cat
// 会把Animal的原型对象的constructor改了!
- 构造函数继承
function Cat(name, age) {
// 关键代码
Animal.call(this, name)
// 关键代码
this.age = age
}
var car1 = new Cat('小黑', 2)
// 优缺点
// 可以在子类构造函数中向超类函数传递参数
// 子类可以实现多继承,不能继承原型链,方法函数都在构造函数中定义,无法复用
- 原型链组合构造函数继承
function Cat(name, age) {
// 关键代码
Animal.call(this, name)
this.age = age
}
// 关键代码
Cat.prototype = new Animal()
Cat.prototype.constructor = Cat
var car1 = new Cat('小黑', 2)
// 调用了两次超类构造函数
// 可以使用create
Cat.prototype = Object.create(Animal.prototype);
- 原型式继承,使用空对象作为中介
借助原型可以基于已有的对象创建新对象
es5规范了该方法,即Object.create()
// o为超类原型
function obj(o) {
function F() {}
F.prototype = o
let f = new F()
return f
}
或者
function extend(Child, Parent) {
var F = function(){};
F.prototype = Parent.prototype;
Child.prototype = new F();
Child.prototype.constructor = Child;
}
- 实例继承
function Cat(name, age) {
var instance = new Animal()
instance.age = age
return instance
}
var car1 = new Cat('小黑', 2)
var cat2 = Cat('小黑', 2)
// 优缺点
// 不限制调用方式,不能实现多继承
- 拷贝继承
function extend2(Child, Parent) {
var p = Parent.prototype;
var c = Child.prototype;
for (var i in p) {
c[i] = p[i];
}
c.uber = p;
}
- 寄生式继承
// o为原型对象
function createObj(o) {
let clone = Object.create(o)
clone.sayHi = function () {
console.log('hi');
}
return clone
}
o1 = createObj(o)
// 添加的方法不能被复用
- 寄生组合构造函数继承
// 通过create创建sub的prototype对象
function Super(name) {
this.name = name
this.color = ['red', 'blue']
}
Super.prototype.sayHi = function () {
console.log('hi');
}
function Sub(name, age) {
Super.call(name)
this.age = age
}
Sub.prototype = Object.create(Super.prototype)
Sub.prototype.constructor = sub
Sub.prototype.eat = function () {
console.log('eat');
}
let o1 = new Sub('jack', 18)
// 只调用一次超类构造函数,