博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
js类的继承,es5和es6的方法
阅读量:4597 次
发布时间:2019-06-09

本文共 1459 字,大约阅读时间需要 4 分钟。

存在的差异:

1. 私有数据继承差异
  es5:执行父级构造函数并且将this指向子级
  es6:在构造函数内部执行super方法,系统会自动执行父级,并将this指向子级
2. 共有数据(原型链方法)继承的差异
  es5:子级原型链上的赋值,继承父级原型链上数据
  es6:extend 父级,会自动将父级原型链上的数据给子级
3. 原型链上的共有数据是否可枚举for in
  es5:可以枚举
  es6:不可枚举
4. 构造函数的指向
  es5:需要改变constructor的指向
  es6:不需要改
5. 静态方法的写法差异
  es5:直接在构造函数.静态方法
  es6:static a=1;静态方法——浏览器不支持,要用bable
6. 实例_proto_的指向差异
  es5:ƒ Child5(name)
  es6:class Child6

 

es6的优点:

  Class在语法上面更加贴近面向对象的写法;

  Class实现继承更加易读、易理解;

  更易于写Java后端等语言的使用;

  ****本质还是语法糖,使用prototype。

 

 

es5的方法

//父级    function  Parent5(name) {
//构造函数 this.name=name;//私有数据 } Parent5.prototype.say=function () {
//公共数据 console.log(this.name); } //子级 function Child5(name) {
//构造函数 Parent5.call(this,name)//执行父级的构造函数,并将this指向子级 } Child5.prototype=new Parent5;//将父级原型上的共有数据给自己 Child5.prototype.constructor=Child5;//改变constructor的指向问题 Child5.prototype.buy=function () { console.log('buy'); } var c5=new Child5('邵');//实例 c5.say()//邵 c5.buy()//buy

 

 

es6的方法

//父级    class Parent6{
//类 constructor(name){
//构造函数 this.name=name; } say(){ console.log(this.name); } } class Child6 extends Parent6{
//将父级原型上的共有数据给自己 constructor(name){ super(name);//执行父级的构造函数,并将this指向子级 } buy(){ console.log('buy') } } var c6=new Child6('邵'); c6.say()//邵 c6.buy()//buy

 

转载于:https://www.cnblogs.com/shaokevin/p/9789950.html

你可能感兴趣的文章
esp32-智能语音-cli(调试交互命令)
查看>>
netty与MQ使用心得
查看>>
关于dl dt dd 文字过长换行在移动端显示对齐的探讨总结
查看>>
swoolefy PHP的异步、并行、高性能网络通信引擎内置了Http/WebSocket服务器端/客户端...
查看>>
Python学习笔记
查看>>
unshift()与shift()
查看>>
使用 NPOI 、aspose实现execl模板公式计算
查看>>
行为型模式:中介者模式
查看>>
How to Notify Command to evaluate in mvvmlight
查看>>
33. Search in Rotated Sorted Array
查看>>
461. Hamming Distance
查看>>
Python垃圾回收机制详解
查看>>
{面试题1: 赋值运算符函数}
查看>>
Node中没搞明白require和import,你会被坑的很惨
查看>>
Python 标识符
查看>>
Python mysql 创建连接
查看>>
企业化的性能测试简述---如何设计性能测试方案
查看>>
centos7 安装中文编码
查看>>
POJ - 3683 Priest John's Busiest Day
查看>>
正则表达式start(),end(),group()方法
查看>>