1.构造函数继承
function animal() {
this.type = "动物"
}
function Cat(name, price) {
animal.call(this, arguments)/*改变this指向*/
this.name = name;
this.price = price;
}
var cat1 = new Cat('tom', '$8888')
console.log('输出继承自构造函数animal的属性type值', cat1.type)
2. 原型继承
//prototype继承
function Person() {
this.type = "人类"
}
function Man(name, age) {
this.name = name;
this.age = age;
}
//一定要注意顺序问题，就是继承一定要在创建实例之前，这样才能继承到其相应的属性
//错误写法
// var per1 = new Man('ak', 21)
// per1.prototype = new Person();
// per1.prototype.constructor = Man;
// console.log(per1.type)
//正确写法
Man.prototype = new Person();
Man.prototype.constructor = Man;
var per1 = new Man('ak', 21);
console.log(per1.type)
分析：
-
Man.prototype = new Person();的作用时将Man原型对象指向了Person的实例 -
Man.prototype.constructor = Man;
该行代码的作用：
1.由于每一个对象的原型prototype都有一个默认的constructor属性，该属性指向其构造函数；由于当我执行了原型继承时，即Man.prototype = new Person();，那么构造函数Man的原型便执行了Person
2.从事便需要注意，Man的原型指向了Person，那么之后创建的Man实例的prototype必然也是指向Person的，这样便引起了原型继承的错乱关系，所以我们需要手动的将原型继承手动改回来，改回其原本自身，即Man
3.非构造函数实现继承
3.0 引入问题：
说明：
比如，现在有一个对象，叫做"中国人"
var Chinese = {
nation: '中国',
arr: [1, 2, 3]
}
还有一个对象，叫做"医生"。
var Doctor = {
career: '医生'
}
请问怎样才能让"医生"去继承"中国人"，也就是说，我怎样才能生成一个"中国医生"的对象？
这里要注意，这两个对象都是普通对象，不是构造函数，无法使用构造函数方法实现"继承"。
3.1 浅拷贝实现继承
- 思路：把父对象的属性，全部拷贝给子对象，也能实现继承
浅拷贝继承函数如下：
function extendCopy(f, c) {
var c = {
}
for (let i in f) {
c[i] = f[i]
}
return c;
}
- 使用
var doctor3 = extendCopy(Chinese);
console.log(doctor3.nation) //中国
console.log(doctor3.arr) //[1,2,3]
使用浅拷贝的缺点：
- 子已经继承了父的所有属性，但是当子继承了父的引用类型的属性时，
- 实质上获取到的是一个内存地址，因此会存在父对象被子对象撰改的心现象
- extendCopy()只是拷贝基本类型的数据，我们把这种拷贝叫做"浅拷贝"
3.2 深拷贝实现继承
说明：所谓深拷贝，就是能实现真正意义上对数据和对象的拷贝。
思路：使用递归调用
深拷贝函数如下：
//实现深拷贝
function deepCopy(f, c) {
//
var c = c || {
}
//将f拷贝至c
for (let i in f) {
//1.首先判断是否为引用数据类型
if (typeof f[i] === 'object') {
//2。 数组：[],对象:{}）
c[i] = (f[i].constructor === Array) ? [] : {
};
//递归调用(即判断引用数据类型的子属性是否仍然存在引用数据类型)
deepCopy(f[i], c[i])
} else {
//当不是引用数据类型时，直接赋值拷贝
c[i] = f[i]
}
}
return c;
}
使用：
var doctor2 = deepCopy(Chinese);
doctor2.arr.push('5')
console.log('doctor2----', doctor2.arr);
console.log('Chinese----', Chinese.arr);
输出结果：
说明：
- 这时，父对象就不会受到影响了。