目录
ECMAScript6(ES6)
注意:浏览器不一定支持最新的ES6标准。
let命令
var声明的变量只能是全局或者整个函数块的,而let声明的变量作用域被限制在块级中。在处理构造函数时,可通过let声明【而不是闭包】来创建一个或多个私有成员。
示例代码:
function a(){
var i=0;
let j=0;
{
var i=2;
let j=2;
}
console.log(i); //2
console.log(j); //0
}
a();
多行字符串 `...`
示例代码:
var string=`这是一个
多行
字符串`;
多行字符串也可用\n实现。
展开语法 ...
示例代码:
let arr1=[1,2];
let arr2=[...arr1,3];
console.log(arr2); //Array(3) [ 1, 2, 3 ]
let obj={"name1":"小明"};
let obj2={
...obj,
"name2":"大明"
}
console.log(obj2); //Object { name1: "小明", name2: "大明" }
Object.assign
示例代码:
let obj={"name1":"小明"};
let obj2={"name2":"大明"};
Object.assign(obj,obj2,{"name3":"中明"});
console.log(obj); //Object { name1: "小明", name2: "大明", name3: "中明" }
模板字符串 ${name}
示例代码:
var name = '小明';
var age = 20;
console.log(`你好, ${name}, 你今年${age}岁了!`);
多个字符串也可用+号连接。
Map 和 Set
Map是一组键值对的结构,具有极快的查找速度。注意一个key只能对应一个value,如果对一个key重复赋值,后面的值会覆盖前面的值。
Set是一组无重复Key的集合,不存储value。
注意遍历Map和Set不能像Array一样使用下标循环。
Map示例代码:
//var m=new Map();
var m=new Map([['Tom',62],['Bob',90]]);
m.set('Tom',67); //覆盖原Map集合里的TomTom
m.has('Tom'); //是否存在键‘Tom’:true
m.get('Tom'); //67
m.delete('Tom'); //删除键’Tom’
m.get('Tom'); //undefined
console.log(m); //{}
for(var [key,value] of m){
//输出 Bob的年龄是:90岁。
console.log(key+'的年龄是:'+value+'岁。');
}
Set示例代码:
var s1=new Set();
var s2=new Set([1,2,3,3,'3']);// s2为Set {1,2,3,”3”} 注意3和’3’类型不同。
s1.add(4);// s1为Set {4}
s1.add(4);// s1为Set {4},重复添加的key会被过滤。
s2.delete(3);// s2为Set {1,2,”3”}
for(var key of s2){
//依次输出1,2,3
console.log(key);
}
iterable
Array、Map、Set都属于iterable类型。具有iterable类型的集合可以通过新的for ... of 循环来遍历。更好的方式是直接使用iterable内置的forEach方法,它接收一个函数,每次迭代就自动回调该函数。
示例代码:
'use strict';
var a=['A','B'];
// element:指向当前元素的值
// index:指向当前索引
// array:指向Array对象本身
a.forEach(function(element,index,array){
console.log(element+',index = '+index);
});
// A,index = 0
// B,index = 1
注意一个数组被当作对象遍历时,它的每个元素的索引被视为一个属性。for ... in循环遍历的实际上是对象的属性名称。for ... of循环则只循环集合本身的元素。
promise
Promise 对象可用来传递异步操作的消息。
Promise 对象特点
1. 对象的状态不受外界影响。Promise 对象代表一个异步操作,有三种状态:
pending: 初始状态,不是成功或失败状态。
fulfilled: 操作成功完成。
rejected: 操作失败。
只有异步操作的结果,可以决定当前Promise【承诺】对象是哪一种状态,任何其他操作都无法改变这个状态。
2. 一旦状态改变,就不会再变,任何时候都可以得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。
Promise 优缺点
优点:
- 可以通过Promise对象将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数。
- Promise 对象提供统一的接口,使得控制异步操作更加容易。
缺点:
- 无法取消 Promise,一旦新建它就会立即执行,无法中途取消。
- 如果不设置回调函数,Promise 内部抛出的错误,不会反应到外部。
- 当处于 Pending 状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)。
Promise 创建
可使用 new 来调用 Promise 的构造器来进行实例化,创建一个Promise对象。
Promise 构造函数包含一个参数和一个带有 resolve(解析)和 reject(拒绝)两个参数的回调。在回调中执行一些操作(例如异步),如果一切都正常,则调用 resolve,否则调用 reject。
示例代码:
var promise = new Promise(function(resolve, reject) {
// 异步处理
// 处理结束后、调用resolve 或 reject
});
Promise.prototype.then 方法:链式操作
可对promise 对象调用 promise.then() 方法,传递 resolve 和 reject 方法作为回调。
Promise.prototype.then 方法返回的是一个新的 Promise 对象,因此可以采用链式写法。
语法:
promise.then(onFulfilled, onRejected)
promise.then(onFulfilled).catch(onRejected)
resolve 方法的参数除了正常的值以外,还可能是另一个 Promise 实例。而 reject方法的参数通常是 Error 对象的实例。
代码示例:
var p1 = new Promise(function(resolve, reject){
// ... some code
});
var p2 = new Promise(function(resolve, reject){
// ... some code
resolve(p1);
})
上例中,如果p2的resolve方法调用p1时,p1 的状态是 pending,那么 p2 的回调函数就会等待 p1 的状态改变;如果 p1 的状态已经是 fulfilled 或者 rejected,那么 p2 的回调函数将会立刻执行。
Promise.prototype.catch方法:捕捉错误
Promise.prototype.catch 方法是 Promise.prototype.then(null, rejection) 的别名,用于指定发生错误时的回调函数。
Promise 对象的错误具有"冒泡"性质,会一直向后传递,直到被捕获为止。也就是说,错误总是会被下一个 catch 语句捕获。
Promise.all方法| Promise.race方法
Promise.all 和 Promise.race 方法用于将多个 Promise 实例,包装成一个新的 Promise 实例。方法的参数不一定是数组,但是必须具有 iterator 接口,且返回的每个成员都是 Promise 实例。
代码示例一:
var promarr = Promise.all([prom1,prom2,prom3]);
上例中,prom1、prom2、prom3都是 Promise 对象的实例。
只有prom1、prom2、prom3的状态都变成fulfilled,promarr的状态才会变成fulfilled,此时prom1、prom2、prom3的返回值组成一个数组,传递给promarr的回调函数。
只要prom1、prom2、prom3之中有一个状态变成rejected,promarr的状态就变成rejected,此时第一个被reject的实例的返回值,会传递给promarr的回调函数。
代码实例二:
var p = Promise.race([p1,p2,p3]);
上例中,只要p1、p2、p3之中有一个实例率先改变状态,p的状态就跟着改变。那个率先改变的Promise实例的返回值,就传递给p的返回值。
如果Promise.all方法和Promise.race方法的参数,不是Promise实例,就会先调用Promise.resolve方法,将参数转为Promise实例,再进一步处理。
Promise.resolve 方法| Promise.reject 方法
Promise.resolve方法 可以将现有对象转为Promise对象。
如果 Promise.resolve 方法的参数,不是具有 then 方法的对象(又称 thenable 对象),则返回一个新的 Promise 对象,且它的状态为fulfilled。
如果Promise.resolve方法的参数是一个Promise对象的实例,则会被原封不动地返回。
Promise.reject(reason)方法也会返回一个新的Promise实例,该实例的状态为rejected。Promise.reject方法的参数reason【error】,会被传递给实例的回调函数。
示例代码:
var p = Promise.reject('出错了');
p.then(null, function (s){
console.log(s); // 出错了
});
super
super关键字用于访问和调用一个对象的父对象上的函数。
super.prop和super[expr]表达式在类和对象字面量任何方法定义中都是有效的。
语法:
super([arguments]);
// 调用 父对象/父类 的构造函数
super.functionOnParent([arguments]);
// 调用 父对象/父类 上的方法
在构造函数中使用时,super关键字将单独出现,并且必须在使用this关键字之前使用。super关键字也可以用来调用父对象上的函数。
箭头函数
箭头函数表达式的语法比函数表达式更简洁,并且没有自己的this,arguments,super或new.target。箭头函数表达式更适用于那些本来需要匿名函数的地方,并且它不能用作构造函数。
基础语法
(param1, param2, …, paramN) => { statements }
(param1, param2, …, paramN) => expression
//相当于:(param1, param2, …, paramN) =>{ return expression; }
// 当只有一个参数时,圆括号是可选的:
(singleParam) => { statements }
singleParam => { statements }
// 没有参数的函数应该写成一对圆括号。
() => { statements }
高级语法
//加括号的函数体返回对象字面量表达式:
params => ({foo: bar})
//支持剩余参数和默认参数
(param1, param2, ...rest) => { statements }
(param1 = defaultValue1, param2, …, paramN = defaultValueN) => {
statements }
//同样支持参数列表解构
let f = ([a, b] = [1, 2], {x: c} = {x: a + b}) => a + b + c;
f(); // 6
箭头函数不会创建自己的this,它只会从自己的作用域链的上一层继承this。由于 箭头函数没有自己的this指针,通过 call() 或 apply() 方法调用一个函数时,只能传递参数(不能绑定this),它们的第一个参数会被忽略。
箭头函数不能用作构造器,和 new一起用会抛出错误。
箭头函数没有prototype属性。
箭头函数在参数和箭头之间不能换行。