摘抄至 知乎文章 部分笔记
从数组中获取元素
1
2
3
4
5
| // ES5
var array = [1, 2, 3, 4];
var first = array[0];
var third = array[2];
console.log(first, third); // 1 3
|
等同于：
1
2
3
| const array = [1, 2, 3, 4];
const [first, ,third] = array;
console.log(first, third); // 1 3
|
交换值
1
2
3
4
5
6
7
| // ES5
var a = 1;
var b = 2;
var tmp = a;
a = b;
b = tmp;
console.log(a, b); // 2 1
|
等同于：
1
2
3
4
5
| // ES6
let a = 1;
let b = 2;
[a, b] = [b, a];
console.log(a, b); // 2 1
|
默认参数
1
2
3
4
5
6
7
8
9
10
11
| // ES5
function point(x, y, isFlag){
x = x || 0;
y = y || -1;
isFlag = isFlag || true;
console.log(x,y, isFlag);
}
point(0, 0) // 0 -1 true ?
point(0, 0, false) // 0 -1 true ??
point(1) // 1 -1 true
point() // 0 -1 true
|
Why?
1
2
3
4
5
6
7
8
9
10
11
| // ES5
function point(x, y, isFlag){
x = x || 0;
y = typeof(y) === 'undefined' ? -1 : y;
isFlag = typeof(isFlag) === 'undefined' ? true : isFlag;
console.log(x,y, isFlag);
}
point(0, 0) // 0 0 true
point(0, 0, false) // 0 0 false
point(1) // 1 -1 true
point() // 0 -1 true
|
1
2
3
4
5
6
7
8
| // ES6
function point(x = 0, y = -1, isFlag = true){
console.log(x,y, isFlag);
}
point(0, 0) // 0 0 true
point(0, 0, false) // 0 0 false
point(1) // 1 -1 true
point() // 0 -1 true
|
多个返回值的结构
1
2
3
4
5
6
7
8
9
| // ES5
function margin() {
var left=1, right=2, top=3, bottom=4;
return { left: left, right: right, top: top, bottom: bottom };
}
var data = margin();
var left = data.left;
var bottom = data.bottom;
console.log(left, bottom); // 1 4
|
在第 3 行中，你也可以用一个像这样的数组返回（同时省去了一些编码）：
1
| return [left, right, top, bottom];
|
但另一方面，调用者需要考虑返回数据的顺序。
1
2
| var left = data[0];
var bottom = data[3];
|
用 ES6，调用者只需选择他们需要的数据即可（第 6 行）：
1
2
3
4
5
6
7
8
| // ES6
function margin() {
const left=1, right=2, top=3, bottom=4;
return { left, right, top, bottom };
}
const { left, bottom } = margin();
console.log(left, bottom); // 1 4
|
参数匹配的结构
1
2
3
4
5
6
7
8
| // ES5
var user = {firstName: 'Adrian', lastName: 'Mejia'};
function getFullName(user) {
var firstName = user.firstName;
var lastName = user.lastName;
return firstName + ' ' + lastName;
}
console.log(getFullName(user)); // Adrian Mejia
|
等同于（但更简洁）：注意 ({ firstName, lastName })写法
1
2
3
4
5
6
| // ES6
const user = {firstName: 'Adrian', lastName: 'Mejia'};
function getFullName({ firstName, lastName }) {
return `${firstName} ${lastName}`;
}
console.log(getFullName(user)); // Adrian Mejia
|