您好,欢迎来到调星娱乐。
搜索
您的当前位置:首页ES6 class的应用实例分析

ES6 class的应用实例分析

来源:调星娱乐


本文实例讲述了ES6 class的应用。分享给大家供大家参考,具体如下:

class

  • class 本身是个语法糖,主要为了考虑在编码上更加人性化
  • 内部有super,static,get 等关键词
  • 使用起来非常类似于后台语言
  • 使用class进行类的实现应用

    'use strict';
    // User 类
    class User {
     constructor(name,age) {
     this.name = name;
     this.age = age;
     }
     static getName() {
     return 'User';
     }
     static getAge() {
     return this.age;
     }
     setName(name) {
     this.name = name;
     }
     setAge(age) {
     this.age = age;
     }
     get info() {
     return 'name:' + this.name + ' | age:' + this.age;
     }
    }
    // Manager 类
    class Manager extends User{
     constructor(name,age,password){
     super(name,age);
     this.password = this.password;
     }
     changePwd(pwd) {
     return this.password = pwd;
     }
     get info() {
     var info = super.info; // 使用super继承父级 get
     return info + ' === new';
     }
    }
    // typeof User: function typeof Manager: function
    console.log('typeof User: ', typeof User, ' typeof Manager: ', typeof Manager); 
    let manager = new Manager('Li', 22, '123456');
    manager.setAge(23);
    console.log(manager.info); // name:Li | age:23 === new
    console.log(User.prototype);
    console.log(Manager.prototype); 
    
    

    在class之前使用原型对象定义类的应用

    // 构造函数
    function User(name,age) {
     this.name = name;
     this.age = age;
    }
    // 原型
    User.prototype = {
     getName:function(){
     return 'User';
     },
     setName:function(name){
     this.name = name;
     },
     getAge:function(){
     return this.age;
     },
     setAge:function(age){
     this.age = age;
     }
    }
    // 取值函数和存执函数
    Object.defineProperty(User.prototype,'info', {
     get() {
     return 'name:' + this.name + ' | age:' + this.age;
     }
    });
    var user = new User('Joh', 26);
    console.log(user); // User {name: "Joh", age: 26}
    // 子类
    function Manager(name, age, password) {
     User.call(this, name, age);
     this.password = password;
    }
    Manager.__proto__ = User; // 继承静态方法
    Manager.prototype = Object.create(User.prototype); // 继承prototype原型方法
    Manager.prototype.changePwd = function (pwd) {
     this.password = pwd;
    };
    var manager = new Manager('Li', 22, '123456');
    manager.setAge(23);
    console.log(manager.info); // name:Li | age:23
    console.log(User.prototype); // 不变
    console.log(Manager.prototype); // {changePwd:function(){}, info:"name:undefined | age:undefined", __proto__:指向Manager.prototype}
    
    

    使用 class 定义的类不被提升,需按顺序执行

    正常:

    let user = new class User {
     constructor(name) {
     this.name = name;
     }
    }('Joh');
    console.log(user); // User {name: "Joh"}
    
    

    错误:

    var man = new Man(); // 此处报错,使用class声明的类不会被提升 Uncaught ReferenceError: Man is not defined
    class Man {
     constructor(name){
     this.name = name;
     }
    }
    
    

    更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数算用法总结》

    希望本文所述对大家JavaScript程序设计有所帮助。

    Copyright © 2019- dxga.cn 版权所有 湘ICP备2023023988号-8

    违法及侵权请联系:TEL:199 18 7713 E-MAIL:2724546146@qq.com

    本站由北京市万商天勤律师事务所王兴未律师提供法律服务