前端面试题: js中es6的继承方法

我们大家 可能有的童鞋知道  js语言在建立之初是没有面向对象的语法的  比如 class 重载 继承等等

我们只能通过其他的方式去实现  通过原型进行继承  通过方法参数个数的的不同来实现重载

但在其它语言的影响下  增加面向对象的语法 也是js程序员的一个 呼声吧

就这样 在新版js  es6中 终于增加了  像java c++,php中的 编程方式  也新增了 class 关键字 

今天我们就来谈一谈 es6中的一些 继承方法   本文是入门级别  仅作参考

首先我们先建立一个类

建立一个父类   在es6中 新增的class 对象结构  注意了 :里面的函数命名  不要写 es5格式  比如  say:function(){} 是要报错的

既然用了 es6中的class关键字明明对象  就遵守它里面的语法规则  使用es6 对象方法的简写方式    say()

class Father {
            constructor(name,age) {
                this.name=name;
                this.age=age;
            }
            say(){
                console.log('我是你的爸爸!');
            }
        }

如果再建立一个孩子类 对父类进行继承的话  废话不多说还是直接上代码

var person=new Father('小明',29);   //实例化 父类
        console.log(person.name);   // 输出  小明
        class Son extends Father {    //创建一个子类  通过 extends 关键字 继承 父类
            constructor(name,age,sex) {
                super(name,age)    //super方法  快速实现对父类构造方法的继承  不用再重新 书写赋值   记住一定要放在子类构造方法的最前面
                this.sex=sex;
            }
        }

最后让我们来看下效果吧

var son=new Son('xiaobai',18,'man');  //实例化子类
        console.log(son);
        son.say();   //这里也确实调用了 父类中的方法  不过 也可以在子类中重写 父类的say方法 这里没有重写 那输出的就是  “我是你爸爸”

发布了107 篇原创文章 · 获赞 64 · 访问量 6645

猜你喜欢

转载自blog.csdn.net/yunchong_zhao/article/details/104000351