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('上菜')
}
}
}

js 面向对象 ES5 AND ES6的更多相关文章

  1. javaScript - 面向对象 - ES5 和 ES6

    javaScript - 面向对象 - ES5 和 ES6 ES5之前用 构造函数 构造函数的特点 就是一个普通函数, 他的函数名要大写.: 带方法的写法: 原型的方式: prototype 为内置的 ...

  2. JavaScript面向对象轻松入门之多态(demo by ES5、ES6、TypeScript)

    多态(Polymorphism)按字面的意思就是"多种状态",同样的行为(方法)在不同对象上有不同的状态. 在OOP中很多地方都要用到多态的特性,比如同样是点击鼠标右键,点击快捷方 ...

  3. Atitit js版本es5 es6新特性

    Atitit js版本es5 es6新特性 Es5( es5 其实就是adobe action script的标准化)1 es6新特性1 Es5( es5 其实就是adobe action scrip ...

  4. JavaScript面向对象轻松入门之概述(demo by ES5、ES6、TypeScript)

    写在前面的话 这是一个JavaScript面向对象系列的文章,本篇文章主要讲概述,介绍面向对象,后面计划还会有5篇文章,讲抽象.封装.继承.多态,最后再来一个综合. 说实话,写JavaScript面向 ...

  5. JavaScript面向对象轻松入门之封装(demo by ES5、ES6、TypeScript)

    本章默认大家已经看过作者的前一篇文章 <JavaScript面向对象轻松入门之抽象> 为什么要封装? 封装(Encapsulation)就是把对象的内部属性和方法隐藏起来,外部代码访问该对 ...

  6. ES6教程-字符串,函数的参数,了解函数的arguments对象,js面向对象,设计模式-单例模式,解构赋值

    前言 主要讲解了ES6对字符串的拓展,包括includes,startsWith和endsWith,另外增加了字符串模板. Start includes()是否包含 startsWith()以什么开头 ...

  7. ES6学习笔记(三):教你用js面向对象思维来实现 tab栏增删改查功能

    前两篇文章主要介绍了类和对象.类的继承,如果想了解更多理论请查阅<ES6学习笔记(一):轻松搞懂面向对象编程.类和对象>.<ES6学习笔记(二):教你玩转类的继承和类的对象>, ...

  8. ES5和ES6基本介绍与面向对象的基本思想

    ES6和ES5基本介绍 let  const  关键词定义变量 let 定义变量 特点: let 定义的变量,不会进行预解析  let 定义的变量,与 forEach() 中的变量类似  每次执行都会 ...

  9. React Native的语法之ES5和ES6

    原文地址:http://www.devio.org/2016/08/11/React-Native%E4%B9%8BReact%E9%80%9F%E5%AD%A6%E6%95%99%E7%A8%8B- ...

随机推荐

  1. JVM指令集

    指令集,其实就是一系列指令的集合.例如我们需要给一个局部变量赋予1这个值,即这个动作:int a = 1; 在我们看来,这很简单,但对于机器来说需要很多个动作.所以Java虚拟机指令集就是将这些常用的 ...

  2. Go语言strings和strconv包

    目录 前缀和后缀 字符串包含关系 判断子字符串或字符在父字符串中出现的位置(索引) 字符串替换 统计字符串出现次数 重复字符串 修改字符串大小写 修剪字符串 分割字符串 拼接slice到字符串 从字符 ...

  3. mac中:不能完成此操作,因为找不到一个或多个需要的项目。(错误代码 -43)

    今天使用mac删除某文件时,遇到此错误: 不能完成此操作,因为找不到一个或多个需要的项目.(错误代码 -43) 于是采用命令行删除可以正确删除:在要删除的文件夹坐在目录下执行   rm -rf tes ...

  4. Kubernetes 笔记 03 扫清概念

    本文首发于我的公众号 Linux云计算网络(id: cloud_dev),专注于干货分享,号内有 10T 书籍和视频资源,后台回复「1024」即可领取,欢迎大家关注,二维码文末可以扫. Hi,大家好, ...

  5. Google Chrome 书签导出并生成 MHTML 文件

    目的 因为某些原因需要将存放在 Google Chrome 内的书签导出到本地,所幸 Google Chrome 提供了导出书签的功能. 分析 首先在 Google Chrome 浏览器当中输入 ch ...

  6. 改变input的值不会触发change事件的解决思路

    通常来说,如果我们自己通过 value 改变了 input 元素的值,我们肯定是知道的,但是在某些场景下,页面上有别的逻辑在改变 input 的 value 值,我们可能希望能在这个值发生变化的时候收 ...

  7. XMPP大杂烩

    XMPP大杂烩 对XMPP的理解 XMPP是基于XML的即时通讯协议.对即时通讯场景进行了高度抽象,比如用订阅对方的上下线状态表示好友.提供了文本通讯.用户上下线通知.联系人管理.群组聊天等功能,还可 ...

  8. [java] 为什么重写equals()必须要重写hashCode()

    本文版权归 远方的风lyh和博客园共有,欢迎转载,但须保留此段声明,并给出原文链接,谢谢合作. 在Java API文档中关于hashCode方法有以下几点规定(原文来自java深入解析一书) 1 在j ...

  9. NiftyNet开源平台的使用 -- 配置文件

    NiftyNet开源平台的使用    NiftyNet基础架构是使研究人员能够快速开发和分发用于分割.回归.图像生成和表示学习应用程序,或将平台扩展到新的应用程序的深度学习解决方案. 详细介绍请见: ...

  10. 痞子衡嵌入式:恩智浦半导体全系无线(BLE, Zigbee, Thread, 2.4G, Sub-1G)微控制器芯片一览

    大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是恩智浦半导体全系列无线微控制器芯片. IoT物联网是未来的趋势,半导体厂商作为IoT产业的上游,主要提供核心的无线芯片,作为半导体知名厂 ...