js 面向对象 ES5 AND ES6

2018-08-06 09:10:58来源:博客园 阅读 ()

新老客户大回馈,云服务器低至5折

1. ES5实现

父类:

// 职员类
function Employees(id,name,salary) {  // 属性
    this.id = id;
    this.name = name;
    this.salary = salary;
}
Employees.prototype.work = function (dish) { // 方法
    return dish
};

子类继承父类:

function Waiter(id, name, salary) {
    Employees.call(this, id, name, salary) //  使用call, 继承父类
}
Waiter.prototype = Object.create(Employees.prototype);// 继承父类原型
Waiter.prototype.constructor= Waiter; // 设置constructor指向自己
Waiter.prototype.work = function (arg) { // 重写原型上的方法
    if (arg instanceof Array){
        return arg
    } else { //上菜行为
        console.log('not a array')
    }
};

2. ES6实现

父类:

// 职员类
class Employees {
    constructor(id, name, salary){ // 属性
        this.id = id;
        this.name = name;
        this.salary = salary;
    }
    work(dish){  // 方法
        return dish
    }
}

子类继承:

// Waiter
class Waiter extends Employees { // 使用关键字extends,继承父类
    constructor(...arg){ // 继承父类
        super(...arg)
    }
    work(arg){  // 重写父类中work方法
        if (arg instanceof Array){ //数组的话,记录点菜
            return arg
        } else { //上菜行为
            console.log('上菜')
        }
    }
}

 

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:Vuex的使用

下一篇:Node复习