标签：ISE des ceo 处理 catch false on() cal his
一、let 和 const
let 声明变量，只在所在的块区有效，不存在变量提升；var 存在变
量提升
const 声明常量，只在所在块区有效
二、变量的解构赋值
1.数组的解构赋值
let [a, b, c] = [1, 2, 3];// a=1;b=2;c=3
2.对象的解构赋值
let { foo, bar } = { foo: "aaa", bar: "bbb" };
foo // "aaa"
bar // "bbb"
3.字符串的解构赋值
const [a, b] = ‘hello‘;
a // "h"
b // "e"
用途
1）交换值
let x = 1，y = 2;
[x, y] = [y, x];//y = 1, x = 2
2）从函数返回多个值
// 返回一个数组
function example() {
return [1, 2, 3];
}
let [a, b, c] = example();
// 返回一个对象
function example() {
return {
foo: 1,
bar: 2
};
}
let { foo, bar } = example();
3）输入模块的指定方法
加载模块时，往往需要指定输入哪些方法。
const { SourceMapConsumer, SourceNode } = require
("source-map");
三、字符串的扩展
1.includes(), startsWith(), endsWith()
返回布尔值，支持第二个参数，表示开始搜索的位置
let s = ‘Hello world!‘;
s.startsWith(‘world‘, 6) // true
s.endsWith(‘Hello‘, 5) // true
s.includes(‘Hello‘, 6) // false
使用第二个参数n时，endsWith的行为与其他两个方法有所不同。
它针对前n个字符，而其他两个方法针对从第n个位置直到字符串结
束。
2.repeat()
repeat方法返回一个新字符串，表示将原字符串重复n次。n不能为
负数
‘x‘.repeat(3) // "xxx"
‘hello‘.repeat(2) // "hellohello"
3.padStart()，padEnd()
padStart()用于头部补全，padEnd()用于尾部补全。
‘x‘.padStart(4, ‘ab‘) // ‘abax‘
‘x‘.padEnd(5, ‘ab‘) // ‘xabab‘
padStart和padEnd一共接受两个参数，第一个参数用来指定字符串
的最小长度，第二个参数是用来补全的字符串。
4.模板字符串
let x = 1，y = 2;
`${x} + ${y} = ${x + y}`// "1 + 2 = 3"
四、数组的扩张
1.扩展符(...)
好比 rest 参数的逆运算，将一个数组转为用逗号分隔的参数序列。
console.log(...[1, 2, 3])// 1 2 3
作用：
1）取数组中最大值 Math.max(...[14, 3, 77])//77
2）复制数组 const a1 = [1, 2]; const a2 = [...a1];
3）合并数组 [...arr1, ...arr2, ...arr3]
2.Array.from()
将两类对象转为真正的数组，能将arguments变成真正的数组
3.Array.of()
Array.of方法用于将一组值，转换为数组。
Array() // []
Array(3) // [, , ,]
Array(3, 11, 8) // [3, 11, 8]
Array方法没有参数、一个参数、三个参数时，返回结果都不一样。
只有当参数个数不少于 2 个时，Array()才会返回由参数组成的新数
组。参数个数只有一个时，实际上是指定数组的长度。
4.数组实例的 fill()
fill方法使用给定值，填充一个数组。
[‘a‘, ‘b‘, ‘c‘].fill(7)// [7, 7, 7]
fill方法可以接受第二个和第三个参数，用于指定填充的起始位置和结
束位置。
[‘a‘, ‘b‘, ‘c‘].fill(7, 1, 2)// [‘a‘, 7, ‘c‘]
5.数组实例的 includes()
表示某个数组是否包含给定的值,返回布尔值
该方法的第二个参数表示搜索的起始位置，默认为0。如果第二个参
数为负数，则表示倒数的位置，如果这时它大于数组长度（比如第二
个参数为-4，但数组长度为3），则会重置为从0开始。
[1, 2, 3].includes(3, 3); // false
[1, 2, 3].includes(3, -1); // true
[1, 2, 3].includes(3, -4); // true
五、对象的扩展
1.属性的简洁表示法
const foo = ‘bar‘;
const baz = {foo} === const baz = {foo: foo};
方法简写
const o = {
method() {
return "Hello!";
}
};
// 等同于
const o = {
method: function() {
return "Hello!";
}
};
2.Object.assign()
合并对象
const target = { a: 1 };
const source = { b: 2 };
Object.assign(target, source);
target // {a:1, b:2}
除了合并还有其他的用途
1）浅拷贝
function clone(origin) {
return Object.assign({}, origin);
}
2）为对象添加属性
class Point {
constructor(x, y) {
Object.assign(this, {x, y});
}
}
将x属性和y属性添加到Point类的对象实例。
3）为对象添加方法
Object.assign(SomeClass.prototype, {
someMethod(arg1, arg2) {
···
}
});
// 等同于下面的写法
SomeClass.prototype.someMethod = function (arg1, arg2) {
···
};
4）数组的处理
Object.assign([1, 2, 3], [4, 5])// [4, 5, 3]
3.Object.entries()
Object.entries方法返回一个数组，成员是参数对象自身的（不含继
承的）所有可遍历属性的键值对数组。
const obj = { foo: ‘bar‘, baz: 42 };
Object.entries(obj)// [ ["foo", "bar"], ["baz", 42] ]
六、函数的扩展
1.箭头函数
var f = v => v;
箭头函数有几个使用注意点。
（1）函数体内的this对象，就是定义时所在的对象，而不是使用时
所在的对象。
（2）不可以当作构造函数，也就是说，不可以使用new命令，否则
会抛出一个错误。
（3）不可以使用arguments对象，该对象在函数体内不存在。如果
要用，可以用 rest 参数代替。
2.函数参数的默认值
function Point(x = 0, y = 0) {
this.x = x;
this.y = y;
3.rest 参数
类似arguments，可以代替arguments
4.双冒号运算符
用来取代call、apply、bind调用
foo::bar; === bar.bind(foo);
七、Set
利用set可以实现数组去重
[...new Set([1,2,3,4,2,3,3])]//[1,2,3,4]
八、Promise
Promise是一个对象，有then()方法的对象,Promise 是异步编程的一
种解决方案。
const promise = new Promise(resolve, reject) => {
if (/* 异步操作成功 */){
resolve(value);
} else {
reject(error);
}
});
promise.then(value) => {
// success
}).catch( (error)=>{
//error
} );
九、class
1.constructor 方法
一个类必须有constructor方法，如果没有显式定义，一个空的
constructor方法会被默认添加。
class Point {}
// 等同于
class Point {
constructor() {}
}
2.类的实例对象
与 ES5 完全一样，也是使用new命令。前面说过，如果忘记加上
new，像函数那样调用Class，将会报错。
3.不存在变量提升
4.继承
class A {}
class B extends A {
constructor() {
super();
}
}
子类必须在constructor方法中调用super方法，否则新建实例时会
报错。只有调用super之后，才可以使用this关键字，否则会报错。
十、Module
1.export 和 import
export命令用于规定模块的对外接口，import命令用于输入其他模
块提供的功能。
// circle.js
export function area(radius) {
return Math.PI * radius * radius;
}
export function circumference(radius) {
return 2 * Math.PI * radius;
}
// main.js
import { area, circumference } from ‘./circle‘;
2.export default
默认输出是一个函数。其他模块加载该模块时，import命令可以为
该匿名函数指定任意名字。
// export-default.js
export default function () {
console.log(‘foo‘);
}
// import-default.js
import customName from ‘./export-default‘;
customName(); // ‘foo‘
3.改接口名和整体输出
// 接口改名
export { foo as myFoo } from ‘my_module‘;
// 整体输出
export * from ‘my_module‘;
4.跨模块常量
// constants/db.js
export const db = {
url: ‘http://my.couchdbserver.local:5984‘,
admin_username: ‘admin‘,
admin_password: ‘admin password‘
};
// constants/user.js
export const users = [‘root‘, ‘admin‘, ‘staff‘, ‘ceo‘, ‘chief‘,
‘moderator‘];
将这些文件输出的常量，合并在index.js里面。
// constants/index.js
export {db} from ‘./db‘;
export {users} from ‘./users‘;
使用的时候，直接加载index.js就可以了。
// script.js
import {db, users} from ‘./constants/index‘;
5.module加载
使用<script>标签，但是要加入type="module"属性。浏览器对于
带有type="module"的<script>，都是异步加载，不会造成堵塞浏
览器，即等到整个页面渲染完，再执行模块脚本
<script type="module" src="./foo.js"></script>
待补充，摘自阮老师的开源ES6第三版电子书 http://es6.ruanyifeng.com/
标签：ISE des ceo 处理 catch false on() cal his
原文地址：https://www.cnblogs.com/bear-blogs/p/9384607.html
