1. 解构赋值
let obj = {off: bar} = {off: 2};
console.log(bar) // 2
字符串解构 const [a,b,c,d,e] = 'hello';
数值和布尔值解构 解构出来的是原型上的方法
for in 是ES5的标准 遍历key for of 是ES6的标准 遍历value
2. 字符串扩展
新增字符串的方法
includes() // 返回布尔值 表示找到了参数字符串
startsWith() // 返回布尔值 表示参数字符串是否在原字符串头部
endswith() // 尾部
repeat() // 返回一个新字符串 表示将原字符串重复N次
padStart() // 头部补全
padEnd() // 尾部补全
3. 函数扩展
函数的name属性
var f = function () {};
// ES5
f.name // ""
// ES6
f.name // "f"
const bar = function baz() {};
// ES5
bar.name // "baz"
// ES6
bar.name // "baz"
箭头函数
箭头函数有几个使用注意点
函数体内的this
对象,就是定义时所在的对象,而不是使用时所在的对象。
不可以当作构造函数,也就是说,不可以使用new
命令,否则会抛出一个错误。
不可以使用arguments
对象,该对象在函数体内不存在。如果要用,可以用 rest
参数代替。
不可以使用yield
命令,因此箭头函数不能用作 Generator
函数。
普通函数里面的this取决于谁调用,箭头函数里面的this
是固定的
箭头函数里面没有arguments
const a = () => () => () {console.log(1)} 调用a()()();
相当于function a(){return function(){return function(){console.log(1)}}};
4. 数组的扩展
扩展运算符
[...'hello'] //['h','e','l','l','o'] 合并数组 arr1.concat(arr2) [...arr1, ...arr2];
Array.from()
将类似数组转为真正的数组
Array.of()
将一组值转为数组,可以创建一个长度为1的数组,但是Array()不可以
copyWithin()
在当前数组内部,将指定位置的成员复制到其他位置(会覆盖原有成员),然后返回当前数组
find()
用于找出第一个符合条件的数组成员。 [1, 4, -5, 10].find((n) => n < 0) // -5
findIndex()
返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1。
fill()
使用给定值,填充一个数组。
keys()
是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历。
includes()
返回一个布尔值,表示某个数组是否包含给定的值
数组的空位
ES5
forEach(), filter(), reduce(), every() 和some()都会跳过空位。
map()会跳过空位,但会保留这个值
join()和toString()会将空位视为undefined,而undefined和null会被处理成空字符串。
ES6
将空位转为undefined Array.from() (...)
for of 也会遍历空位
5. 对象的扩展
(1) const obj = { class () {} }; // 等同于 var obj = { 'class': function() {} };
(2)、Object.js()
比较两个字是否相等,ES5 == ES6 更加严谨
(3)、Object.assign()
用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target)
如果第一个参数为空 直接扩展 不会改变源对象 实行的是浅拷贝
(4)、属性的遍历
ES6 一共有 5 种方法可以遍历对象的属性。
- for...in
for…in循环遍历对象自身的和继承的可枚举属性(不含 Symbol 属性)。
- Object.keys(obj)
Object.keys返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含
Symbol 属性)的键名。
- Object.getOwnPropertyNames(obj)
Object.getOwnPropertyNames
返回一个数组,包含对象自身的所有属性(不含 Symbol
属性,但是包括不可枚举属性)的键名。
- Object.getOwnPropertySymbols(obj)
Object.getOwnPropertySymbols
返回一个数组,包含对象自身的所有 Symbol 属性的键名。
- Reflect.ownKeys(obj)
Reflect.ownKeys
返回一个数组,包含对象自身的所有键名,不管键名是
Symbol 或字符串,也不管是否可枚举。 以上的 5 种方法遍历对象的键名,都遵守同样的属性遍历的次序规则。
首先遍历所有数值键,按照数值升序排列。 其次遍历所有字符串键,按照加入时间升序排列。 最后遍历所有 Symbol
键,按照加入时间升序排列。
(5)、 Object.getOwnPropertyDescriptor方法可以获取该属性的描述对象。
let obj = { foo: 123 };
Object.getOwnPropertyDescriptor(obj, 'foo')
// {
// value: 123,
// writable: true,
// enumerable: true,
// configurable: true
// }
(6)、Object.setPrototypeOf方法的作用与__proto__相同,用来设置一个对象的prototype对象,返回参数对象本身。它是 ES6 正式推荐的设置原型对象的方法
(7)、 **Object.setPrototypeOf()**用来设置一个对象的prototype对象,返回参数对象本身。
```
let obj = { x: 10 };
Object.setPrototypeOf(obj, {
y: 20
});
console.log(obj.y); // 20
Object.getPrototypeOf()用于读取一个对象的原型对象。
```
(8)、 super关键字
this关键字总是指向函数所在的当前对象,super指向当前对象的原型对象
(9)、 Object.values方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键值。
Object.keys方法,返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键名
Object.entries方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历(enumerable)属性的键值对数组
(10)、一种新的原始数据类型Symbol,表示独一无二的值。它是 JavaScript 语言的第七种数据类型,前六种是:undefined、null、布尔值(Boolean)、字符串(String)、数值(Number)、对象(Object)。
6. Set和Map数据结构
Set是一个构造函数 用来数组去重 new Set() 接收一个数组作为参数
Set的四个操作方法
add(value)
:添加某个值,返回 Set 结构本身。
delete(value)
:删除某个值,返回一个布尔值,表示删除是否成功。
has(value)
:返回一个布尔值,表示该值是否为Set的成员。
clear()
:清除所有成员,没有返回值。
Map数据结构 接收数组作为参数 返回数组
7. Promise对象
Promise对象有以下两个特点。
(1)对象的状态不受外界影响。Promise对象代表一个异步操作,有三种状态:pending
(进行中)、fulfilled
(已成功)和rejected
(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。这也是Promise
这个名字的由来,它的英语意思就是“承诺”,表示其他手段无法改变。
(2)一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise对象的状态改变,只有两种可能:从pending
变为fulfilled
和从pending
变为rejected
。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果,这时就称为 resolved(已定型)。如果改变已经发生了,你再对Promise对象添加回调函数,也会立即得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。
注意,为了行文方便,后面的resolved
统一只指fulfilled
状态,不包含rejected
状态。
有了Promise对象,就可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数。此外,Promise对象提供统一的接口,使得控制异步操作更加容易。
Promise也有一些缺点。首先,无法取消Promise,一旦新建它就会立即执行,无法中途取消。其次,如果不设置回调函数,Promise内部抛出的错误,不会反应到外部。第三,当处于pending
状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)。
ES6 规定,Promise对象是一个构造函数,用来生成Promise实例。
const promise = new Promise(function(resolve, reject) {
// ... some code
if (/* 异步操作成功 */){
resolve(value);
} else {
reject(error);
}
});
Promise构造函数接受一个函数作为参数,该函数的两个参数分别是resolve
和reject
。
resolve
函数的作用是,将Promise对象的状态从“未完成”变为“成功”(即从 pending
变为 resolved
),在异步操作成功时调用,并将异步操作的结果,作为参数传递出去;reject函数的作用是,将Promise对象的状态从“未完成”变为“失败”(即从 pending
变为 rejected
),在异步操作失败时调用,并将异步操作报出的错误,作为参数传递出去。
Promise实例生成以后,可以用then
方法分别指定resolved
状态和rejected
状态的回调函数。
.then()
它的作用是为 Promise 实例添加状态改变时的回调函数。
.catch()
方法是.then(null, rejection)
的别名,用于指定发生错误时的回调函数
Promise.all
方法用于将多个 Promise 实例,包装成一个新的 Promise 实例。
8. Iterator 和 for…of 循环
for of
只要有iterator接口都可以用for of
来遍历
9. async函数
async函数返回一个 Promise 对象,可以使用then
方法添加回调函数。当函数执行的时候,一旦遇到await
就会先返回,等到异步操作完成,再接着执行函数体内后面的语句。
10. class
Class 可以通过extends关键字实现继承 通过super
调用父类的方法时,方法内部的this指向子类。