在上面的章节中我们看到了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继承的更多相关文章

  1. 面向对象编程(十)——继承之Super关键字及内存分析

    Super关键字

  2. 廖雪峰Java2面向对象编程-3继承和多态-1继承

    1.继承 继承是一种代码复用的方式. Student与Person有相同部分的代码. Student可以从Person继承,这样Student获得了Person的所有功能,只需要编写新增的功能即可.通 ...

  3. Python(面向对象编程——2 继承、派生、组合、抽象类)

    继承与派生 ''' 继承:属于 组合:包含 一. 在OOP程序设计中,当我们定义一个class的时候,可以从某个现有的class继承,新的class称为子类(Subclass),而被继承的class称 ...

  4. Python - 面向对象编程 - 多继承

    继承的详解 https://www.cnblogs.com/poloyy/p/15216652.html 这篇文章讲的都是单继承,Python 中还有多继承 Python 多继承的背景 大部分面向对象 ...

  5. C++面向对象编程,继承,数据抽象,动态绑定

    派生类(derived class)能够继承基类(base class )定义的成员: 1).派生类可以无需改变而使用那些与派生类具体特性不相关的操作 2).可以重新定义那些与派生类相关的成员函数,将 ...

  6. Py修行路 python基础 (十六)面向对象编程的 继承 多态与多态性 封装

    一.继承顺序: 多继承情况下,有两种方式:深度优先和广度优先 1.py3/py2 新式类的继承:在查找属性时遵循:广度优先 继承顺序是多条分支,按照从左往右的顺序,进行一步一步查找,一个分支走完会走另 ...

  7. 廖雪峰Java2面向对象编程-3继承和多态-2多态

    1.重载 子类覆写父类的方法称为重载Override. 父类和子类拥有一摸一样的方法(方法的名字.返回值.参数是相同的,但是方法的语句是不一样的) 方法签名如果不同就不是重载,而是创建了一个新的方法. ...

  8. JS--我发现,原来你是这样的JS:面向对象编程OOP[3]--(JS继承)

    一.面向对象编程(继承) 这篇博客是面向对象编程的第三篇,JS继承.继承顾名思义,就是获取父辈的各种"财产"(属性和方法). 怎么实现继承? 我们的JavaScript比较特别了, ...

  9. 深入理解javascript中实现面向对象编程方法

    介绍Javascript中面向对象编程思想之前,需要对以下几个概念有了解: 1. 浅拷贝和深拷贝:程序在运行过程中使用的变量有在栈上的变量和在堆上的变量,在对象或者变量的赋值操作过程中,大多数情况先是 ...

随机推荐

  1. Coursera 机器学习 第8章(上) Unsupervised Learning 学习笔记

    8 Unsupervised Learning8.1 Clustering8.1.1 Unsupervised Learning: Introduction集群(聚类)的概念.什么是无监督学习:对于无 ...

  2. Java入门系列-11-类和对象

    这篇文章为你搞懂类和对象的使用 对象:用来描述客观事物的实体,由一组属性和方法组成,万物皆对象. 属性:就是对象的特征,像身高.体重.颜色 方法:对象的行为,如跑.跳 类:类是模子,定义对象将会拥有的 ...

  3. fabric省略输出

    fab -f test_fabric.py start --hide status,running,stdout,user,aborts,warnings,stderr 省略所有输出--hide st ...

  4. 跨页面传值2之cookie多值使用

    单值cookie结构 CookieKeyName——CookieValue CookieKeyName2——CookieValue2 ............... 通过CookieKeyName进行 ...

  5. 【读书笔记】C#高级编程(一).NET体系结构

    写在前面:从业两年来,一直停留在会用的阶段,而没有去仔细思考过为什么这么用,之前也大致扫过<c#高级编程>一书,这次想借一袭脑海中的冲动,再次好好仔细过过这本书,夯实基础,温故知新. 一. ...

  6. 希尔排序——Java实现

    一.排序思想 希尔排序(Shell’s Sort)是插入排序的一种,是直接插入排序算法的一种更高版本的改进版本. 把记录按步长gap分组,对每组记录采用直接插入排序方法进行排序: 随着步长逐渐减小,所 ...

  7. C++中 结构体和类的异同

    在C++中,结构体是一种特殊形态的类. 结构体和类的唯一区别就是:  结构体和类具有不同的默认访问控制属性. 类中,对于未指定访问控制属性的成员,其访问控制属性为私有类型(private) 结构体中, ...

  8. vue.extend与vue.component的区别和联系

    一味的闷头开发,却对基础概念缺乏理解,是个大坑... 查阅官网后现对自己的理解记录一下,用于日后复习巩固 Vue.extend({}) 简述:使用vue.extend返回一个子类构造函数,也就是预设部 ...

  9. vue+axios+easy-mock+element-ui实现表格分页功能

    废话不多,效果如图: LineSource.vue文件内代码如下: <template> <div class="c-main auth userControl" ...

  10. Stage2--Python的数据类型

    说在前面: Stage1-Stage4简单介绍一下Python语法,Stage5开始用python实现一些实际应用,语法的东西到处可以查看到,学习一门程序语言的最终目的是应用,而不是学习语法,语法本事 ...