ES6-中的继承

下面的例子是分别使用ES5和ES6的语法来实现Programer类 继承 Person类

1.ES5中的继承实现

 <script>
        /**
         * 1.Person 构造器
         * @param name
         * @param age
         * @constructor
         */
        function Person(name,age) {
            this.name=name;
            this.age=age;
        }
        /**
         * 2.添加一个getName方法
         */
        Person.prototype.getName=function () {
            console.log(this.name);
        }


        /**
         * 3. Programer 构造器
         * @param name
         * @param age
         * @constructor
         */
        function Programer(name,age,job) {
            //借用父亲的构造函数, 实现属性继承和传递参数
            Person.call(this,name,age);
            this.job=job;
        }

        /**
         * 4.Programer类 继承 Person类
         * @type {Person}
         */
        Programer.prototype=new Person();
        //指向原型属性对应的构造函数
        Programer.prototype.constructor=Programer;

        /**
         * 5. 给Programer类添加一个getJob的方法
         */
        Programer.prototype.getJob=function () {
            console.log(this.job);
        }

        /**
         * 6.新建Programer类
         * @type {Programer}
         */
        var programer=new Programer('jack',20,'前端工程师');
        programer.getName();
        programer.getJob();

    </script>

2.ES6中的继承实现

        /**
         * 1.定义个Person类
         */
        class Person{
            /**
             * 2.构造器函数
             */
            constructor(name,age){
                this.name=name;
                this.age=age;
            }

            /**
             * 3.获取名称的方法
             */
            getName(){
                console.log(this.name);
            }
        }

        /**
         * 4.定义一个Programer类 ，并且继承 Person 类
         */
        class Programer extends Person{
            /**
             * 5.构造函数
             * @param name
             * @param age
             * @param job
             */
            constructor(name,age,job){
                //调用父亲的构造函数
                super(name,age);
                this.job=job;
            }

            /**
             * 6.获取job的方法
             */
            getJob(){
                console.log(this.job);
            }
        }

        /**
         * 7.新建programer类
         * @type {Programer}
         */
        var programer=new Programer('jack',20,'前端工程师');
        programer.getName();
        programer.getJob();

    </script>