ES6面向对象class类继承

一、概念

<!-- js是由事件来进行驱动的，他是面向对象的编程语言 -->

<!-- 面向对象是以对象功能来划分问题，而不是步骤。

把事物划分为一个个对象，解决问题

-->

<!-- 面向对象的特性 封装性、继承性、多态性。 -->

<!-- 面向对象和面向过程的区别

面向过程优点 性能高 缺点不利于维护

面向对象优点 利于维护 缺点不如面向过程性能高 -->

二、class类和继承

 <script>
    //es5创建对象的方式
        //1
        let objPhone = {
            size:"6.1存",
            brand:"vivo",
            model:"vivo iQoo z5x",
            price:"￥9999",
        }
        //2
        function GOphone(size,brand,model,price){
            this.size=size;
            this.brand=brand;
            this.model=model;
            this.price=price;
        }
        let Zao = new GOphone("6.5存","华为","mate60","￥8999")
    //es6创建对象的方式class
        //constructor相当于类的构造函数，一定要使用new关键字进行实例化
        //在类被创建出来的时候会自动每一个类带一个constructor，constructor自己执行不需要调用
        //在类当中写方法的时候会省略funtion关键字,写上会报错
        //在一个类当中只能写一个constructor，否则会报错，(其中若是没有写过constructor，那么默认也存在一个constructor)
        //在一个类当中，方法和方法之间不需要用逗号隔开，写逗号会报错；
        class NewPhone{
            constructor(brand,price){
                this.brand=brand;
                this.price=price;
            }
            run(){
                console.log("哈哈哈哈哈");
            }
        }
        let Phones = new NewPhone("oppoFindx3","￥6999");
        console.log(Phones.brand);
        Phones.run();
    //继承
        // 关键字extends 后面跟的是要继承的那个类名
        class Son extends NewPhone{
            constructor(brand,price,size,model){
                //super是用作子类调用父类构造函数当中的东西使用到的关键字
                //如果在继承后，子类想要在构造函数中新增内容，需要先调用父类构造函数当中的代码，然后才可以使用子类的东西，否则会报错。
                //如果在子类中使用super需要放在this或者代码最前面调用
                super(brand,price)
                this.size=size;
                this.model=model;
            }
            run(){
                //如果在父类里面的方法，子类里面也有会调用子类的方法(1方法重写2就近原则)，如果调用方法时子类没有会从父类当中去找
                console.log("呜呜呜呜呜");
            }
        }
        let sons  =new Son("lalal","???","88",55555);//按照父类子类变量顺序赋值
        console.log(sons.size);
        sons.run();
        console.log(sons.brand);//输出结果为子类的新赋值lalal
        let sonss = new Son("9090","ff","uu",8888888);//还可以再次new子类重新赋值使用
        console.log(sonss.brand);//输出结果为9090
    </script>