ES6笔记2

2021-08-16 15:52:20 浏览数 (1)

ES6笔记2

Promise

Promise 是 ES6 引入的异步编程的新解决方案,语法上是一个构造函数

一共有3种状态,pending(进行中)、fulfilled(已成功)和rejected(已失败)

特点:只有异步操作可以决定当前处于的状态,并且任何其他操作无法改变这个状态;

代码语言:javascript复制
const promise = new Promise((resolve, reject) => {
    if (success) {
        resolve(value); // 成功
    } else {
        reject(error); // 失败
    }
});

Promise对象需要通过构造函数来引入,构造函数需要2个参数,resolvereject 异步操作执行成功时。会将异步操作结果作为参数传入resolve函数执行,失败则会将异步操作的错误信息作为参数传入reject函数执行

我们可以通过promise对象下的then方法来给resolvereject设置回调函数

代码语言:javascript复制
promise.then(function(value) {
      console.log('我成功了');
}, function(error) {
      console.log('我失败了');
});

then方法接收两个回调函数,第一个是成功的回调,第二个是失败的回调,第二个可不填

promise使用

代码语言:javascript复制
const p = new Promise((resolve, reject) => {
    setTimeout(() => {
        // resolve('我成功了');
        reject('我失败了');
    }, 2000)
})
p.then(data => {
     console.log(data);
}).catch(error => {
     console.error(error);
})

Promise.prototype.catch()用于指定发生错误时的回调函数。

Set

允许你存储任何类型的唯一值,无论是原始值或者是对象引用

代码语言:javascript复制
let set = new Set();
set.add('加一个值');
set.add('再加一个');
console.log(set.has('再加一个')); //true
console.log(set.size); //2
set.delete('加一个值');
console.log(set.has('加一个值')); //false
console.log(set.size); //1
set.clear(); //清空容器

其实可以把set对象看作是一个容器,可以增删改查

Map

类似于对象,也是键值对的集合,但是“键” 的范围不限于字符串,各种类型的值(包括对象)都可以当作键

代码语言:javascript复制
const m = new Map();
m.set('name', 'ljc'); //用set方法添加键值对
m.set('age', 20);
m.set('sex', '男');
m.get('name'); //获取属性值
console.log(m.size); //3
m.has('sex'); //true 判断是否含有
m.delete('age'); //删除
m.clear(); //清空

Class

在类中可以直接定义方法,实际上类的所有方法都定义在类的prototype属性上面。在类的实例上面调用方法,其实就是调用原型上的方法。

代码语言:javascript复制
class Person{
   constructor(id,name,age){
       this.id = id;
       this.name = name;
       this.age = age;
   }
}
静态方法

在一个方法前,加上static关键字,表示该方法不会被实例继承,而是直接通过类来直接调用,这就称为“静态方法”。

代码语言:javascript复制
class Foo{
   static sta(){
       return 'ljc';
   }
}
Foo.sta(); //'ljc'

如果静态方法包含this关键字,这个this指向类,而不是实例。

类继承
代码语言:javascript复制
constructor(money, car, house, company) {
    this.money = money;
    this.car = car;
    this.house = house;
    this.company = company;
}
manage = function () {
    console.log('我是管理的方法');
}
}
class Son extends Father {
	constructor(money,car,house,company) {
    	super(money, car, house, company);
	}
}

通过extends关键字来实现继承,子类必须在constructor方法中调用super方法,同时继承了this指向

取值函数(getter)和存值函数(setter)

set方法一定要传参数

代码语言:javascript复制
class MyClass {
  constructor() {
    // ...
  }
  get ljc() {
    return 'get';
  }
  set ljc(value) {
    console.log('set: ' value);
  }
}

let inst = new MyClass();

inst.ljc = 123;//修改
// set: 123

inst.ljc//访问
// 'get'
注意点
  • 类的方法内部如果含有this,它默认指向类的实例,必须注意!!!
  • 不存在变量提升

数值扩展

  • Number.isFinite 用来检查一个数值是否为有限的
代码语言:javascript复制
console.log(Number.isFinite(5));//true
console.log(Number.isFinite(NaN));//false
  • Number.isNaN()判断是否是NaN
代码语言:javascript复制
console.log(Number.isNaN(NaN));//true
console.log(Number.isNaN(5));//false
  • Number.isInteger用来判断一个数值是否为整数
代码语言:javascript复制
console.log(Number.isInteger(5.73));//false
console.log(Number.isInteger(5.0));//true
console.log(Number.isInteger(5));//true
  • Math.trunc()去除小数,返回整数部分
代码语言:javascript复制
console.log(Math.trunc(5.85));//5

对象扩展

Object.is比较两个值是否严格相等,与===基本一致

Object.assign 对象的合并

代码语言:javascript复制
let obj1 = {name: 'ljc',age: 20};
let obj2 = {sex: '男'}
let obj3 = {};
Object.assign(obj3,obj1,obj2);
console.log(obj3);//{name: 'ljc',age: 20,sex: '男'}
ES7 新特性

Includes 方法用来检测数组中是否包含某个元素,返回布尔类型值

指数运算符**,用来实现幂运算,功能与 Math.pow 结果相同

ES8 新特性
async和await

当你需要异步事件执行完后再执行下面代码时,就可以采用这种方法

async函数返回一个 Promise 对象,可以使用then方法添加回调函数。当函数执行的时候,一旦遇到await就会先返回,等到异步操作完成,再接着执行函数体内后面的语句

代码语言:javascript复制
async function aw() {
    let result = await new Promise((resolve, reject) => {
        setTimeout(function () {
            console.log('我来了');
            resolve(2);
        }, 2000);
    })
    console.log(result);
    console.log(1234);
}
aw();//我来了  2  1234

从输出结果可以看出,当定时器执行完才输出1234

ES6

String.trimStart() 与 String.trimEnd()

去除前面或后面的空格

Promise.prototype.finally() 不管promise最后的状态,在执行完then或catch指定的回调函数以后,都会执行finally方法指定的回调函数。

Object.entries()

返回的数组的元素是键值对数组

代码语言:javascript复制
const ljc = {
    age: 20,
    name: 'ljc',
    sex: 'nan'
}
console.log(Object.entries(ljc));
//[ [ 'age', 20 ], [ 'name', 'ljc' ], [ 'sex', 'nan' ] ]

Bigint类型

数字运算结果能取的值更长

globalThis对象

永远指向全局对象


在ES9-11还新增了很多api,以后再总结吧,现在就了解了一下

0 人点赞