继承和深拷贝封装

继承和深拷贝封装

今日目标:

1.es5寄生组合式继承

2.es6类的继承

3.深拷贝函数封装

00-回顾

# 不同数据类型赋值时的区别:
`基本数据类型,赋的就是值,相互之间不再有任何影响`
`引用数据类型,赋的是地址,会造成数据共享的问题:其中一个改变了,另一个也会跟着改变`
`解决方案`: 浅拷贝和深拷贝

# 浅拷贝
`概念`:对于引用类型的第一层,拷贝的是值;对于以后的层级(引用类型嵌套),拷贝的依然是地址
`语法`1. Object.assign({}, obj) || 2. {...obj}
`使用场景`: 引用类型数据的层级只有一级的时候

# 深拷贝
`概念`: 无论引用类型数据的层级,拷贝的都是值
`语法`JSON.parse(JSON.stringify(obj))
`问题`JSON这个方式不支持undefined和函数; 会将正则变成空对象
`解决`: lodash库文件: 1. 导入lodash.js; 2. 使用_.cloneDeep(obj)

01-es5寄生组合式继承

# 属性的继承
`方法`: 在子构造函数内部通过call方法调用父构造函数:
`代码`function Son() {
    Father.call(this, 属性)
}
`原理`:子构造函数内部的this会指向s这个实例对象,通过在子构造函数内用call方法调用父构造函数,将父构造函数内部的this指向强制改变成了s这个实力对象,原本挂载到父构造函数身上的属性,自然就挂载到了s实例对象上了

# 方法的继承
`方法`:强制将子构造函数的原型对象的隐式原型指向父构造函数的原型对象
`代码`Son.prototype = Object.create(Father.prototype)
`原理`:强制将子构造函数的原型对象的隐式原型指向父构造函数的原型对象,通过原型链关系图,子构造函数的实例对象就可以使用父构造函数原型对象上的方法
`Object.create(obj)`: 拷贝一个新对象,新对象的隐式原型会指向源对象

# 手动将子构造函数的原型对象的构造器指回子构造函数本身
`代码`Son.prototype.constructor = Son

完整代码


function Father(chick, duck, sheep) {
    this.chick = chick
    this.duck = duck
    this.sheep = sheep
}

Father.prototype.farm = function () {
    console.log('种田');
}

function Son(chick, duck, sheep, pig) {
    // 注意:先继承再自有
    // 1. 属性的继承
    Father.call(this, chick, duck, sheep)
    // son自己的属性
    this.pig = pig
}

// 2. 方法的继承:
// 注意:Son.prototype.__proto__ === Father.prototype: 子构造函数的原型对象的隐式原型指向了父构造函数的原型对象


Son.prototype = Object.create(Father.prototype)

Son.prototype.code = function () {
    console.log('敲代码');
}

// 3. 手动将子构造函数的原型对象的构造器指回子构造函数本身
Son.prototype.constructor = Son

let s = new Son('鸡', '鸭', '羊', '猪')
s.farm();
s.code();
console.log(s);


// 构造器:指回构造函数本身
console.log(Son.prototype.constructor);

02-es6类的继承

`语法`class 子类 extends 父类 {
    constructor(属性) {
        // 属性的继承
        super(父类的属性)
        this.xxx = xxxx
    }
}

`注意`1. 当使用了extends关键词的时候,就直接把父类的方法继承过来了
    2. 当子类有自己的属性时,必须先继承,再自有
    3. 静态方法属于父类自己独有,不可以被实例对象使用,也不可以被继承
    
`完整代码`class Father {
     // 构造器函数:绑定对象的属性
     constructor(chick, duck, sheep) {
         this.chick = chick
         this.duck = duck
         this.sheep = sheep
     }

     // 原型方法: 挂载到prototype原型对象上的方法
     farm() {
         console.log('种田');
     }

     // 静态方法:构造函数独有的方法,不可以被实例对象使用,也不可以被继承
     static dmj() {
         console.log('打麻将');
     }
 }

// 类的继承:extends: 子类 extends 父类 {}
class Son extends Father {
    constructor(chick, duck, sheep, pig) {
        // 注意:先继承再自有
        // 属性的继承:super关键字实现: super(需要继承的属性,...)
        super(chick, duck, sheep)
        // pig: Son自有的属性
        this.pig = pig
    }

    // 子类自己的原型方法
    code() {
        console.log('敲代码');
    }
}


let s = new Son('鸡', '鸭', '羊', '猪')

console.log(s);
// 1. 当使用了extends关键词的时候,就已经把父类的原型方法继承过来的
s.farm()
s.code()
s.dmj()

03-深拷贝函数的封装【笔试题】

相关推荐

  1. 继承拷贝封装

    2024-03-24 08:26:01       20 阅读
  2. 拷贝拷贝

    2024-03-24 08:26:01       9 阅读
  3. 拷贝拷贝

    2024-03-24 08:26:01       6 阅读
  4. vue 封装对象拷贝方法

    2024-03-24 08:26:01       36 阅读
  5. 讲清楚浅拷贝拷贝

    2024-03-24 08:26:01       39 阅读
  6. python拷贝拷贝

    2024-03-24 08:26:01       24 阅读
  7. 什么是浅拷贝拷贝

    2024-03-24 08:26:01       23 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-03-24 08:26:01       16 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-03-24 08:26:01       16 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-03-24 08:26:01       15 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-03-24 08:26:01       18 阅读

热门阅读

  1. 大模型: 提示词工程(prompt engineering)

    2024-03-24 08:26:01       18 阅读
  2. JVM学习

    JVM学习

    2024-03-24 08:26:01      16 阅读
  3. 【测试思考】设计测试用例时,你在想什么

    2024-03-24 08:26:01       18 阅读
  4. Electron IPC通信机制深度解析与实例演示

    2024-03-24 08:26:01       17 阅读
  5. 如何系统地自学 Python?

    2024-03-24 08:26:01       14 阅读
  6. 学习资料记录

    2024-03-24 08:26:01       16 阅读
  7. 20 有效的括号

    2024-03-24 08:26:01       17 阅读
  8. 机器翻译评价指标 BLEU分数

    2024-03-24 08:26:01       21 阅读
  9. Day31 贪心算法

    2024-03-24 08:26:01       17 阅读
  10. Ubuntu 22.04 安装配置时间同步服务器

    2024-03-24 08:26:01       19 阅读
  11. Eureka和Nacos的关系

    2024-03-24 08:26:01       17 阅读