JS继承和原型链,ES6新继承(class,extends,super)

本文探讨JavaScript的继承机制,包括封装、继承和多态的概念。深入讲解了JS中的继承方式,如混入式、替换原型式和混合式继承,并解析了原型链的工作原理。此外,还介绍了ES6引入的`class`、`extends`和`super`关键字,以及它们在类继承中的应用。
摘要由CSDN通过智能技术生成

特征

  1. 封装:把需要复用的代码 放入对象的方法中

  2. 继承:一个对象拥有另一个对象的所有成员(JS重点)

  3. 多态:一个对象在不同情况下的多种状态

继承(JS)

子对象 继承 父对象所有的成员

js中常用的三种继承方式

假设有两个对象,一个是父亲对象,一个是儿子对象,父亲有房子属性(或其他属性),儿子通过继承的方式获得父亲的房子属性(或其他属性)。

1. 混入式继承

遍历父对象成员添加给子对象(forin),一般用于继承一个子对象,如果子对象一多,代码冗余(有几个继承就要写几次forin循环了)。

//父对象
let father = {
    house: {
        address: 'xxxxx小区',
        price: 'xxxx¥'
    }
}
//子对象
let son = {
    worker: '销售员' //本身的属性
}
/*
    混入试继承:遍历父对象成员添加给子对象
*/
for (let key in father) {
    son[key] = father[key];
}
console.log(son); //son中除了自己的属性(儿子的工作),还有了爸爸的房子(继承过来的)

2. 替换原型继承

将父对象作为子对象的原型(适用于多个继承),可以实现多个子对象继承,但是会覆盖子对象默认的原型

//父对象
let father = {
    house: {
        address: 'xxxxx小区',
        price: 'xxxx¥'
    }
}
//第二种方式:
//替换原型继承:将父对象作为子对象的原型
function Son(work) {
    this.work = work;
}
//子对象默认的原型
Son.prototype.hobby = function() {
    console.log('乒乓球');
}
//将父对象作为子对象的原型
Son.prototype = father; //这里就会把Son中的默认原型hobby给替换成了father中的属性
​
let son1 = new Son('销售员');
let son2 = new Son('程序员');
console.log(son1.house, son2.house);

3.混合式继承

混入式 + 替换原型

*遍历父对象所有成员,添加给对象的原型

//第三种方式 
//混合式继承  :  混入式+替换原型
function Son(work) {
    this.work = work;
}
//子对象默认的原型
Son.prototype.hobby = function() {
    console.log('乒乓球');
}
​
//遍历父对象所有成员,添加给子对象原型
for (let key in father) {
    Son.prototype[key] = father[key];
}
​
let son1 = new Son('销售员');
let son2 = new Son('程序员');
console.log(son1.hobby(), son2.house);

原型链

原型链

每一个对象都有自己的原型,而原型也是对象,也会有自己的原型(链),以此类推形成一个链式结构---原型链。

原型

  • 所有引用类型都有一个proto(隐式原型)属性,属性值是一个普通的对象

  • 所有函数都有一个prototype(原型)属性,属性值是一个普通的对象

  • 所有引用类型的

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值