javascript疑难问题---1、ES6继承小实例

一、总结

一句话总结:

js中的类和继承可以多用es6里面的,和其它后端语言的使用方法一样
    class Animal {
constructor(name) {
this.name = name;
}
say() {
console.log('我是'+this.name);
}
}
class Bird extends Animal {
constructor(name, age) {
super(name);
this.age = age;
}
fly() {
console.log('我是'+this.name+','+this.age+'岁,我在自由自在的飞翔!');
}
}
let animal1=new Animal('大动物');
animal1.say();
let monkey=new Bird('飞猴',15);
monkey.fly();

1、es6类使用?

class Animal,然后构造函数 constructor(name)
    class Animal {
constructor(name) {
this.name = name;
}
say() {
console.log('我是'+this.name);
}
}
let animal1=new Animal('大动物');
animal1.say();

2、es6继承使用?

class Bird extends Animal,并且构造函数constructor(name, age)里面是 super(name);
    class Bird extends Animal {
constructor(name, age) {
super(name);
this.age = age;
}
fly() {
console.log('我是'+this.name+','+this.age+'岁,我在自由自在的飞翔!');
}
}

二、ES6继承小实例

博客对应视频位置:1、es6继承小实例
https://fanrenyi.com/video/4/20

1、需求

创建Animal类(name属性,say方法)
创建Animal类的子类Bird类(age属性,fly方法)

2、效果及实例

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
class Animal {
constructor(name) {
this.name = name;
}
say() {
console.log('我是'+this.name);
}
}
class Bird extends Animal {
constructor(name, age) {
super(name);
this.age = age;
}
fly() {
console.log('我是'+this.name+','+this.age+'岁,我在自由自在的飞翔!');
}
}
let animal1=new Animal('大动物');
animal1.say();
let monkey=new Bird('飞猴',15);
monkey.fly();
</script>
</body>
</html>
 

ES6继承小实例的更多相关文章

  1. python3 类的属性、方法、封装、继承及小实例

    Python 类 Python中的类提供了面向对象编程的所有基本功能:类的继承机制允许多个基类,派生类可以覆盖基类中的任何方法,方法中可以调用基类中的同名方法. 对象可以包含任意数量和类型的数据. p ...

  2. OC小实例关于init方法不小心的错误

    *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...

  3. Entity Framework 的小实例:在项目中添加一个实体类,并做插入操作

    Entity Framework 的小实例:在项目中添加一个实体类,并做插入操作 1>. 创建一个控制台程序2>. 添加一个 ADO.NET实体数据模型,选择对应的数据库与表(Studen ...

  4. [置顶] Cocos2d-x 实例源码分析之二 小实例的主框架

    这篇文章是分析第一个小实例ActionTest的源码.其实所有实例程序的结构都是一样的,只有特定方法里的代码不同,大的框架都是一样的.也就是说看完这篇文章你就可以自己开始分析其他源码了. 废话不多说, ...

  5. Spring初识(通过小实例清晰认识Spring)

    1.spring架构: spring是J2EE应用程序框架,是轻量级的IoC和AOP的容器框架,主要是针对javaBean的生命周期进行管理的轻量级容器,可以单独使用,也可以和Struts框架,iba ...

  6. ES5与ES6的小差异

    ES5与ES6的小差异 变量的定义 ES6与ES5的区别 ES5: <script> console.log(username); var username; var username = ...

  7. es5与es6继承思考

    es5与es6继承思考 es6继承 class Father{ constructor(name){ this.name = name; } getName(){ console.log(this.n ...

  8. django Form 表单 总结与小实例

    开头寄语: 这几天一直在看Django的form表单验证,然后想对于这几天要有个总结. 首先,先来看一下找到的一个form表单验证的流程: 验证过程 流程详解1. 函数full_clean()依次调用 ...

  9. 浅谈ES5和ES6继承和区别

    最近想在重新学下ES6,所以就把自己学到的,记录下加强下自己的理解 首先先简单的聊下ES5和ES6中的继承 1.在es5中的继承: function parent(a,b){ this a = a; ...

随机推荐

  1. 单词eschaunge交易所eschaunge交换

    Exchange of one person or thing for another; reciprocal giving and receiving: (a) of prisoners of wa ...

  2. 如何统一管理单个任务下所有API的同步情况?

    1. 一分钟完成单个API配置 单个API的配置包含:API名称.URL地址.请求方式.参数设置.自定义高级设置. 参数允许用户填写:Text.WebService.Timestamp.DependO ...

  3. 当ABAP遇见普罗米修斯

    Jerry每次在工作场合中同Prometheus(普罗米修斯)打交道时,都会"出戏",因为这个单词给我的第一印象,并不是用go语言实现的微服务监控利器,而是名导雷德利·斯科特(Ri ...

  4. Cannot assign to read only property 'exports' of object '#<Object>' ,文件名大小写问题!!!

    有些坑不知道怎么就掉进去,可能一辈子都爬不起来!!! 一.错误描述 昨天还好好的,今天早上来从git获取了一下别人提交的代码就出错了!而提交代码的人 运行一点错误都没有!!! cya@KQ-101 M ...

  5. nginx使用过程中遇到的问题及基本使用总结

    问题: 1.出现这个问题nginx: [error] open() "/run/nginx.pid" failed (2: No such file or directory) 解 ...

  6. JavaScript: 详解正则表达式之一

    正则表达式是一个精巧的利器,经常用来在字符串中查找和替换,JavaScript语言参照Perl,也提供了正则表达式相关模块,开发当中非常实用,在一些类库或是框架中,比如jQuery,就存在大量的正则表 ...

  7. Linux chown命令详解使用格式和方法

    指令名称 : chown 使用权限 : root(一般来说,这个指令只有是由系统管理者(root)所使用,一般使用者没有权限可以改变别人的文件拥有者,也没有权限可以自己的文件拥有者改设为别人.只有系统 ...

  8. linux卸载mysql误删mysql.pm

    操作步骤如下 linux卸载mysql:yum remove mysql 查找mysql所有的文件并删除: 查找:find / -name mysql 删除:rm -rf xxx 误操作删除mysql ...

  9. Spring Cloud Ribbon负载均衡(快速搭建)

    Spring Cloud Ribbon 是一个基于HTTP和TCP的客户端负载均衡工具,它基于Netflix Ribbon实现.通过 Spring Cloud 的封装, 可以让我们轻松地将面向服务的 ...

  10. discuz数据批量入库接口

    近期在做社区,首选discuz,数据需要用scrapy爬虫批量入库,就写了一个php入库接口. <?php define('PW', 'abc123456');//一定要修改 if($_REQU ...