近期的生活,是一种非常规的模式。
自己一方面期待着什么时候能自由地活动;另一方面也想着成年以来,第一次能有这么长时间陪着父母,挺好。
今天我们继续将《你不知道的js (下卷)》读完,下面开始。
ES?现在与未来
版本
2009年,ES5正式发布
2015年,ES6发布
有人建议未来的版本应该改成基于年份,比如ES2016(也就是ES7)来标示在2016年结束之前敲定的任何版本的规范。
尽管有异议,但比起后来提出的方案ES2015,很可能保持统治地位的版本命名仍是ES6。
而ES2016可能会采用新的基于年份的命名方案。
transpiling
简单地说,其思路是利用专门的工具把你的ES6代码转化为等价(或近似!)的可以在ES5环境下工作的代码。
新语法
块作用域声明
let, const声明,我在之前的文章做了比较。
这里就不再记录了。
spread/rest
1 | function foo(x, y, z) { |
这种用法最好的一点是,它为弃用很久的arguments数组 —— 实际上它并不是真正的数组,而是类似数组的对象——提供了一个非常可靠的替代形式。
因为args是一个真正的数组,前ES6中有很多技巧用来把arguments转变为某种我们可以当作数组来使用的东西,现在我们可以摆脱这些愚蠢的技巧了。
考虑:
1 | // 按照新的 ES6 的行为方式实现 |
默认参数值
1 | function foo(x=11, y=31) { |
函数默认值可以不只是像31这样的简单值;它们可以是任意合法表达式,甚至是函数调用。
1 | function bar(val) { |
解构
可以把将数组或者对象属性中带索引的值手动赋值看作结构化赋值。
ES6为解构新增了一个专门语法,专用于数组解构和对象解构。
这个语法消除了前面代码中对临时变量tmp的需求,使代码简洁很多。
1 | var [a, b, c] = foo() |
对象属性赋值模式
1 | // 使用了 source: target |
这里的语法模式是souce: target
(或者说是value:variable-alias)。
x: bam表示x属性是源值,而bam是要赋值的目标变量。
换句话说,对象字面值是target <–source,而对象解构赋值是source –> target。
不只是声明
1 | var a = 10, y = 20 |
重复赋值
对象解构形式允许多次列出同一个源属性(持有值类型任意)。举例来说:
1 | var { a: X, a: Y } = { a: 1 } |
这也意味着可以解构子对象/数组属性,同时捕获子对象/类的值本身。
1 | var { a: { x: X, x: Y}, a } = { a: { x: 1 } } |
记住:解构的目的不只是为了打字更少,而是为了可读性更强。
太多,太少,刚刚好
1 | var a = [2, 3, 4] |
默认值赋值
1 | var { x, y, z, w: WW =20} = bar() |
嵌套解构
1 | var a1 = [1, [2, 3, 4], 5] |
解构参数
1 | function foo([x, y]) { |
对象字面量扩展
简洁属性
1 | { |
简洁方法
1 | { |
模板字面量
1 | var name = 'aaa' |
箭头函数
虽然不是一条严格的规律,但我认为=>箭头函数转变带来的可读性提升与被转化函数的长度负相关。
这个函数越长,=>带来的好处就越小;函数越短,=>带来的好处就越大。
我认为更合理的做法是只在确实需要简短的在线函数表达式的时候才采用=>,而对于那些一般长度的函数则无需改变。
不只是更短的语法,而是this
实际上,=>箭头函数的主要设计目的就是以特定的方式改变this的行为特性,解决this相关编码的一个特殊而又常见的痛点。
for..of循环
1 | var a = ['a', 'b', 'c'] |
正则表达式
数字字面量扩展
Unicode
symbol
下面是创建symbol的过程:
1 | var sym = Symbol('some optional description') |
以下几点需要注意。
- 不能也不应该对Symbol(..)使用new。它并不是一个构造器,也不会创建一个对象。
- 传给Symbol(..)的参数是可选的。如果传入了的话,应该是一个为这个symbol的用途给出用户友好描述的字符串。
- typeof的输出是一个新的值(“symbol”),这是识别symbol的首选方法。
- 本文作者: Jambo
- 版权声明: 本作品采用 知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议 进行许可。转载请注明出处!