ES6里class杂乱随笔
这是一篇乱七八糟的随笔。
class是ES6新增的特性,用于解决JavaScript没有类的困惑。
--杂谈
ES5及之前,类都是用函数来替代,包括实例。
如:
1 function Person(name) {
2 // this指向实例
3 this.name = name
4 this,,log = function () {
5 console.log('name is ' + name)
6 }
7 }
8
9 // 或者
10 Person.prototype.changeName = function (name) {
11 this.name = name
12 console.log('new name is ' + name)
13 }
14
15 var p = new Person(‘zhangsan’)
16 p.name // zhangsan
17 p.log() // name is zhangsan
18 p.changeName('lisi') // new name is Lisi
class本质上是function的语法糖,不过class的写法更加清晰可见,也更符合面向对象。
由于本质是语法糖,所以偶尔会遇到比如Class转function,function转Class的题目
上面转为class代码如下
1 class Person {
2 // constructor是类的构造函数
3 constructor (name) {
4 this.name = name
5 }
6 log () {
7 console.log(`name is ${this.name}`)
8 }
9 changeName(name) {
10 this.name = name
11 console.log(`new name is ${this.name}`)
12 }
13 }
14
15
16 var p = new Person('zhangsan'); // 上同
相比函数来声明更加清晰易懂。
class本质也是函数
typeof Person // functionA
类的所有方法都定义在prototype上面
所有上诉的类其实等同于下
Person,prototype = {
log () {...},
changeName(name) {...}
}
类里的内容,除非使用this来表示,则表示内容在实例上,否则都是属于类。
实例在调用方法时候,其实就是调用类上面的原型方法。
p.constructor === Person.prototype.constructor
// p 表示Person的实例
p.hasOwnProperty('name') // true
p.hasOwnProperty('log') // false
p.__proto__.hasOwnProperty('log') // true
类的所有实例共享一个原型对象,所以
p1.__proto__ = p2.__proto__
还可以通过__proto__来增加类的方法
p.__proto__.printName = function () { return this.name };zha
当然这样声明不好,会使得逻辑变得混乱,增加的时候也需要很谨慎,同时不方便管理
-- 其他
class还有许多新的特性,比如支持getter和setter
如:
get 和 set
静态属性,静态方法(只能在类内部使用)
私有属性,通过 # 来声明,如 #count
本来想写许多,想想还是不用记录那么多,主要用于作于记录之用,需要详细还是阅读ES6比较轻松。
一个热爱编程的猴子,感谢与你相遇。
知识就像海洋,搁浅都不一定能见到彼岸。
共勉。
ES6里class杂乱随笔的更多相关文章
- 进阶路上有你我-相互相持篇之ES6里箭头函数里的this指向问题
首先复习下普通函数里的this指向: function test(){ console.log(this) } test() 你会秒杀的毫无疑问的回答:window,针对普通函数:谁调用了函数 函数 ...
- es6里class类
/** * Created by issuser on 2018/11/27. *///如果静态方法包含this关键字,这个this指的是类,而不是实例./** (1)类的实例属性 1.类的实例属性可 ...
- ES6里关于类的拓展(一)
大多数面向对象的编程语言都支持类和类继承的特性,而JS却不支持这些特性,只能通过其他方法定义并关联多个相似的对象,这种状态一直延续到了ES5.由于类似的库层出不穷,最终还是在ECMAScript 6中 ...
- ES6里关于作用域的拓展:块级作用域
过去,javascript缺乏块级作用域,var声明时的声明提升.属性变量等行为让人困惑.ES6的新语法可以帮助我们更好地控制作用域. 一.var声明 1.变量提升:var声明会发生“变量提升”现象, ...
- ES6里关于函数的拓展(三)
一.箭头函数 在ES6中,箭头函数是其中最有趣的新增特性.顾名思义,箭头函数是一种使用箭头(=>)定义函数的新语法,但是它与传统的JS函数有些许不同,主要集中在以下方面: 1.没有this.su ...
- ES6里关于函数的拓展(二)
一.构造函数 Function构造函数是JS语法中很少被用到的一部分,通常我们用它来动态创建新的函数.这种构造函数接受字符串形式的参数,分别为函数参数及函数体 var add = new Functi ...
- ES6里关于模板字面量的拓展
JS 的字符串相对其他语言来说功能总是有限的,事实上,ES5中一直缺乏许多特性,如多行字符串.字符串格式化.HTML转义等.ES6通过模板字面量的方式进行了填补,模板字面量试着跳出JS已有的字符串体系 ...
- es6里面的arr方法
es6里面,关于arr的遍历以及查找,新增了很多的方法,对于不同的应用场景,运用合适的方法,可以达到事半功倍的效果: 一, arr.find():用于查找到符合条件的第一个成员,如果没有查找到的话,则 ...
- ES6里新添加了两个很好用的东西,set和Array.from。
set是一种新的数据结构,它可以接收一个数组或者是类数组对象,自动去重其中的重复项目. 在这我们可以看见,重复的项目已经被去掉了,包括NaN.正常情况下,NaN === NaN 返回的是false,但 ...
随机推荐
- Spring--AOP的见解
AOP是指面向切面编程,与JAVA中的动态代理有很深的渊源. 在使用Spring框架时,AOP编程能简化很多繁杂的步骤,精简代码. 切面:横切关注点(跨越程序中多个模块的功能),被模块化的特殊对象,也 ...
- spark源码分析, 任务提交及序列化
简易基本流程图如下 1. org.apache.spark.scheduler.DAGScheduler#submitMissingTasks 2. => org.apache.spark.sc ...
- @lookup注解的使用
背景,如果有一个类C,需要用到类B,如果使用@Autowired注解注入B,那么B每次调用都是同一个对象,即使B不是单例的,现在我希望每次调用B都是不一样的,那么实现方案有2个: 方案A : 每次从容 ...
- 【FastDFS】SpringBoot整合FastDFS实战,我只看这一篇!!
写在前面 在<[FastDFS]小伙伴们说在CentOS 8服务器上搭建FastDFS环境总报错?>和<[FastDFS]面试官:如何实现文件的大规模分布式存储?(全程实战)> ...
- log4net 纯代码配置
当需要输出的日志很多的时候,每次修改config都很麻烦,于是想可不可以动态生成. 网上找的案例都是获取单个appender/logger的,此处例子是任意logger,appender相同 log4 ...
- Maven环境搭建及常用命令、生命周期
一.下载maven包,解压 二.配置环境变量,MAVEN_PATH=解压路径 添加到path中 三.测试 mvn -v 查看maven版本 四.设置本地仓库的路径 在conf文件夹下的setting ...
- “工程师思维” VS. “学院派思维”
1.与"工程师"交流,他们致力于"更快.高质量"交付,他们会借助时下最稳定.最完善的中间件或者框架,他们更谦虚,喜欢和志同道合的朋友交流分享协作,视角更宽,往往 ...
- 057 01 Android 零基础入门 01 Java基础语法 06 Java一维数组 04 案例:求整型数组的数组元素的元素值累加和
057 01 Android 零基础入门 01 Java基础语法 06 Java一维数组 04 案例:求整型数组的数组元素的元素值累加和 本文知识点:求整型数组的数组元素的元素值累加和 案例:求整型数 ...
- shell-的特殊变量-进程状态变量$$ $! $? $_详解
一:shell的特殊变量-进程状态变量详解 1. 进程状态变量 $$ 获取当前shell的进程号(pid) $! 执行上一个指令的pid,上一个后台运行进程的进程号 $? 获取执行上一个指令的返回值 ...
- JAVA对象头详解(含32位虚拟机与64位虚拟机)
为什么要学习Java对象头 学习Java对象头主要是为了解synchronized底层原理,synchronized锁升级过程,Java并发编程等. JAVA对象头 由于Java面向对象的思想,在JV ...