ECMAScript 6（简称ES6）是于2015年6月正式发布的JavaScript语言的标准，正式名为ECMAScript 2015（ES2015）。它的目标是使得JavaScript语言可以用来编写复杂的大型应用程序，成为企业级开发语言。
常量
const PIE = 3.14;
箭头函数：
- 箭头函数没有自己的this，它的this是继承而来; 默认指向在定义它时所处的对象(宿主对象)，而不是执行时的对象，定义它的时候，可能环境是window。
- 箭头函数可以方便地让我们在 setTimeout ,setInterval中方便的使用this
() => {//括号内放参数（若参数只有一个，括号可以省略）
//若函数内命令行只有一条，会作为函数的返回值）
}
let evens = [1, 2, 3, 4, 5];
let odds = evens.map(v => v + 1);
默认参数：
function f(x = 1, y = 2, z = 3){
return x + y + z;
}
可变参数：
function f(...arg){
var sum = 0;
arg.forEach(item => {// 遍历参数并相加
sum += item;
})
return sum;
}
f(1, 2, 3);// 调用
合并数组：
var arr_1 = [1, 2, 3];
var arr_2 = ['a', 'b', 'c', ...params1];
对象词法扩展：
function getCar(make, model, value) {
return {
// 简写变量
make, // 等同于 make: make
model, // 等同于 model: model
value, // 等同于 value: value
// 属性可以使用表达式计算值
['make' + make]: true,
// 忽略 `function` 关键词简写对象函数
depreciate () {
this.value -= 2500;
}
};
}
let car = getCar('Barret', 'Lee', 40000);
// 输出结果：
// {
// make: 'Barret',
// model:'Lee',
// value: 40000,
// makeKia: true,
// depreciate: function()
// }
二进制和八进制字面量：
ES6 支持二进制和八进制的字面量，通过在数字前面添加 0o 或者0O 即可将其转换为八进制值
let oValue = 0o10;
console.log(oValue); // 8
let bValue = 0b10; // 二进制使用 `0b` 或者 `0B`
console.log(bValue); // 2
对象和数组解构：
解构可以避免在对象赋值时产生中间变量
// 数组解构
function foo() {
return [1, 2, 3];
}
let [a, b, c] = foo();
console.log(a, b, c); // 1 2 3
// 对象解构
function bar() {
return {
x: 4,
y: 5,
z: 6
};
}
let {x: x, y: y, z: z} = bar();
console.log(x, y, z); // 4 5 6
对象超类：
var parent = {
foo () {
console.log("Hello from the Parent");
}
}
var child = {
foo () {
super.foo();
console.log("Hello from the Child");
}
}
Object.setPrototypeOf(child, parent);
child.foo();
// 输出结果：
// Hello from the Parent
// Hello from the Child
模板语法和分隔符：
let user = 'John';
console.log(`Hi ${user}!`); // Hi John!
for...of：
let nicknames = ['Dido', 'Vava', 'Sandy'];
nicknames.size = 3;
for (let nickname of nicknames) {
console.log(nickname);// Dido, Vava, Sandy
}
Map 和 WeakMap：
- ES6 中两种新的数据结构集：Map 和 WeakMap。事实上每个对象都可以看作是一个 Map
- 一个对象由多个 key-value 对构成，在 Map 中，任何类型都可以作为对象的 key
Map:
var myMap = new Map();
var keyString = "a string",
keyObj = {},
keyFunc = function () {};
// 设置值
myMap.set(keyString, "value 与 'a string' 关联");
myMap.set(keyObj, "value 与 keyObj 关联");
myMap.set(keyFunc, "value 与 keyFunc 关联");
myMap.size; // 3
// 获取值
myMap.get(keyString); // "value 与 'a string' 关联"
myMap.get(keyObj); // "value 与 keyObj 关联"
myMap.get(keyFunc); // "value 与 keyFunc 关联"
WeakMap:
- WeakMap 就是一个 Map，只不过它的所有 key 都是弱引用，意思就是 WeakMap 中的东西垃圾回收时不考虑，使用它不用担心内存泄漏问题。
- WeakMap 的所有 key 必须是对象。它只有四个方法 delete(key), has(key), get(key) 和set(key, val)
let w = new WeakMap();
w.set('a', 'b');
// 会报错：Uncaught TypeError: Invalid value used as weak map key
var o1 = {},
o2 = function(){},
o3 = window;
w.set(o1, 37);
w.set(o2, "azerty");
w.set(o3, undefined);
w.get(o3); // undefined
w.has(o1); // true
w.delete(o1);
w.has(o1); // false
Set 和 WeakSet：
- Set 对象是一组不重复的值，重复的值将被忽略，值类型可以是原始类型和引用类型：
- WeakSet 对象可以让你在一个集合中保存对象的弱引用，在 WeakSet 中的对象只允许出现一次
// Set
let mySet = new Set([1, 1, 2, 2, 3, 3]);
mySet.size; // 3
mySet.has(1); // true
mySet.add('strings');
mySet.add({ a: 1, b:2 });
mySet.forEach(item => {
console.log(item);
});
// 输出结果：
// 1
// 2
// 3
// 'strings'
// Object { a: 1, b: 2 }
Set 同样有 delete() 和 clear() 方法。
// WeakSet
var ws = new WeakSet();
var obj = {};
var foo = {};
ws.add(window);
ws.add(obj);
ws.has(window); // true
ws.has(foo); // false, foo 没有添加成功
ws.delete(window); // 从结合中删除 window 对象
ws.has(window); // false, window 对象已经被删除
类：
ES6 中有 class 语法。值得注意是，这里的 class 不是新的对象继承模型，它只是原型链的语法糖表现形式。
class Task {
constructor () {
console.log("task instantiated!");
}
showId () {
console.log(23);
}
static loadAll () {
console.log("Loading all tasks..");
}
}
console.log(typeof Task); // function
let task = new Task(); // "task instantiated!"
task.showId(); // 23
Task.loadAll(); // "Loading all tasks.."
类中的继承和超集：
class Car {
constructor() {
console.log("Creating a new car");
}
}
class Porsche extends Car {
constructor() {
super();
console.log("Creating Porsche");
}
}
let c = new Porsche();
// 输出结果：
// Creating a new car
// Creating Porsche
- extends 允许一个子类继承父类，需要注意的是，子类的constructor 函数中需要执行 super() 函数，当然，你也可以在子类方法中调用父类的方法，如super.parentMethodName()
- 类的声明不会提升（hoisting)，如果你要使用某个 Class，那你必须在使用之前定义它，否则会抛出一个 ReferenceError 的错误
- 在类中定义函数不需要使用 function 关键词
Symbol
Symbol 是一种新的数据类型，它的值是唯一的，不可变的。ES6 中提出 symbol 的目的是为了生成一个唯一的标识符，不过你访问不到这个标识符
var sym = Symbol( "some optional description" );
console.log(typeof sym); // symbol
注意：这里 Symbol 前面不能使用 new 操作符，如果它被用作一个对象的属性，那么这个属性会是不可枚举的。
var o = {
val: 10,
[ Symbol("random") ]: "I'm a symbol",
};
console.log(Object.getOwnPropertyNames(o)); // val
如果要获取对象 symbol 属性，需要使用Object.getOwnPropertySymbols(o)。
迭代器（Iterators）：
- 迭代器允许每次访问数据集合的一个元素，当指针指向数据集合最后一个元素是，迭代器便会退出。它提供了 next() 函数来遍历一个序列，这个方法返回一个包含 done 和 value 属性的对象。
- ES6 中可以通过 Symbol.iterator 给对象设置默认的遍历器，无论什么时候对象需要被遍历，执行它的 @@iterator 方法便可以返回一个用于获取值的迭代器。
- 数组默认就是一个迭代器
var arr = [11,12,13];
var itr = arr[Symbol.iterator]();
itr.next(); // { value: 11, done: false }
itr.next(); // { value: 12, done: false }
itr.next(); // { value: 13, done: false }
itr.next(); // { value: undefined, done: true }
你可以通过 Symbol.iterator 自定义一个对象的迭代器。
Generators：
Generator 函数是 ES6 的新特性，它允许一个函数返回的可遍历对象生成多个值。
在使用中你会看到 * 语法和一个新的关键词 yield:
function *infiniteNumbers() {
var n = 1;
while (true){
yield n++;
}
}
var numbers = infiniteNumbers(); // returns an iterable object
numbers.next(); // { value: 1, done: false }
numbers.next(); // { value: 2, done: false }
numbers.next(); // { value: 3, done: false }
Promises：
ES6 对 Promise 有了原生的支持，一个 Promise 是一个等待被异步执行的对象，当它执行完成后，其状态会变成 resolved 或者rejected。
var p = new Promise(function(resolve, reject) {
if (/* condition */) {
// fulfilled successfully
resolve(/* value */);
} else {
// error, rejected
reject(/* reason */);
}
});
每一个 Promise 都有一个 .then 方法，这个方法接受两个参数，第一个是处理 resolved 状态的回调，一个是处理 rejected 状态的回调：
p.then(val => console.log("Promise Resolved", val),
err => console.log("Promise Rejected", err));
注意事项：
- let 关键词声明的变量不具备变量提升（hoisting）特性
- let 和 const 声明只在最靠近的一个块中（花括号内）有效
- 当使用常量 const 声明时，请使用大写变量，如：CAPITAL_CASING
- const 在声明时必须被赋值
网友评论