您当前的位置: 首页 >  童心同萌

ES6类的引入

童心同萌 发布时间:2019-09-20 17:18:02 ,浏览量:4

旧方式:ES5中通过创建构造器,然后将方法指派到该构造器原型的方式模仿类结构,这称为自定义类型,这是ES6类的出发点

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

新方式:类声明写法

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

新方式:类表达式写法-->匿名类表达式

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

新方式:类表达式写法-->具名类表达式

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

类是一级公民:可以被当作值使用-->可以作为参数传递,可以作为返回值,可以给变量赋值

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

立即调用类构造器实现单例:定义一个匿名类,只用来创建一个对象就没用了

 watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

类的属性和get,set方法

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

类的方法名可以为变量

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70 

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

类的生成器:调用生成器,返回迭代器

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

使用Symbol.iterator自定义生成器,使自定义类具有默认迭代器

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

旧方式:定义类的静态方法

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

新方式:定义类的静态方法

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

旧方式:类的继承

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

新方式:类的继承

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

子类可以重写父类中的方法

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

子类方法中可以通过super调用父类中的方法

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

子类可以继承父类的静态成员

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

父类可以是表达式:只要表达式返回值具有构造函数和方法原型即可

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

类的多继承:可以通过如下方式实现

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

旧方式:不支持继承数组

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

新方式:支持继承数组

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

子类继承Array,ArrayBuffer,Map,Promise,RegExp,Set,类型化数组 这些内置类作为父类时,当子类对象调
用从父类继承来的方法时,返回值的类型都是子类的类型(这是不符合预期的,比如子类继承数组,子类对象调用继承
来的slice()方法时,本来想返回一个数组类型的结果,但实际返回的却是子类的类型)

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

上面现象的原因是因为,这些内置类的Symbol.species属性的get方法,返回值都是this,这些内置类都是类似下
面这样定义的,子类继承了父类的Symbol.species属性的get方法,返回this时返回的就是子类对象了

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

根据上面分析,子类继承了父类的Symbol.species属性的get方法返回的是this,我们只需要在子类中重写父类的
这个方法,让其返回父类型就可以了

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

构造函数中,new.target为当前类型的情况:通过new调用构造函数

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

构造函数中,new.target为子类型的情况:子类中通过super调用父类构造函数

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

new.target可以实现抽象类的效果:只能被继承,不可以new实例化对象

watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3Rvbmd4aW5fdG9uZ21lbmc=,size_16,color_FFFFFF,t_70

类的构造函数被调用时,必须使用new,否则报错,这可以防止将类作为函数调用

 

 

关注
打赏
1688896170
查看更多评论

童心同萌

暂无认证

  • 4浏览

    0关注

    87博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文
立即登录/注册

微信扫码登录

0.0474s