如何用await让程序停顿指定的时间(休眠效果)
如何用await让程序停顿指定的时间(休眠效果)
JavaScript 一直没有休眠的语法,但是借助await命令就可以让程序停顿指定的时间
12345678910111213141516function sleep(interval) { return new Promise(resolve => { setTimeout(resolve, interval); })}// 用法async function one2FiveInAsync() { for(let i = 1; i <= 5; i++) { console.log(i); await sleep(1000); }}one2FiveInAsync();
await 到底在等待什么?
await 在等什么
await 等待的是一个表达式,这个表达式的计算结果是 Promise 对象或者其它值(换句话说,就是没有特殊限定)。await 不仅仅用于等 Promise 对象,它可以等任意表达式的结果,所以,await 后面实际是可以接普通函数调用或者直接量的。
await 表达式的运算结果取决于它等的是什么。
如果它等到的不是一个 Promise 对象,那 await 表达式的运算结果就是它等到的东西。
如果它等到的是一个 Promise 对象,await 就忙起来了,它会阻塞后面的代码,等着 Promise 对象 resolve,然后得到 resolve 的值,作为 await 表达式的运算结果。
异步编程的实现方式?
异步编程的实现方式?**JavaScript中的异步机制可以分为以下几种:
回调函数 的方式,使用回调函数的方式有一个缺点是,多个回调函数嵌套的时候会造成回调函数地狱,上下两层的回调函数间的代码耦合度太高,不利于代码的可维护。Promise 的方式,使用 Promise 的方式可以将嵌套的回调函数作为链式调用。但是使用这种方法,有时会造成多个 then 的链式调用,可能会造成代码的语义不够明确。generator 的方式,它可以在函数的执行过程中,将函数的执行权转移出去,在函数外部还可以将执行权转移回来。当遇到异步函数执行的时候,将函数执行权转移出去,当异步函数执行完毕时再将执行权给转移回来。因此在 generator 内部对于异步操作的方式,可以以同步的顺序来书写。使用这种方式需要考虑的问题是何时将函数的控制权转移回来,因此需要有一个自动执行 generator 的机制,比如说 co 模块等方式来实现 generator 的自动执行。async 函数 的方式,async 函数是 generator 和 promise 实现的一个自动执行的语法糖,它内部自带执行器,当函数内部执行到一个 ...
class继承
class继承关键:class里的extends和super关键字,继承效果与寄生组合继承一样
12345678910111213141516171819202122 class Father { constructor(name) { this.name = name } showName() { console.log(this.name); } } class Son extends Father { // 子类通过extends继承父类 constructor(name, age) { super(name) // 调用父类里的constructor函数,等同于Father.call(this,name) this.age = age } showAge() { console.log(this.age); ...
混入继承
混入继承关键:利用Object.assign的方法多个父类函数的原型拷贝给子类原型
12345678910111213141516171819202122232425 function Father(name) { this.name = name } Father.prototype.showName = function () { console.log(this.name); } function Mather(color) { this.color = color } Mather.prototype.showColor = function () { console.log(this.color); } function Son(name, color, age) { // 调用两个父类函数 Father.call(this, name) Mather.call ...
寄生组合继承
寄生组合继承关键:原型式继承 + 构造函数继承
Js 最佳的继承方式,只调用了一次父类构造函数
12345678910111213141516171819 function Father(name) { this.name = name this.say = function () { console.log('hello,world'); } } Father.prototype.showName = function () { console.log(this.name); } function Son(name, age) { Father.call(this, name) this.age = age } Son.prototype = Object.create(Father.prototype) // Object.create方法返回一个对象,它的隐式原型指向 ...
寄生式继承
寄生式继承关键:在原型式继承的函数里,给继承的对象上添加属性和方法,增强这个对象
缺点:只能继承父类函数原型对象上的属性和方法,无法给父类构造函数传参
123456789101112131415161718192021 function createObj(obj) { function F() { } F.prototype = obj F.prototype.construct = F F.prototype.age = 20 // 给F函数的原型添加属性和方法,增强对象 F.prototype.showAge = function () { console.log(this.age); } return new F } function Father() { this.name = '刘逍' } Father.prototype.showName = fun ...
组合继承
组合继承关键:创建一个函数,将要继承的对象通过参数传递给这个函数,最终返回一个对象,它的隐式原型指向传入的对象。 (Object.create()方法的底层就是原型式继承)
缺点:只能继承父类函数原型对象上的属性和方法,无法给父类构造函数传参
123456789101112131415 function createObj(obj) { function F() { } // 声明一个构造函数 F.prototype = obj //将这个构造函数的原型指向传入的对象 F.prototype.construct = F // construct属性指回子类构造函数 return new F // 返回子类构造函数的实例 } function Father() { this.name = '刘逍' } Father.prototype.showName = function () { ...
组合继承
组合继承关键:原型链继承+借用构造函数继承
缺点:1、使用组合继承时,父类构造函数会被调用两次,子类实例对象与子类的原型上会有相同的方法与属性,浪费内存。
1234567891011121314151617181920212223242526 function Father(name) { this.name = name this.say = function () { console.log('hello,world'); } } Father.prototype.showName = function () { console.log(this.name); } function Son(name, age) { Father.call(this, name) //借用构造函数继承 this.age = age } // 原型链继承 Son.prototype = ...
构造函数继承
构造函数继承关键: 子类构造函数的原型为父类构造函数的实例对象缺点:
子类构造函数无法向父类构造函数传参。
所有的子类实例共享着一个原型对象,一旦原型对象的属性发生改变,所有子类的实例对象都会收影响
如果要给子类的原型上添加方法,必须放在 Son.prototype = new Father()语句后面
123456789101112131415161718192021function Father(name) { this.name = name}Father.prototype.showName = function () {console.log(this.name);}function Son(age) { this.age = 20}// 原型链继承,将子函数的原型绑定到父函数的实例上,子函数可以通过原型链查找到复函数的原型,实现继承Son.prototype = new Father()// 将Son原型的构造函数指回Son, 否则Son实例的constructor会指向FatherSon.prot ...