es6常用摘录
es6常用摘录
1.es6一共有6中声明变量的方法
es5 的var命令，function命令
es6 的let、const命令，还有import和class命令
2.let :for循环
同时多个for循环都需要遍历，声明可以用let,不会相互干扰。
3.字符串的扩展
传统上，JavaScript 只有indexOf方法，可以用来确定一个字符串是否包含在另一个字符串中。ES6 又提供了三种新方法。
includes()：返回布尔值，表示是否找到了参数字符串。
startsWith()：返回布尔值，表示参数字符串是否在原字符串的头部。
endsWith()：返回布尔值，表示参数字符串是否在原字符串的尾部。
let temp = 'hello';
temp.startsWith('e');
false
temp.endsWith('o');
true
temp.includes('0');
false
上面代码表示，使用第二个参数n时，endsWith的行为与其他两个方法有所不同。它针对前n个字符，而其他两个方法针对从第n个位置直到字符串结束。
let tmp = 'hello';
tmp.startsWith('l',3)
true
tmp.endsWith('e',1)
false
tmp.endsWith('e',3)
false
tmp.endsWith('e',2)
true
4.模板字符串
let x = 2;
let y = 4;
`${x} + ${y} = ${x+y}`
"2 + 4 = 6"
5.数组的扩展
扩展用算符：合并数组
let arr1 = [1,2];
let arr2 = ['wcy',2];
let arr3 = [...arr1,...arr2];
console.log(...arr3)
//1 1 2 "wcy" 2
Array.of方法用于将一组值，转换为数组。
let a = Array.of('55',5,6);
console.log(...a)
//2 55 5 6
6.函数的扩展（函数默认值）
function log(x = 2,y = 5){
console.log(x,y)
}
log()
//2 2 5
log(1)
//2 1 5
7.箭头函数
8.尾递归（目录生成）
函数调用自身，称为递归。如果尾调用自身，就称为尾递归。
递归非常耗费内存，因为需要同时保存成千上百个调用帧，很容易发生“栈溢出”错误（stack overflow）。但对于尾递归来说，由于只存在一个调用帧，所以永远不会发生“栈溢出”错误。
9.函数参数的尾逗号
写法上更加统一，规范
10.Promise
11.for of
可以使用的范围包括数组、Set 和 Map 结构、某些类似数组的对象（比如arguments对象、DOM NodeList 对象）、后文的 Generator 对象，以及字符串。
可以替代forEach
相比for in ,允许直接获得键值
12.Array.from
并不是所有类似数组的对象都具有 Iterator 接口，一个简便的解决方法，就是使用Array.from方法将其转为数组。
13.async
基本语法：
async函数返回一个 Promise 对象，可以使用then方法添加回调函数。当函数执行的时候，一旦遇到await就会先返回，等到异步操作完成，再接着执行函数体内后面的语句。
// 函数声明
async function foo() {}
// 函数表达式
const foo = async function () {};
// 对象的方法（项目里目前没有用到）
let obj = { async foo() {} };
obj.foo().then(...)
// Class 的方法
class Storage {
constructor() {
this.cachePromise = caches.open('avatars');
}
async getAvatar(name) {
const cache = await this.cachePromise;
return cache.match(`/avatars/${name}.jpg`);
}
}
const storage = new Storage();
storage.getAvatar('jake').then(…);
// 箭头函数
const foo = async () => {};
注意：
只要一个await语句后面的 Promise 变为reject，那么整个async函数都会中断执行。
async function f() {
await Promise.reject('出错了');
await Promise.resolve('hello world'); // 不会执行
}
有时，我们希望即使前一个异步操作失败，也不要中断后面的异步操作。这时可以将第一个await放在try...catch结构里面，这样不管这个异步操作是否成功，第二个await都会执行。
async function f() {
try {
await Promise.reject('出错了');
} catch(e) {
}
return await Promise.resolve('hello world');
}
f()
.then(v => console.log(v))
// hello world
14.严格模式
类和模块的内部，默认就是严格模式，所以不需要使用use strict指定运行模式。只要你的代码写在类或模块之中，就只有严格模式可用。
考虑到未来所有的代码，其实都是运行在模块之中，所以 ES6 实际上把整个语言升级到了严格模式。
15.export命令
用来规定模块的对外接口。
1>输出变量：
var firstName = 'Michael';
var lastName = 'Jackson';
var year = 1958;
export {firstName, lastName, year};
也可以在var命令前分别export变量，但是一般会在文件尾部统一export，这样一目了然。
2>输出函数或class
export function multiply(x, y) {
return x * y;
};
3>通常情况下，export输出的变量就是本来的名字，但是可以使用as关键字重命名。
function v1() { ... }
function v2() { ... }
export {
v1 as streamV1,
v2 as streamV2,
v2 as streamLatestVersion
};
16.import命令
用来加载对外接口模块
import接受一对大括号，里面指定从其他模块导入的变量名。大括号中的变量名，必须与对外接口的变量名一致。
import {firstName, lastName, year} from './profile.js';
function setName(element) {
element.textContent = firstName + ' ' + lastName;
}
为输入的变量名别名，使用as关键字
import { lastName as surname } from './profile.js';
import输入的变量是只读的。
import后面的from指定模块文件的位置，可以是相对路径，也可以是绝对路径，.js后缀可以省略。如果只是模块名，不带有路径，那么必须有配置文件，告诉 JavaScript 引擎该模块的位置。
import {myMethod} from 'util';
注意，import命令具有提升效果，会提升到整个模块的头部，首先执行。
foo();
import { foo } from 'my_module';
如果多次重复执行同一句import语句，那么只会执行一次，而不会执行多次。
17.模块整体加载
除了指定加载某个输出值，还可以使用整体加载，即用星号（*）指定一个对象，所有输出值都加载在这个对象上面。
逐一加载
// main.js
import { area, circumference } from './circle';
console.log('圆面积：' + area(4));
console.log('圆周长：' + circumference(14));
整体加载的写法如下。
import * as circle from './circle';
console.log('圆面积：' + circle.area(4));
console.log('圆周长：' + circle.circumference(14));
18.export detault命令
为了让用户不读文档就加载模块，就要用到export default指令，指出默认输出。
// export-default.js
export default function () {
console.log('foo');
}
其他模块加载该模块时，import命令可以为该匿名函数指定任意名字。需要注意的是，这时import命令后面，不使用大括号。
// import-default.js
import customName from './export-default';
customName(); // 'foo'
下面比较一下默认输出和正常输出。
// 第一组
export default function crc32() { // 输出
// ...
}
import crc32 from 'crc32'; // 输入
// 第二组
export function crc32() { // 输出
// ...
};
import {crc32} from 'crc32'; // 输入
上面代码的两组写法，第一组是使用export default时，对应的import语句不需要使用大括号；第二组是不使用export default时，对应的import语句需要使用大括号。
export default命令用于指定模块的默认输出。显然，一个模块只能有一个默认输出，因此export default命令只能使用一次。所以，import命令后面才不用加大括号，因为只可能唯一对应export default命令。
本质上，export default就是输出一个叫做default的变量或方法，然后系统允许你为它取任意名字。
export default也可以用来输出类。
// MyClass.js
export default class { ... }
// main.js
import MyClass from 'MyClass';
let o = new MyClass();
19.跨模块常量
const声明的常量只在当前代码块有效。如果想设置跨模块的常量（即跨多个文件），或者说一个值要被多个模块共享，可以采用下面的写法。
// constants.js 模块
export const A = 1;
export const B = 3;
export const C = 4;
// test1.js 模块
import * as constants from './constants';
console.log(constants.A); // 1
console.log(constants.B); // 3
// test2.js 模块
import {A, B} from './constants';
console.log(A); // 1
console.log(B); // 3
