面向对象编程——class继承
在上面的章节中我们看到了JavaScript的对象模型是基于原型实现的。特点是简单,缺点是理解起来比传统类-实例模型要困难,最大的缺点是继承的实现需要编写大量代码,并且需要正确实现原型链。
新的关键字class从ES6开始正式被引入到JavaScript找那个,class的目的就是让定义类更简单。
我们先回顾用函数实现Student的方法:
function Student(name){
this.name = name;
}
Student.protorype.hello = function(){
alert('Hello,' + this.name + '!');
}
如果用新的class关键字来编写Student,可以这样写:
class Student {
constructor(name){
this.name = name;
}
hello() {
alert('Hello,' + this.name +'!');
}
}
比较一下就可以发现,class的定义包含了构造函数constructor和定义在原型对象上的函数hello()(注意没有function关键字)。这样就避免了Student.prototype.hello = function(){……}这样分散的代码。
最后,创建一个Student对象代码和前面章节完全一样:
var xiaoming = new Student('小明');
xiaoming.hello();
class继承:
用class定义对象的另一个巨大的好处是继承更方便了。现在原型继承的中间对象,原型对象的构造函数等等都不需要考虑了,直接通过extends来实现:
class PrimaryStudent extends Student {
constructor(name,grade){
super(name);//记得哟super调用父类的构造方法
this.grade = grade;
}
myGrade(){
alert('I am at grade' + this.grade);
}
}
注意PrimaryStudent的定义也是class关键字实现的,而extends则表示原型链对象来自Student。子类的构造函数可能会与父类不太相同,例如,PrimaryStudent需要name和grade两个参数,并且需要通过super(name)来调用父类的构造函数,否则父类的name属性无法正常初始化。
PrimaryStudent已经自动获得了父类Student的hello方法,我们又在子类中定义了新的myGrade方法。
ES6引入的class和原有的JavaScript原型链继承有什么去吧呢?实际上它们没有任何区别,class的作用就是让JavaScript引擎去实现原来需要我们自己编写的原型链代码。简而言之,用class的好处就是极大地简化了原型链代码。
只要浏览器支持ES6的class,就可以使用。
如果不可以,就需要一个工具把class代码转换为传统的prototype代码。可以试试Babel工具。
面向对象编程——class继承的更多相关文章
- 面向对象编程(十)——继承之Super关键字及内存分析
Super关键字
- 廖雪峰Java2面向对象编程-3继承和多态-1继承
1.继承 继承是一种代码复用的方式. Student与Person有相同部分的代码. Student可以从Person继承,这样Student获得了Person的所有功能,只需要编写新增的功能即可.通 ...
- Python(面向对象编程——2 继承、派生、组合、抽象类)
继承与派生 ''' 继承:属于 组合:包含 一. 在OOP程序设计中,当我们定义一个class的时候,可以从某个现有的class继承,新的class称为子类(Subclass),而被继承的class称 ...
- Python - 面向对象编程 - 多继承
继承的详解 https://www.cnblogs.com/poloyy/p/15216652.html 这篇文章讲的都是单继承,Python 中还有多继承 Python 多继承的背景 大部分面向对象 ...
- C++面向对象编程,继承,数据抽象,动态绑定
派生类(derived class)能够继承基类(base class )定义的成员: 1).派生类可以无需改变而使用那些与派生类具体特性不相关的操作 2).可以重新定义那些与派生类相关的成员函数,将 ...
- Py修行路 python基础 (十六)面向对象编程的 继承 多态与多态性 封装
一.继承顺序: 多继承情况下,有两种方式:深度优先和广度优先 1.py3/py2 新式类的继承:在查找属性时遵循:广度优先 继承顺序是多条分支,按照从左往右的顺序,进行一步一步查找,一个分支走完会走另 ...
- 廖雪峰Java2面向对象编程-3继承和多态-2多态
1.重载 子类覆写父类的方法称为重载Override. 父类和子类拥有一摸一样的方法(方法的名字.返回值.参数是相同的,但是方法的语句是不一样的) 方法签名如果不同就不是重载,而是创建了一个新的方法. ...
- JS--我发现,原来你是这样的JS:面向对象编程OOP[3]--(JS继承)
一.面向对象编程(继承) 这篇博客是面向对象编程的第三篇,JS继承.继承顾名思义,就是获取父辈的各种"财产"(属性和方法). 怎么实现继承? 我们的JavaScript比较特别了, ...
- 深入理解javascript中实现面向对象编程方法
介绍Javascript中面向对象编程思想之前,需要对以下几个概念有了解: 1. 浅拷贝和深拷贝:程序在运行过程中使用的变量有在栈上的变量和在堆上的变量,在对象或者变量的赋值操作过程中,大多数情况先是 ...
随机推荐
- IE67不兼容display:inline-block,CSS hack解决
追加以下代码:*display:inline.*zoom:1 ;} 块元素变为内联块, IE67不兼容:内联元素变为内联块,所有浏览器都支持 发现问题:当然,变为内联块后,有一个特性就是如果元素换行, ...
- BNU 4356 ——A Simple But Difficult Problem——————【快速幂、模运算】
A Simple But Difficult Problem Time Limit: 5000ms Memory Limit: 65536KB 64-bit integer IO format: %l ...
- [转]MVC系列——MVC源码学习:打造自己的MVC框架(一:核心原理)
本文转自:http://www.cnblogs.com/landeanfen/p/5989092.html 阅读目录 一.MVC原理解析 1.MVC原理 二.HttpHandler 1.HttpHan ...
- Javascript “等于”
JavaScript支持“=”.“==”和“===”运算符. 我们应当理解这些(赋值.相等.恒等)运算符之间的区别,并在编码过程中小心使用. == equality 等同,用于一般比较,在比较的时候可 ...
- AndroidManifest.xml配置文件详解(转载)
AndroidManifest.xml配置文件详解 2013-01-05 10:25:23 分类: Android平台 AndroidManifest.xml配置文件对于Android应用开发来说是 ...
- C#-01.语法基础
a. 语法基础 i. 命名空间(namespace):是 C# 中组织代码的方式,用来声明命名空间 . 语法:namespace 命名空间名称{ //命名空间的声明 } . 作用:可以把紧密相关的一些 ...
- 通过tomcat shutdown port关闭tomcat
在tomcat server.xml配置文件中,有个配置项 <Server port="8005" shutdown="SHUTDOWN"> 通过向 ...
- js之strict模式
JavaScript在设计之初,为了方便初学者学习,并不强制要求用var申明变量.这个设计错误带来了严重的后果:如果一个变量没有通过var申明就被使用,那么该变量就自动被申明为全局变量: i = 10 ...
- 多线程篇四:ThreadLocal实现线程范围内变量共享
1.static实现线程范围内变量共享 package com.test.shareData; import java.util.Random; /** * 多线程范围内的数据共享 * @author ...
- 【数据库】3.0 MySQL入门学习(三)——Windows系统环境下MySQL安装
1.0 我的操作系统是window10 专业版 64位.,不过至少windows7以上系统都是一样的. 关于MySQL如何下载,请参考博文: [数据库]2.0 如何获得MySQL以及MySQL安装 h ...