es6中的类及es5类的实现
目录
- 类的特点
类的特点
1.类只能通过new得到
在es6中类的使用只能是通过new,如果你将它作为一个函数执行,将会报错。
//es6的写法
class Child {constructor() {this.name = 1;}
}
let child = new Child();
console.log(child.name)//1
//如果直接方法调用的形式,会报错
let child = Child();//Class constructor Child cannot be invoked without 'new'
es5中的class其实就是一个方法,没有关键字class
//es5中类的写法,但是这样直接用方法名调用并不会报错
var Person = (function () {function Person(name) {this.name = name;}Person.prototype.SayHello = function () {window.alert("My name is " + this.name + ".");};return Person;
})();
var p = Person()//不报错
为了实现类似于es6中的调用检查,我们需要自己手写一个调用检查的函数。这个函数的原理就是用当前的this和构造函数进行比较,如果这个this指向的window,那么可以看出是用通过方法名直接调用的,如果this是构造函数那么就是通过new得到的
var Person = (function () {
//类的调用检测function _classCheck(instance, constructor) {if (!(instance instanceof constructor)) {throw new Error('Class constructor Child cannot be invoked without new')}}function Person(name) {this.name = name;_classCheck(this, Person)}Person.prototype.SayHello = function () {window.alert("My name is " + this.name + ".");};return Person;
})();
var p = Person()
子类会继承父类的公有属性和静态方法
es6中的写法
//es6中的写法
class Child extends Person {constructor() {super()this.name = 1;}
}
//es5中的写法
var Clild = (function (Person) {
//类的调用检测function _classCheck(instance, constructor) {if (!(instance instanceof constructor)) {throw new Error('Class constructor Child cannot be invoked without new')}}
//子类继承父类的方法function _inherins(subclass, superclass) {subclass.prototype = Object.create(superclass.prototype, { constructor: { value: subclass } })Object.setPrototypeOf(subclass, superclass)}_inherins(Clild, Person)function Clild() {let obj=Person.call(this)//子类继承私有属性let that=this;if(typeof obj=='object'){that=obj}that.name=1;//解决了父类是引用类型的问题_classCheck(this, Clild)return that}
return Clild;
})(Person);
转载于:https://www.cnblogs.com/hanqingtao/p/9957043.html
es6中的类及es5类的实现相关推荐
- ES5和ES6中对于继承的实现方法
在ES5继承的实现非常有趣的,由于没有传统面向对象类的概念,Javascript利用原型链的特性来实现继承,这其中有很多的属性指向和需要注意的地方. 原型链的特点和实现已经在之前的一篇整理说过了,就是 ...
- ES5和ES6中的this指向
ES5和ES6中的this指向 ES5: 1.在普通函数中,this指向的是函数调用者,默认情况下,this指向的是window 2.在严格模式下,如果没有直接调用者,在函数中,this的值为unde ...
- 关于协程和 ES6 中的 Generator
关于协程和 ES6 中的 Generator 什么是协程? 进程和线程 众所周知,进程和线程都是一个时间段的描述,是CPU工作时间段的描述,不过是颗粒大小不同,进程是 CPU 资源分配的最小单位,线程 ...
- ES6构造函数class语法与ES5构造函数语法
这段时间在逆战班学习了面向对象相关内容,其中关于构造函数的两种语法我这里说一下. 1.ES5构造函数语法 (1)什么是构造函数呢? 构造函数就是一种专门用于生成对象的函数,通过构造函数生成的对象称为实 ...
- android person类_es5 类与es6中class的区别小结_javascript技巧
这篇文章主要给大家介绍了关于es5 类与es6中class区别的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧 前言 在 ...
- 【JS(ES6,ES5类的创建及继承)】
目录 一.ES6的面向对象的语法(ES6创建类) 1.面向过程(了解) 2.面向对象 3.面向对象的特征 4.ECMAScript6(即ES6)的面向对象的语法 5.练习 二.ES6中类的继承 三.E ...
- (语法糖)ES6类class声明类的方式 -ES5类声明继承
本文将从以下几方面介绍类与继承 类的声明与实例化 如何实现继承 继承的几种方式 类的声明与实例化 类的声明一般有两种方式 // es5和es6声明类的区别,es5没有统一语法规范.es6有统一写法规范 ...
- es6 class类与class类中constructor
序言 在es6 中的class关键字用于声明类,在此之前js一直没有类的概念,本文只要讨论class的与es5中对象的关系以及class中constructor的作用 关键字class ES6 的cl ...
- 33 ES6中的类和对象
技术交流QQ群:1027579432,欢迎你的加入! 欢迎关注我的微信公众号:CurryCoder的程序人生 1.面向对象 面向对象的思维特点: a.抽取(抽象)对象共有的属性和行为组织(封装)成一个 ...
最新文章
- Web漏洞扫描(四:知识点及错误总结)
- 052_Drawer抽屉
- KVO-基本使用方法-底层原理探究-自定义KVO-对容器类的监听
- InstallShild的研究,msde2000,.netframwork,ScriptProject与ScriiptMSIProject的区别
- tcp 组播_华为组播理论知识详解(二)
- 阿里云大学python_阿里云大学「学习路线」,一站式从入门到高手——Python、Java、前端、运维、数据库、云原生……...
- day10 Python 形参顺序
- Chrome/360极速/猎豹/枫树/浏览器去除视频网站广告利器插件——【切糕】广告视频屏蔽专家下载...
- Python内置容器(2)——字典,迭代器,列表解析
- 基于springboot小区物业管理系统
- 弘辽科技:新品直通车怎么选词?怎样测试人群标签?
- yate--sip server的学习过程
- JSCH连接SFTP Algorithm negotiation fail
- vue实现60秒倒计时
- 系统策略禁止安装此设备。请与系统管理员联系-解决方案
- 蝙蝠聊天软件显示无法连接服务器失败,蝙蝠聊天软件为什么没有来信息提示音?...
- Qt程序在arm板上运行
- JS实现简易ATM机
- js获取上个月今天或下个月今天
- arm平台进行c语言编译
热门文章
- Debian Linux 的 vim 如何使用系统剪贴板
- java 快速io_Java编程在ICPC快速IO实现源码
- linux 远程备份mysql数据库_使用脚本自动化远程备份MySQL数据库
- python导入模块报错_Python 导入上层目录模块报错
- @select注解_Mybatis基本知识十七:Mybatis注解式开发-单表注解式开发
- 计算机应用基础人才培养方案,1. 培养方案(计算机应用基础课程).doc
- python中字符编码使用_python中字符编码是什么?如何转换字符?
- 工业以太网的优点有哪些?
- 工业交换机单纤或双纤都只是占用一个端口吗?
- 【渝粤教育】国家开放大学2018年春季 0529-21T高级英语阅读(1) 参考试题