请选择 进入手机版 | 继续访问电脑版
猿人社区
查看: 26|回复: 0

[干货] ECMAScript2015 ES6 类

[复制链接]

88

主题

88

帖子

429

积分

管理员

Rank: 9Rank: 9Rank: 9

注册时间
2018-7-24
最后登录
2018-12-8
在线时间
68 小时
威望
18
金钱
293
贡献
12
发表于 2018-11-29 12:10:12 | 显示全部楼层 |阅读模式
定义类 class关键词this指向的类本身
class className{  }
  1. class person{}
复制代码

赋值形式定义类
  1. let Person=class{
  2.       //code
  3.     }
复制代码


构造函数 constructor是在实例化类的时候默认执行的函数
constructor(){}

实例:
  1. class Person{
  2.       constructor(...a){
  3.         console.log(a);
  4.       }
  5.     }

  6.     new Person("name",20);
复制代码
控制台打印输出:["name", 20]

类没有提升功能
  1. let p1=new Person();
  2.     class Person{
  3.       constructor(){
  4.         console.log(11);
  5.       }
  6.     }
复制代码
控制台打印输出  Person is not defined


类的get 取值
  1. class Person{
  2.       get num(){
  3.         console.log(123456);
  4.       }
  5.     }
  6.     let p1=new Person();
  7.     console.log(p1.num);
复制代码
p1.num相当于获取 类的num属性 而在类里面可以指定num这个属性返回的内容


类的set 设置值
  1. class Person{
  2.       set letter(val){
  3.         console.log(val);
  4.       }
  5.     }
  6.     let p1=new Person();
  7.     p1.letter="ABC";
复制代码
p1.letter="ABC"; 设置p1的letter属性为 ABC
而在类里面声明设置letter属性要输出什么或者执行其他 val就是传输进来的ABC


静态方法 static
static funName(){ //code }
例子:
  1. class Person{
  2.       static say(){
  3.         console.log("Hello!");
  4.       }
  5.     }
  6.     Person.say();
复制代码
不用实例化类 直接使用 类名 调用方法


继承 extends
  1. class Person{
  2.       constructor(name){
  3.         this.name=name;
  4.       }
  5.       showMe(){
  6.         console.log("Hello. My name is "+this.name);
  7.       }
  8.     }

  9.     class Me extends Person{}  //extends 继承 Person

  10.     let me=new Me("Tian");
  11.     me.showMe();
复制代码


覆盖父类的属性方法 super
可能会存在和父类同名的方法 这个时候就可以使用super函数
super(args...)
super可以作为传参到父类的函数 也可以作为对象调用父类的方法
子类的constructor 必须加入super

例子:
  1. class Person{
  2.       constructor(name){ //这边的name来自子类super传过来的
  3.         this.name=name;
  4.       }
  5.       showMe(){
  6.         console.log("Hello. My name is "+this.name);
  7.       }
  8.     }

  9.     class Me extends Person{ //extends 继承 Person
  10.       constructor(name,job){
  11.         super(name); //传参到父类
  12.         this.name=name;
  13.         this.job=job;
  14.       }
  15.       showMe(){
  16.         super.showMe(); //super也可以作为对象调用父类的方法
  17.         console.log(`Hello. My job is ${this.job}`);
  18.       }
  19.     }  

  20.     let me=new Me("Tian","Student");
  21.     me.showMe();
复制代码



您需要登录后才可以回帖 登录 | 入住社区

本版积分规则

Archiver|手机版|小黑屋|Deaf community

GMT+8, 2018-12-12 20:31 , Processed in 0.107398 second(s), 18 queries .

Powered by Discuz! X3.4© 2001-2017 Comsenz Inc. Template design by Penday

快速回复 返回顶部 返回列表