<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <title>Page Title</title>

    <meta name="viewport" content="width=device-width, initial-scale=1">

</head>

<body>

    <script>

        //创建Person类

        class Person {

            //构造函数

            constructor(name,age){

                this.name = name;

                this.age = age;

            }

            //方法

            say(){

                alert(this.name)

            }

        }

        //创建Worker类 继承自 Person类

        class Worker extends Person {

            //Worker类的构造函数

            constructor(name,age,work){

                //继承Person类中的属性

                super(name,age);

                this.work = work;

            }

            //方法

            sayWork(){

                alert(this.work)

            }

        }

        //生成实例

        let w = new Worker('李三',18,'搬砖');

        //调用方法

        w.say();

        w.sayWork();

    </script>

</body>

</html>

es6中的面向对象写法的更多相关文章

  1. ES6中对象的扩展

    ES6不仅为字符串.数值和数组带来了扩展,也为对象带来了很多新特性.这一节,我们来一起学习一下对象的扩展. 对象的传统表示法 我们回顾一下,对象的传统表示法: let person = { " ...

  2. 深入解读 Js 中的面向对象编程

    前言:今天看了一篇文章觉得很不错,所以给大家分享一下,也许很多人都看过面向对象编程甚至写过这样博客,觉得面向对象编程就那样,没啥好说的,那可能是因为你对这方面知识已经了解,可以选择性跳过.那如果有更通 ...

  3. ES5和ES6中关于import & export的书写方式的区别

    ES6中输出变量的写法 情景1:单个变量 输出 export const less = 'less' 引用 import {less} from '../index.js' 情景2:多个变量 输出: ...

  4. 如何在webpack开发中利用vue框架使用ES6中提供的新语法

    在webpack中开发,会遇到一大推问题,特别是babel6升级到babel7,要跟新一大推插件,而对于安装babel的功能就是在webpack开发中,vue中能够是用ES6的新特性: 例如ES6中的 ...

  5. 粗看ES6之面向对象写法

    标签: es6 在es6以前,js没有类的概念,虽然有构造函数原型的方式用来做面向对向开发,但是对于书法并不是十分友好,而且对于继承实现也不是十分友好. es6引入class constructor ...

  6. Nodejs与ES6系列4:ES6中的类

    ES6中的类 4.1.class基本语法 在之前的javascript语法中是不存在class这样的概念,如果要通过构造函数生成一个新对象代码 function Shape(width,height) ...

  7. ES6中比较实用的几个特性

    1.Default Parameters(默认参数) in ES6 es6之前,定义默认参数的方法是在一个方法内部定义 var link = function (height, color, url) ...

  8. 深入ES6中的class类

    今天在学习vuex时,遇到了定义store类时的一种写法,就是在类中的方法使用箭头函数绑定this的问题时的一种操作,感觉写法有点陌生,遂深究一番,好了上代码 此处写commit中的地方,是为了绑定t ...

  9. ES6中的class类的理解

    传统的javascript中只有对象,没有类的概念.它是基于原型的面向对象语言.原型对象特点就是将自身的属性共享给新对象.这样的写法相对于其它传统面向对象语言来讲,很有一种独树一帜的感脚!非常容易让人 ...

随机推荐

  1. java基本数据类型转换之向上转型和向下转换

    向上转换: 整型,字符型,浮点型的数据在混合运算中相互转换,转换时遵循以下原则: 容量小的类型可自动转换为容量大的数据类型: byte,short,char → int → long → float ...

  2. [转]React入门看这篇就够了

    摘要: 很多值得了解的细节. 原文:React入门看这篇就够了 作者:Random Fundebug经授权转载,版权归原作者所有. React 背景介绍 React 入门实例教程 React 起源于 ...

  3. java.lang.ClassCastException: com.sun.proxy.$Proxy6 cannot be cast to com.etc.service.serviceImpl.BankServiceImpl

    错误原因: java.lang.ClassCastException: com.sun.proxy.$Proxy6 cannot be cast to com.etc.service.serviceI ...

  4. css3图片展示方式

    <view class='img_block' id='mjltest'> <view class='text_view'> <view class='{{cell_cl ...

  5. Executor线程池的最佳线程数量计算

    如果是IO密集型应用,则线程池大小设置为2N+1: 如果是CPU密集型应用,则线程池大小设置为N+1: N代表CPU的核数. 假设我的服务器是4核的,且一般进行大数据运算,cpu消耗较大,那么线程池数 ...

  6. vue-learning：31 - component - 组件间通信的6种方法

    vue组件间通信的6种方法 父子组件通信 prop / $emit 嵌套组件 $attrs / $liteners 后代组件通信 provide / inject 组件实例引用 $root / $pa ...

  7. vue-learning：29 - component - 组件三大API之三：slot

    组件三大API之三: slot <slot>标签 v-slot指令 普通插槽 有默认值的插槽 具名插槽 作用域插槽 v-slot是Vue 2.6.0引入的一个新语法指令,目的是统一之前sl ...

  8. [HNOI2019]白兔之舞

    memset0 多合一无聊题 mod k=t,并且k是p-1的约数 单位根反演石锤了. 所以直接设f[i]表示走i步的方案数, 然后C(L,i)分配位置,再A^i进行矩乘得到f[i] 变成生成函数F( ...

  9. blink接收器

    blink: [autorun] OPEN="AutoInst.exe"  [AskRebootTitle] Dlg1=System Settings Change Dlg2=št ...

  10. oracle中update语句修改多个字段

    如需要修改下列数据:表名为student 一般会这样写: update student set sname = '李四', sage = 20, sbirthday = to_date('2010-0 ...