欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Js原型链继承ES5和ES6方法

程序员文章站 2022-07-13 08:42:06
...

继承是几乎所有编程语言中都有的一个概念,它可以将多次使用的变量或方法放在父类或父函数身上,让所有的子类去继承父类的一些构造函数或方法,可以达到减少代码和内存使用的目的。

  1. ES5原型链继承
function Parent(name,age){
    this.name=name;
    this.age=age;
}
Parent.prototype.be=function(){
    console.log('我是原型上的方法');
}

function Children(name,age,height){
    this.name=name;
    this.age=age;
    this.height=height
}
Children.prototype=new Parent();//子类的原型成为父类的实例
Children.prototype.constructor=Children;//将子类的构造方法指回自己
let zhangsan=new Children('zhangsan',23,1.88)
console.log(zhangsan);
let lisi=new Children('lisi',13,1.98)
zhangsan.be();

Js原型链继承ES5和ES6方法
2. ES6的extends关键字

class Person{
    constructor(name,age){
        this.name=name;
        this.age=age
    }
    job(){
        console.log('我是父类继承来的方法');
    }
}
let person1=new Person('curry',34)

class Boy extends Person{
    constructor(name,age){
        super(name,age);
    }
}
let wangwu=new Boy('wangwu',23);
console.log(wangwu);
wangwu.job();

Js原型链继承ES5和ES6方法

相关标签: ES6 前端 js