首页 > 其他分享 >Es5继承

Es5继承

时间:2023-04-25 15:02:08浏览次数:31  
标签:function Es5 console name 继承 SubType SuperType log

1、通过原型链继承:

缺点如下:
* 《1》原型中包含的引用值会在所有实例之间共享,修改一个实例,另一个实例会跟着修改
* 即:通过将属性定义在构造函数中
* 《2》子类实例化时,无法给父类构造函数传参

// 父类
function SuperType() {
    this.colors = ['red', 'blue', 'green']
}
// 子类
function SubType() { }
SubType.prototype = new SuperType()

let instance1 = new SubType()
instance1.colors.push('black')
console.log(instance1.colors)  // "red,blue,green,black"

let instance2 = new SubType()
console.log(instance2.colors)  // "red,blue,green,black"

2、借用构造函数继承

缺点如下:
* 《1》必须在构造函数中定义方法,因此函数不能复用
* 《2》子类不能访问父类原型上定义的方法
* 为确保 SuperType 构造函数不会覆盖 SubType 定义的属性,
* 可以在调用父类构造函数之后再给子类实例添加额外的属性

// 父类
function SuperType(name) {
    this.name = name
}
// 子类
function SubType(name1) {
    SuperType.call(this, name1)
    this.age = 28
}
let instance1 = new SubType('测试名称')
console.log(instance1.name) // 测试名称
console.log(instance1.age) // 28

3、组合式继承

* 缺点如下:
* 《1》组合式继承存在效率问题,父类构造函数会被调用两次,
* 第一次是在创建子类原型、第二次是在子类构造函数中调用
* 最终导致子类原型包含父类所有的实例属性

function SuperType(name) {
    this.name = name;
    this.colors = ["red", "blue", "green"];
}
SuperType.prototype.sayName = function () {
    console.log(this.name);
};

function SubType(name, age) {
    SuperType.call(this, name); // 第二次调用 SuperType()
    this.age = age;
}
SubType.prototype = new SuperType(); // 第一次调用 SuperType()
SubType.prototype.constructor = SubType;
SubType.prototype.sayAge = function () {
    console.log(this.age);
};
let instance1 = new SubType("Nicholas", 29);
instance1.colors.push("black");
console.log(instance1.colors); // "red,blue,green,black"
instance1.sayName(); // "Nicholas";
instance1.sayAge(); // 29
let instance2 = new SubType("Greg", 27);
console.log(instance2.colors); // "red,blue,green"
instance2.sayName(); // "Greg";
instance2.sayAge(); // 27

4、原型式继承

缺点如下:
* 《1》属性中包含的引用数值,会在对象之间共享
* 注:ECMAScript 5 通过增加 Object.create()方法将原型式继承的概念规范化了。这个方法接收两个
* 参数:作为新对象原型的对象,以及给新对象定义额外属性的对象(第二个可选)
* Object.create()的第二个参数与 Object.defineProperties()的第二个参数一样

function object(o) {
    function F() { }
    F.prototype = o
    return new F()
}

let person = {
    name: "Nicholas",
    friends: ["Shelby", "Court", "Van"]
};
let anotherPerson = object(person);
anotherPerson.name = "Greg";
anotherPerson.friends.push("Rob");
let yetAnotherPerson = object(person);
yetAnotherPerson.name = "Linda";
yetAnotherPerson.friends.push("Barbie");
console.log(person.friends); // "Shelby,Court,Van,Rob,Barbie"

5、寄生式继承

* 缺点如下:
* 《1》给对象添加函数会导致函数难以重用,与构造函数模式类似。

function createAnother(original) {
    let clone = object(original); // 通过调用函数创建一个新对象
    clone.sayHi = function () { // 以某种方式增强这个对象
            console.log("hi");
    };
    return clone; // 返回这个对象
}
let person = {
    name: "Nicholas",
    friends: ["Shelby", "Court", "Van"]
};
let anotherPerson = createAnother(person);
anotherPerson.sayHi(); // "hi"

6.寄生式组合继承  <完美解决方案  ES7class类的采用方案>

function SuperType(name) {
    this.name = name;
    this.colors = ["red", "blue", "green"];
}
SuperType.prototype.sayName = function () {
    console.log(this.name);
};
function SubType(name, age) {
    SuperType.call(this, name);
    this.age = age;
}
inheritPrototype(SubType, SuperType);
SubType.prototype.sayAge = function () {
    console.log(this.age);
};

 

标签:function,Es5,console,name,继承,SubType,SuperType,log
From: https://www.cnblogs.com/apon/p/17352609.html

相关文章

  • JS中的继承
    使用classextends关键字js帮我们生成的继承关系图如果我们想要实现上面的继承关系,要注意以下问题:子类和父类的属性都在1中,怎么才能实现?子类的constructor属性指向子类,怎么才能实现?子类的原型方法和父类的原型方法,各自独立,分别在2和3中,怎么才能实现?解决方法子类和父类......
  • 比较Python与Java在类的定义、继承、多态等方面的异同
    首先我来进行介绍Python与Java在类的定义、继承、多态等方面的异同1.python类和java类的使用一览java:publicclassCar{privateStringcolor;privateStringmodel;privateintyear;publicCar(Stringcolor,Stringmodel,intyear){......
  • Python_12 多继承与多态
    一、查缺补漏1.self和super的区别:self调用自己方法,super调用父类方法当使用self调用方法时,会从当前类的方法列表中开始找,如果没有,就从父类中再找而当使用super时,则从父类的方法列表中开始找,然后调用父类的这个方法。2.Alt+回车下载包3.国内源地址,和镜像......
  • 狗的继承(派生与继承)
    6-1狗的继承完成两个类,一个类Animal,表示动物类,有一个成员表示年龄。一个类Dog,继承自Animal,有一个新的数据成员表示颜色,合理设计这两个类,使得测试程序可以运行并得到正确的结果。函数接口定义:按照要求实现类裁判测试程序样例:/*请在这里填写答案*/intmain(){Anim......
  • js 实现继承
    一、使用原型链functionAnimal1(leg){this.leg=leg;}functionDog1(name){this.name=name;Animal1.call(this,4)//!!import1}Dog1.prototype.__proto_......
  • Serverless安全风险研究 - 云原生新计算范式下安全风险继承与新生
    一、Serverless背景0x1:从“硬件”到“Serverless”的变革之路在“云”的概念还没有产生之前,开发者购买物理机,并在其上部署应用程序,企业将购买的机器放置数据中心,其网络、安全配置均需要专业的技术人员管理,在这种高成本运营模式下,虚拟化技术应运而生。技术首先进化出的是虚拟机,......
  • Eclipse中获取类的继承关系和被谁调用[转]
    Eclipse中的右键菜单中的opentypehierarchy可以获取类的继承关系。而opencallhierarchy的可以在项目中寻找当前函数都被谁在何处调用过。这个能够帮助理解当前函数的“可用之处”,尤其在阅读别人的代码的时候非常有用。......
  • java基础-面向对象-继承(三)
    This  Super  继承的时候出现的两个关键字,final(不让复写方法)  abstract (必须复写方法)interface(修饰类)  implement继承好处:提高代码的复用性, 让类与类之间产生了关系,提供了另一个特征多态的前提父类的由来,其实是由多个类不断向上抽取共性内容而来的java来说,继承是单......
  • 继承中耦合性强的问题以及解决方案
    在面向对象编程中,继承是一个常用的特性,它可以让子类继承父类的属性和方法,并且可以在子类中进行扩展和重写。但是,继承也会带来一些问题,其中之一就是耦合性强导致的问题。本文将从耦合性强的定义、出现问题的原因和解决方案三个方面来讨论这个问题。耦合性强的定义在......
  • 神奇的继承
    1、什么是继承?客观事物之间普遍存在层次分类关系。处于上层的事物较抽象,表达的是共性的特征;而处在下层的事物较为具体,除了共性特征外,还具有自身所专有的一些特征。例如,人都有姓名、性别、出生日期等属性和工作生活等行为,这是共性的;个性方面,人按职业又可逐层分为很多类,在每一类中,除......