跟面向对象卯上了,看看ES6的“类”

  上回我们说到ES5的面向对象,以及被大家公认的最佳的寄生组合式继承。时代在进步,在ES6中对于面向对象这个大boss理所应当地进行了一次大改,从原先那种比较长的写法转变为“小清新”写法。我们一起来看一下。

  在ES6中是有类这个概念,而且是堂而皇之地有了。

  我们来看一串代码:

  

 1 class Dad {
 2     constructor(name="无姓名",age=0){
 3         this.name=name;
 4         this.age=age;
 5     }
 6 
 7     surface(){
 8         console.log(this.name,this.age);
 9     }
10 }
11 
12 class Sons extends Dad {
13     constructor(name,age){
14         super(name,age);
15     }
16 }
17 
18 const son1=new Sons("张花花",16);
19 son1.surface();

  其实我们用的依然是上回说的那个例子,在ES6中,用extends来实现对父类的继承,同时在构造器中调用super方法实现子类给父类传参,这里我们传入张花花这个妹子作为参数,果然成功地调用到了父类的surface方法。注意,这里在类中定义的这个方法,其实本质上就是构造函数Dad的prototype里面的方法。

  当我说到这里时,也许小伙伴们会有少许震惊吧,exo me?Dad不是类吗,怎么变方法了。我们在控制台中测一测:

  

  哇!多么恐怖,真的就是个function,其实ES6中类的概念只不过是对ES5中相关概念的包装,说得好听一点就是对语法糖的抽象,只是看起来确实更加简单了。对于上面这个例子,我们继承了父类的surface方法,也可以自己写一个方法来覆盖它。

  

  这回我们在子类里面又写了一个surface方法,成功将父类继承下来的同名方法覆盖了。


更多专业前端知识,请上 【猿2048】www.mk2048.com

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/364781.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

js 变量作用域

例子 <script>var a "heh"function findLove(){console.log(a);function findforyou(){var a "you";console.log(a);}function findother(){console.log(a)}findforyou();findother();}findLove(); </script> 输出 heh you heh 例子 <scri…

Jin Ge Jin Qu hao UVA - 12563 01背包

题目&#xff1a;题目链接 思路&#xff1a;由于t最大值其实只有180 * 50 678&#xff0c;可以直接当成01背包来做&#xff0c;需要考虑的量有两个&#xff0c;时间和歌曲数&#xff0c;其中歌曲优先级大于时间&#xff0c;于是我们将歌曲数作为背包收益&#xff0c;用时间作为…

Java 8中的5个功能将改变您的编码方式

Java 8在JVM和语言级别都包含了一些非常令人兴奋的功能。 虽然最初为该发行版设想的某些功能已扩大范围或已推出到第9版&#xff0c;但实际上有数十个新功能。 许多新添加的内容在编译器&#xff0c;JVM或帮助系统级别都进行了后台改进。 这样&#xff0c;虽然我们可能会从中受…

Java相关资料分享(视频+电子书籍)

关注微信公众号【Java典籍】&#xff0c;获取百度网盘提取码 ▼微信扫一扫下图↓↓↓二维码关注 转载于:https://www.cnblogs.com/bingyimeiling/p/10279049.html

vue项目 一行js代码搞定点击图片放大缩小

一行js代码搞定xue项目需要点击图片放大缩小&#xff0c;其实主要用的是用到了vue:class的动态切换&#xff0c;内容比较简单。一开始我把维护的需求想得太复杂了&#xff0c;和测试小姐姐聊了一下才反应过来。 两个月不到跟了四个项目&#xff0c;现在是维护改bug阶段&#x…

指针系统学习8-小结

1.有关指针的数据类型的小结 2.指针运算小结 一、指针变量加&#xff08;减&#xff09;一个整数,会指向上&#xff08;下&#xff09;1&#xff08;i&#xff09;个元素  例如&#xff1a;&#xff50;&#xff0b;&#xff0b;、&#xff50;&#xff0d;&#xff0d;、&am…

java项目中外接扫描仪无法使用_java – 扫描仪行不可用错误

我用两种不同的方法从两个不同的扫描仪对象调用Scanner.nextLine()方法.有时当我从第二种方法调用Scanner.nextLine()时,它会给我一个“行不可用”错误.可能是什么问题&#xff1f;import java.util.Scanner;public class TicTacToe {private final String COMPUTER "com…

Spring集成–使用RMI通道适配器

1.引言 本文介绍了如何使用Spring Integration RMI通道适配器通过RMI发送和接收消息。 它由以下部分组成&#xff1a; 实施服务&#xff1a;第一部分着重于创建和公开服务。 实现客户端&#xff1a;显示如何使用MessagingTemplate类调用服务。 抽象SI逻辑&#xff1a;最后&a…

mybatis 直接执行sql 【我】

Connection conn getConnection();// Connection conn this.ss.getConnection(); 返回Connection对象 try { String sql "UPDATE PARTY SET PARTY_NAME 测试0000 WHERE PARTY_ID 0;UPDATE PARTY SET PARTY_NAME 测试1111 WH…

jquery点击非div区域隐藏div

点击非div区域隐藏div&#xff0c;如图&#xff0c;点击圆的头像&#xff08;.person-msg&#xff09;弹出白色底框(.person-centre)。点击圆头像以外的区域隐藏白色底框 html代码 <div class"per_c"><div class"person-msg pull-right"><i…

几种常用的函数

range()函数: range(起始位置,终止位置,步长)  next()函数: __next__是迭代器方法变量.__next__() 带双下火线的魔术发那个方法 一般情况下不直接使用next(变量)带双下划线的所有方法都可能和内置函数有千丝万缕的联系iter()函数: 可迭代的迭代器 可迭代的.__iter__()迭代器…

java sql server连接字符串_关于Java:SQL Server的等效jdbc连接字符串

我目前正在使用以下连接字符串连接到数据库(该数据库与ServerIP在同一服务器上)&#xff1a;String constr "Data SourceServerIP,1433;Network LibraryDBMSSOCN;InitialCatalogdbName;User IDdbUserID;PassworddbUserPassword";在asp.net中使用时&#xff0c;此连接…

上传图片或文件 方法一

最近在巩固一些知识点&#xff0c;回过头看之前做过的项目&#xff0c;所以就在这里总结一下 话不多说&#xff0c;直接看源码 前端 publish-menu.jsp 1 <form action"PublishMenu" method"post" enctype"multipart/form-data" > 2 3 …

如何在Ubuntu上轻松安装Oracle Java

Ubuntu上的开发人员习惯于至少看到两种Java风格。 OpenJDK是Java运行时和编译器的开源构建。 Oracle JDK以此为基础&#xff0c;但是增加了一些封闭源组件。 从理论上讲&#xff0c;OpenJDK是Java 7的官方参考实现 &#xff0c;并且完全可以满足您的所有需求。 在实践中&#…

今天发现新大陆:haml和Emmet

其实一开始小渣渣我只是想接触一下&#xff08;css预处理器&#xff09;sass&#xff0c;可是突然冒出一个haml。 原文是酱紫的。 Sass 是采用 Ruby 语言编写的一款 CSS 预处理语言&#xff0c;它诞生于2007年&#xff0c;是最大的成熟的 CSS 预处理语言。最初它是为了配合 H…

Docker系列(五):.Net Core实现k8s健康探测机制

k8s通过liveness来探测微服务的存活性&#xff0c;判断什么时候该重启容器实现自愈。比如访问 Web 服务器时显示 500 内部错误&#xff0c;可能是系统超载&#xff0c;也可能是资源死锁&#xff0c;此时 httpd 进程并没有异常退出&#xff0c;在这种情况下重启容器可能是最直接…

编写java程序计算梯形面积_学习练习 java面向对象梯形面积

package com.hanqi;public class Ladder {double ShangDi;double XiaDi;double Gao;double MianJi;Ladder(double ShangDi, double XiaDi, double Gao){//使用参数来初始化属性//this 代表当前类this.ShangDi ShangDi;this.XiaDi XiaDi;this.Gao Gao;}//方法的命名&#xff…

02-再探MySQL数据库

一、数据类型 1、数值类型 a、整数类型 整数类型&#xff1a;TINYINT SMALLINT MEDIUMINT INT BIGINT 作用&#xff1a;存储年龄&#xff0c;等级&#xff0c;id&#xff0c;各种号码等。 tinyint[(m)] [unsigned] [zerofill]小整数&#xff0c;数据类型用于保存一些范围的整数…

如何在WebLogic Server中创建MySQL数据源

使用应用程序服务器的一个很酷的事情是&#xff0c;它允许您在应用程序外部创建DataSource&#xff0c;并且可以与线程池和事务管理器等一起管理它。对于WebLogic Server&#xff0c;它附带了许多内置的JDBC驱动程序&#xff0c;例如Oracle数据库和MySQL等随时可用。 在这里&am…

js原生带缩略图的图片切换效果

js原生带缩略图的图片切换效果 本例中用到的 moveElement(elementID,final_x,final_y,interval)是来自《JavaScript DOM编程艺术&#xff08;中文第二版&#xff09;》一书第10章中有一段代码。&#xff08;可以直接baidu&#xff09; 左边是banner图&#xff0c;右边是缩略图…