1
0
mirror of https://github.com/ruanyf/es6tutorial.git synced 2025-05-24 18:32:22 +00:00
This commit is contained in:
ruanyf 2015-09-05 10:46:59 +08:00
parent ae9f668caa
commit 1b550c7627
4 changed files with 79 additions and 8 deletions

View File

@ -39,7 +39,7 @@ class Point {
上面代码定义了一个“类”可以看到里面有一个constructor方法这就是构造方法而this关键字则代表实例对象。也就是说ES5的构造函数Point对应ES6的Point类的构造方法。
Point类除了构造方法还定义了一个toString方法。注意定义“类”的方法的时候前面不需要加上function这个保留字直接把函数定义放进去了就可以了。
Point类除了构造方法还定义了一个toString方法。注意定义“类”的方法的时候前面不需要加上function这个保留字直接把函数定义放进去了就可以了。另外,方法之间不需要逗号分隔,加了会报错。
ES6的类完全可以看作构造函数的另一种写法。

View File

@ -55,7 +55,7 @@ a[6](); // 6
### 不存在变量提升
let不像var那样会发生“变量提升”现象。
`let`不像`var`那样,会发生“变量提升”现象。
```javascript
function do_something() {
@ -64,9 +64,9 @@ function do_something() {
}
```
上面代码在声明foo之前就使用这个变量结果会抛出一个错误。
上面代码在声明`foo`之前,就使用这个变量,结果会抛出一个错误。
这也意味着typeof不再是一个百分之百安全的操作。
这也意味着`typeof`不再是一个百分之百安全的操作。
```javascript
if (1) {
@ -75,7 +75,9 @@ if (1) {
}
```
上面代码中由于块级作用域内typeof运行时x还没有值所以会抛出一个ReferenceError。
上面代码中由于块级作用域内typeof运行时x还没有值所以会抛出一个`ReferenceError`
### 暂时性死区
只要块级作用域内存在let命令它所声明的变量就“绑定”binding这个区域不再受外部的影响。
@ -137,7 +139,6 @@ bar();
上面代码中函数bar的参数func默认是一个匿名函数返回值为变量foo。这个匿名函数的作用域就不是bar。这个匿名函数声明时是处在外层作用域所以内部的foo指向函数体外的声明输出outer。它实际上等同于下面的代码。
```javascript
let foo = 'outer';
let f = x => foo;
@ -150,6 +151,10 @@ function bar(func = f) {
bar();
```
ES6规定暂时性死区和不存在变量提升主要是为了减少运行时错误防止在变量声明前就使用这个变量从而导致意料之外的行为。这样的错误在ES5是很常见的现在有了这种规定避免此类错误就很容易了。
总之,暂时性死区的本质就是,只要一进入当前作用域,所要使用的变量就已经存在了,但是不可获取,只有等到声明变量的那一行代码出现,才可以获取和使用该变量。
### 不允许重复声明
let不允许在相同作用域内重复声明同一个变量。
@ -235,6 +240,31 @@ function f1() {
上面的函数有两个代码块都声明了变量n运行后输出5。这表示外层代码块不受内层代码块的影响。如果使用var定义变量n最后输出的值就是10。
ES6允许块级作用域的任意嵌套。
```javascript
{{{{{let insane = 'Hello World'}}}}};
insane // "Hello World"
```
上面代码使用了一个五层的块级作用域。外层作用域无法读取内层作用域的变量。
```javascript
{{{{
{let insane = 'Hello World'}
console.log(insane); // 报错
}}}};
```
内层作用域可以定义外层作用域的同名变量。
```javascript
{{{{
let insane = 'Hello World';
{let insane = 'Hello World';}
}}}};
```
块级作用域的出现实际上使得获得广泛应用的立即执行匿名函数IIFE不再必要了。
```javascript
@ -267,6 +297,29 @@ function f() { console.log('I am outside!'); }
上面代码在ES5中运行会得到“I am inside!”但是在ES6中运行会得到“I am outside!”。这是因为ES5存在函数提升不管会不会进入if代码块函数声明都会提升到当前作用域的顶部得到执行而ES6支持块级作用域不管会不会进入if代码块其内部声明的函数皆不会影响到作用域的外部。
```javascript
{
let a = 'secret';
function f() {
return a;
}
}
f() // 报错
```
上面代码中,块级作用域外部,无法调用块级作用域内部定义的函数。如果确实需要调用,就要像下面这样处理。
```javascript
let f;
{
let a = 'secret';
f = function () {
return a;
}
}
f() // "secret"
```
需要注意的是如果在严格模式下函数只能在顶层作用域和函数内声明其他情况比如if代码块、循环代码块的声明都会报错。
## const命令
@ -293,10 +346,10 @@ if (true) {
const MAX = 5;
}
// 常量MAX在此处不可得
MAX // Uncaught ReferenceError: MAX is not defined
```
const命令也不存在提升,只能在声明的位置后面使用。
const命令声明的常量不提升,同样存在暂时性死区,只能在声明的位置后面使用。
```javascript
if (true) {

View File

@ -64,6 +64,23 @@ getPoint()
// {x:1, y:10}
```
赋值器和取值器,也可以采用简洁写法。
```javascript
var cart = {
_wheels: 4,
get wheels () {
return this._wheels
},
set wheels (value) {
if (value < this._wheels) {
throw new Error('hey, come back here!')
}
this._wheels = value
}
}
```
## 属性名表达式
JavaScript语言定义对象的属性有两种方法。

View File

@ -31,6 +31,7 @@
- Kyle Simpson, [For and against let](http://davidwalsh.name/for-and-against-let): 讨论let命令的作用域
- kangax, [Why typeof is no longer “safe”](http://es-discourse.com/t/why-typeof-is-no-longer-safe/15): 讨论在块级作用域内let命令的变量声明和赋值的行为
- Axel Rauschmayer, [Variables and scoping in ECMAScript 6](http://www.2ality.com/2015/02/es6-scoping.html): 讨论块级作用域与let和const的行为
- Nicolas Bevacqua, [ES6 Let, Const and the “Temporal Dead Zone” (TDZ) in Depth](http://ponyfoo.com/articles/es6-let-const-and-temporal-dead-zone-in-depth)
## 解构赋值