-
- then成功回调有一个参数 表示成功之后的值 then失败回调有一个参数 表示失败的原因
-
- Promise支持异步调用
-
then方法内部的判断状态加上一个等待状态
-
等待状态时就将成功回调或者失败回调存储一下
-
- 同一个promise对象下的then方法是可以多次调用的,当then方法被多次调用时,每一个then方法中传递的回调函数都是要被执行的
-
- then方法是可以被链式调用的,后面then方法的回调函数拿到值的是上一个then方法的回调函数的返回值
-
实现then方法的链式调用
-
then方法是promise方法下边的,想要实现链式调用,那就要返回一个promise对象
-
把上一个then方法的回调函数中的返回值传递给下一个then方法的回调函数
-
在链式调用then方法时,在then方法的回调函数当中,我们可以去返回一个普通值,也可以去返回一个Promise对象,如果是普通值,直接通过resolve传递就可以了,如果是Promise对象的话,我们要先去查看返回的promise对象状态,成功状态就要调用resolve方法把这个状态传递给下一个对象,如果是失败就要调用reject方法,把这个状态传递给下一个对象
-
- 错误处理,为了程序的健壮性,我们还是有必要去捕获错误,处理错误
-
当执行器当中的代码在执行的过程当中发生错误的时候,这个时候我们就让promise的状态变成失败
-
也就是在then的第二个参数的地方捕获到错误
const PENDING = ‘pending’; // 等待
const FULFILLED = ‘fulfilled’; // 成功
const REJECTED = ‘rejected’; // 失败
class MyPromise {
constructor (executor) {
executor(this.resolve, this.reject)
}
// promise 状态
status = PENDING;
// 成功之后的值
value = undefined
// 失败后的原因
reason = undefined
resolve = value => {
// 如果程序不是等待,阻止程序向下执行
if(this.status !== PENDING) return
//将状态更改为成功
this.status = FULFILLED
// 保存成功之后的值
this.value = value;
}
reject = reason => {
// 如果程序不是等待,阻止程序向下执行
if(this.status !== PENDING) return
// 将状态更改为失败
this.status = REJECTED
// 保存失败的原因
this.reason = reason;
}
then (successCallback, failCallback) {
// 判断状态
if(this.status === FULFILLED){
successCallback(this.value)
} else if(this.status === REJECTED) {
failCallback(this.reason)
}
}
}
// 导出
module.exports = MyPromise;
// 导入
const MyPromise = require(‘./02-Promise核心逻辑实现’);
let promise = new MyPromise((resolve, reject) => {
resolve(‘成功’)
reject(‘失败’)
})
promise.then(value => {
console.log(value)
}, reason => {
console.log(reason)
})
const PENDING = ‘pending’;
const FULFILLED = ‘fulfilled’;
const REJECTED = ‘rejected’;
class MyPromise {
constructor (executor) {
executor(this.resolve, this.reject)
}
status = PENDING;
value = undefined;
reason = undefined;
// 成功回调
successCallback = undefined;
// 失败回调
failCallback = undefined;
resolve = value => {
if(this.status !== PENDING) return;
this.status = FULFILLED;
this.value = value;
// 判断成功回调是否存在,如果存在,调用
this.successCallback ? this.successCallback(this.value) : null
}
reject = reason => {
if(this.status !== PENDING) return;
this.status = REJECTED;
this.reason = reason;
// 判断失败回调是否存在,如果存在,调用
this.failCallback && this.failCallback(this.reason)
}
then (successCallback, failCallback) {
if(this.status === FULFILLED){
successCallback(this.value)
} else if(this.status === REJECTED) {
failCallback(this.reason)
} else {// 等待
// 将成功回调和失败回调存储起来
this.successCallback = successCallback;
this.failCallback = failCallback;
}
}
}
// 导出
module.exports = MyPromise;
// 导入
const MyPromise = require(‘./02.1-Promise异步逻辑实现’);
let promise = new MyPromise((resolve, reject) => {
setTimeout(() => {
resolve(‘成功’)
}, 2000)
// reject(‘失败’)
})
promise.then(value => {
console.log(value)
}, reason => {
console.log(reason)
})
const PENDING = ‘pending’;
const FULFILLED = ‘fulfilled’;
const REJECTED = ‘rejected’;
class MyPromise {
constructor (executor) {
executor(this.resolve, this.reject)
}
status = PENDING;
value = undefined;
reason = undefined;
// 成功回调 — 只有是数组才可以多次存储多个回调函数
successCallback = [];
// 失败回调 — 只有是数组才可以多次存储多个回调函数
failCallback = [];
resolve = value => {
if(this.status !== PENDING) return;
this.status = FULFILLED;
this.value = value;
// 通过成功回调这个数组去循环调用,每次调用结束就将其删除
while (this.successCallback.length) this.successCallback.shift()(this.value)
}
reject = reason => {
if(this.status !== PENDING) return;
this.status = REJECTED;
this.reason = reason;
// 通过失败回调这个数组去循环调用,每次调用结束就将其删除
while (this.failCallback.length) this.failCallback.shift()(this.reason)
}
then (successCallback, failCallback) {
if(this.status === FULFILLED){
successCallback(this.value)
} else if(this.status === REJECTED) {
failCallback(this.reason)
} else {
// 将成功回调和失败回调存储起来
this.successCallback.push(successCallback);
this.failCallback.push(failCallback);
}
}
}
// 导出
module.exports = MyPromise;
const MyPromise = require(‘./03.1-Promise-then方法多次调用’);
let promise = new MyPromise((resolve, reject) => {
// resolve(‘成功’)
// reject(‘失败’)
setTimeout(() => {
resolve(‘成功了233333’)
}, 2000)
})
promise.then(value => {
console.log(1)
console.log(value)
}, (reason) => {
console.log(reason)
})
promise.then(value => {
console.log(2)
console.log(value)
}, (reason) => {
console.log(reason)
})
promise.then(value => {
console.log(3)
console.log(value)
}, (reason) => {
console.log(reason)
})
const PENDING = ‘pending’;
const FULFILLED = ‘fulfilled’;
const REJECTED = ‘rejected’;
class MyPromise {
constructor (executor) {
executor(this.resolve, this.reject)
}
status = PENDING;
value = undefined;
reason = undefined;
// 成功回调 — 只有是数组才可以多次存储多个回调函数
successCallback = [];
// 失败回调 — 只有是数组才可以多次存储多个回调函数
failCallback = [];
resolve = value => {
if(this.status !== PENDING) return;
this.status = FULFILLED;
this.value = value;
// 通过成功回调这个数组去循环调用,每次调用结束就将其删除
while (this.successCallback.length) this.successCallback.shift()(this.value)
}
reject = reason => {
if(this.status !== PENDING) return;
this.status = REJECTED;
this.reason = reason;
// 通过失败回调这个数组去循环调用,每次调用结束就将其删除
while (this.failCallback.length) this.failCallback.shift()(this.reason)
}
then (successCallback, failCallback) {
if(this.status === FULFILLED){
successCallback(this.value)
} else if(this.status === REJECTED) {
failCallback(this.reason)
} else {
// 将成功回调和失败回调存储起来
this.successCallback.push(successCallback);
this.failCallback.push(failCallback);
}
}
}
// 导出
module.exports = MyPromise;
// 导入
const MyPromise = require(‘./04.1-Promise-then方法链式调用’);
let promise = new MyPromise((resolve, reject) => {
resolve(‘成功’)
// reject(‘失败’)
// setTimeout(() => {
// resolve(‘成功了233333’)
// }, 2000)
})
/**
-
Promise 对象当中的方法是可以链式调用的
-
后一个then方法拿到的值,其实是上一个then方法的回调函数的返回值
-
比如说这里后一个then的value值其实就是上一个then回调函数的返回值100
-
*/
promise.then(value => {
console.log(value)
return 100
}).then(value => {
console.log(value)
})
const PENDING = ‘pending’;
const FULFILLED = ‘fulfilled’;
const REJECTED = ‘rejected’;
class MyPromise {
constructor(executor) {
executor(this.resolve, this.reject)
}
status = PENDING;
value = undefined;
reason = undefined;
successCallback = [];
failCallback = [];
resolve = value => {
if (this.status !== PENDING) return;
this.status = FULFILLED;
this.value = value;
while (this.successCallback.length) this.successCallback.shift()(this.value)
}
reject = reason => {
if (this.status !== PENDING) return;
this.status = REJECTED;
this.reason = reason;
while (this.failCallback.length) this.failCallback.shift()(this.reason)
}
then(successCallback, failCallback) {
let promise2 = new MyPromise((resolve, reject) => {
if (this.status === FULFILLED) {
let x = successCallback(this.value)
/**
-
判断 X 的值是普通值还是Promise对象
-
如果是普通值 直接调用resolve
-
如果是promise对象 查看promise对象返回的结果
-
再根据promise对象返回的结果 决定调用resolve 还是调用reject
*/
resolvePromise(x, resolve, reject)
} else if (this.status === REJECTED) {
failCallback(this.reason)
} else {
this.successCallback.push(successCallback);
this.failCallback.push(failCallback);
}
});
return promise2;
}
}
function resolvePromise (x, resolve, reject) {
if(x instanceof MyPromise){
// Promise 对象
// x.then(value => resolve(value), reason => reject(reason))
x.then(resolve, reject)
} else {
// 普通值
resolve(x)
}
}
// 导出
module.exports = MyPromise;
// 导入
const MyPromise = require(‘./04.3-Promise-then方法链式调用’);
let promise = new MyPromise((resolve, reject) => {
resolve(‘成功’)
// reject(‘失败’)
// setTimeout(() => {
// resolve(‘成功了233333’)
// }, 2000)
})
function other () {
return new MyPromise((resolve, reject) => {
resolve(‘othen’);
})
}
promise.then(value => {
console.log(value)
return other()
}).then(value => {
console.log(value)
})
const MyPromise = require(‘./05.1-识别Promise对象自动返回’);
let promise = new MyPromise((resolve, reject) => {
resolve(‘成功’)
})
/**
-
当链式调用promise对象下的then方法的时候我们说过
-
在then这个回调函数当中,是可以返回promise对象的
-
但是有一种情况是例外
-
在then方法的回调函数当中,是不能返回当前这个then方法他所返回的promise对象的
-
如果返回了then方法返回的那个promise对象,这个时候就发生发promise对象的循环调用
-
这时程序是不被允许的,会报错
-
我们先演示一下这种报错情况,以及如何才能够把这种情况识别出来,给调用者报一个错误
-
请移步06-识别Promise对象自动返回.html — 因为我们要使用系统给我们提供的promise来演示错误
-
*/
let p1 = promise.then(value => {
console.log(value)
return p1;
})
p1.then(value => {
console.log(value)
}, reason => {
console.log(reason.message)
})
// =======================================================
// 06-识别Promise对象自动返回.html
// 通过new创建一个promise对象,并传递一个执行器进去,执行器有resolve和reject两个参数
var promise = new Promise(function (resolve, reject) {
// 直接调用resolve返回100
resolve(100)
})
// promise的循环调用
var p1 = promise.then(function (value) {
console.log(value)
return p1
})
p1.then(function () {}, function (reason) {
console.log(reason.message)
})
// ==============================================================
const PENDING = ‘pending’;
const FULFILLED = ‘fulfilled’;
const REJECTED = ‘rejected’;
class MyPromise {
constructor(executor) {
executor(this.resolve, this.reject)
}
status = PENDING;
value = undefined;
reason = undefined;
successCallback = [];
failCallback = [];
resolve = value => {
if (this.status !== PENDING) return;
this.status = FULFILLED;
this.value = value;
while (this.successCallback.length) this.successCallback.shift()(this.value)
}
reject = reason => {
if (this.status !== PENDING) return;
this.status = REJECTED;
this.reason = reason;
while (this.failCallback.length) this.failCallback.shift()(this.reason)
}
then(successCallback, failCallback) {
let promise2 = new MyPromise((resolve, reject) => {
if (this.status === FULFILLED) {
/**
-
resolvePromise() 这个函数的第一个参数是 promise2
-
但是这个时候我们还在 new MyPromise的过程中,还没有promise2
-
所以我们这里使用一个定时器,让其上下文的同步代码全部执行完毕再来执行改代码
-
这时我们就拥有了promise2
-
*/
setTimeout(() => {
let x = successCallback(this.value)
resolvePromise(promise2, x, resolve, reject)
}, 0)
} else if (this.status === REJECTED) {
failCallback(this.reason)
} else {
this.successCallback.push(successCallback);
this.failCallback.push(failCallback);
}
});
return promise2;
}
}
function resolvePromise(promise2, x, resolve, reject) {
// 判断我们返回的对象(Promise2)和我们成功的回调所返回的对象(x)是不是同一个
if(promise2 === x){
// 是 — 发生循环调用,自己返回了自己,调用reject传递一个错误信息,并且中断程序运行
return reject(new TypeError(‘Chaining cycle detected for promise #’))
}
if (x instanceof MyPromise) {
x.then(resolve, reject)
} else {
resolve(x)
}
}
// 导出
module.exports = MyPromise;
const PENDING = ‘pending’;
const FULFILLED = ‘fulfilled’;
const REJECTED = ‘rejected’;
class MyPromise {
// 捕获执行的错误
constructor(executor) {
try {
executor(this.resolve, this.reject)
} catch (e) {
this.reject(e);
}
}
status = PENDING;
value = undefined;
reason = undefined;
successCallback = [];
failCallback = [];
resolve = value => {
if (this.status !== PENDING) return;
this.status = FULFILLED;
this.value = value;
while (this.successCallback.length) this.successCallback.shift()()
}
reject = reason => {
if (this.status !== PENDING) return;
this.status = REJECTED;
this.reason = reason;
while (this.failCallback.length) this.failCallback.shift()()
}
then(successCallback, failCallback) {
let promise2 = new MyPromise((resolve, reject) => {
if (this.status === FULFILLED) {
setTimeout(() => {
try {
let x = successCallback(this.value)
resolvePromise(promise2, x, resolve, reject)
} catch (e) {
reject(e)
}
}, 0)
} else if (this.status === REJECTED) {
setTimeout(() => {
try {
let x = failCallback(this.reason)
resolvePromise(promise2, x, resolve, reject)
} catch (e) {
reject(e)
}
}, 0)
} else {
this.successCallback.push(() => {
setTimeout(() => {
try {
let x = successCallback(this.value)
resolvePromise(promise2, x, resolve, reject)
} catch (e) {
reject(e)
}
}, 0)
});
this.failCallback.push(() => {
setTimeout(() => {
try {
let x = failCallback(this.reason)
resolvePromise(promise2, x, resolve, reject)
} catch (e) {
reject(e)
}
}, 0)
});
}
});
return promise2;
}
}
function resolvePromise(promise2, x, resolve, reject) {
if(promise2 === x){
return reject(new TypeError(‘Chaining cycle detected for promise #’))
}
if (x instanceof MyPromise) {
x.then(resolve, reject)
} else {
resolve(x)
}
}
// 导出
module.exports = MyPromise;
// 导入
const MyPromise = require(‘./07.1-捕获错误与then链式调用其他状态’);
let promise = new MyPromise((resolve, reject) => {
// throw new Error(‘executor error’)
// resolve(‘成功’)
// reject(‘失败’)
setTimeout(() => {
resolve(‘2000’)
}, 2000)
})
promise.then(value => {
console.log(value)
// throw new Error(‘then error’)
return 123
}, reason => {
// console.log(reason.message)
return 10000
}).then(value => {
console.log(value)
})
const PENDING = ‘pending’;
const FULFILLED = ‘fulfilled’;
const REJECTED = ‘rejected’;
class MyPromise {
constructor(executor) {
try {
executor(this.resolve, this.reject)
} catch (e) {
this.reject(e);
}
}
status = PENDING;
value = undefined;
reason = undefined;
successCallback = [];
failCallback = [];
resolve = value => {
if (this.status !== PENDING) return;
this.status = FULFILLED;
this.value = value;
while (this.successCallback.length) this.successCallback.shift()()
}
reject = reason => {
if (this.status !== PENDING) return;
this.status = REJECTED;
this.reason = reason;
while (this.failCallback.length) this.failCallback.shift()()
}
then(successCallback, failCallback) {
successCallback = successCallback ? successCallback : value => value;
failCallback = failCallback ? failCallback : reason => { throw reason }
let promise2 = new MyPromise((resolve, reject) => {
if (this.status === FULFILLED) {
setTimeout(() => {
try {
let x = successCallback(this.value)
resolvePromise(promise2, x, resolve, reject)
} catch (e) {
reject(e)
}
}, 0)
} else if (this.status === REJECTED) {
setTimeout(() => {
try {
let x = failCallback(this.reason)
resolvePromise(promise2, x, resolve, reject)
} catch (e) {
reject(e)
}
}, 0)
} else {
this.successCallback.push(() => {
setTimeout(() => {
try {
let x = successCallback(this.value)
resolvePromise(promise2, x, resolve, reject)
} catch (e) {
reject(e)
}
}, 0)
});
this.failCallback.push(() => {
setTimeout(() => {
try {
let x = failCallback(this.reason)
resolvePromise(promise2, x, resolve, reject)
} catch (e) {
reject(e)
}
}, 0)
});
}
});
return promise2;
}
}
function resolvePromise(promise2, x, resolve, reject) {
if(promise2 === x){
return reject(new TypeError(‘Chaining cycle detected for promise #’))
}
if (x instanceof MyPromise) {
x.then(resolve, reject)
} else {
resolve(x)
}
}
// 导出
module.exports = MyPromise;
// 导入
const MyPromise = require(‘./08.1-then方法参数变为可选’);
let promise = new MyPromise((resolve, reject) => {
// resolve(‘成功’)
reject(‘失败’)
})
promise
.then()
.then()
.then(value => console.log(value), reason => { console.log(reason) })
-
用来解决异步并发问题,他允许我们按照异步代码调用的顺序,得到异步代码执行的结果
-
all方法是一个静态方法,所以需要再类当中定义一个all方法,all方法前需要加上static关键字
-
接受一个数组作为参数,数组可以填入任何值,包括普通值和promise对象
-
数组当中值得顺序,一定是我们得到结果的顺序
-
返回值也是一个promise对象,所以我们可以在后边链式调用then方法
-
所有的promise状态都是成功才是成功,有一个失败就为失败
const PENDING = ‘pending’;
const FULFILLED = ‘fulfilled’;
const REJECTED = ‘rejected’;
class MyPromise {
constructor(executor) {
try {
executor(this.resolve, this.reject)
} catch (e) {
this.reject(e);
}
}
status = PENDING;
value = undefined;
reason = undefined;
successCallback = [];
failCallback = [];
resolve = value => {
if (this.status !== PENDING) return;
this.status = FULFILLED;
this.value = value;
while (this.successCallback.length) this.successCallback.shift()()
}
reject = reason => {
if (this.status !== PENDING) return;
this.status = REJECTED;
this.reason = reason;
while (this.failCallback.length) this.failCallback.shift()()
}
then(successCallback, failCallback) {
successCallback = successCallback ? successCallback : value => value;
failCallback = failCallback ? failCallback : reason => { throw reason }
let promise2 = new MyPromise((resolve, reject) => {
if (this.status === FULFILLED) {
setTimeout(() => {
try {
let x = successCallback(this.value)
resolvePromise(promise2, x, resolve, reject)
} catch (e) {
reject(e)
}
}, 0)
} else if (this.status === REJECTED) {
setTimeout(() => {
try {
let x = failCallback(this.reason)
resolvePromise(promise2, x, resolve, reject)
} catch (e) {
reject(e)
}
}, 0)
} else {
this.successCallback.push(() => {
setTimeout(() => {
try {
let x = successCallback(this.value)
resolvePromise(promise2, x, resolve, reject)
} catch (e) {
reject(e)
}
}, 0)
});
this.failCallback.push(() => {
setTimeout(() => {
try {
let x = failCallback(this.reason)
resolvePromise(promise2, x, resolve, reject)
} catch (e) {
reject(e)
}
}, 0)
});
}
});
return promise2;
}
// 静态方法 — 接受一个数组
static all(array) {
let result = [] // 存储Promise对象的结果
let index = 0 // 存储addData()执行次数
// 返回一个Promise对象,传递一个执行器并接受两个参数
return new MyPromise((resolve, reject) => {
/**
-
将promise的值,放入到数组中
-
因为内部需要使用resolve()方法,所以将该函数放入到执行器中
-
*/
function addData(key, value) {
result[key] = value;
index++;
// 判断数组当中所有内容是否执行完毕
if (index === array.length) {
// 防止for循环结束直接调用resolve()时,有异步操作没执行结束!
resolve(result)
}
}
/**
-
循环该数组内所有元素并对其进行一个判断,判断该元素是否为Promise对象
-
*/
for (let i = 0; i < array.length; i++) {
// 拿到当前值
let current = array[i]
// 判断当前是是否是 MyPromise 下的一个实例
if (current instanceof MyPromise) {
// promise对象
current.then(value => addData(i, value), reason => reject(reason))
} else {
// 普通值
addData(i, array[i])
}
}
})
}
}
function resolvePromise(promise2, x, resolve, reject) {
if (promise2 === x) {
return reject(new TypeError(‘Chaining cycle detected for promise #’))
}
if (x instanceof MyPromise) {
x.then(resolve, reject)
} else {
resolve(x)
}
}
// 导出
module.exports = MyPromise;
// 导入
const MyPromise = require(‘./10.1-Promise.All方法的实现’);
function p1() {
return new MyPromise(function (resolve, reject) {
setTimeout(function () {
resolve(‘p1’)
}, 2000)
})
}
function p2() {
return new MyPromise(function (resolve, reject) {
resolve(‘p2’)
})
}
MyPromise.all([‘a’, ‘b’, p1(), p2(), ‘c’]).then(result => console.log(result))
// 11-Promise.All方法的实现.html
function p1() {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve(‘p1’)
}, 2000)
})
}
function p2() {
return new Promise(function (resolve, reject) {
resolve(‘p2’)
})
}
promise.all([‘a’, ‘b’, p1(), p2(), ‘c’]).then(function (result) {
// result -> [‘a’, ‘b’, p1(), p2(), ‘c’]
console.log(result)
});
-
将给定的值转换为Promise对象
-
返回值是一个Promise对象
-
返回的Promise对象当中会包裹给定的值
-
resolve内部会判断传入的值是普通值还是promise对象
-
普通值 — 处理成promise对象
-
promise对象 — 原封不动的将promise对象作为resolve的返回值
const PENDING = ‘pending’;
const FULFILLED = ‘fulfilled’;
const REJECTED = ‘rejected’;
class MyPromise {
constructor(executor) {
try {
executor(this.resolve, this.reject)
} catch (e) {
this.reject(e);
}
}
status = PENDING;
value = undefined;
reason = undefined;
successCallback = [];
failCallback = [];
resolve = value => {
if (this.status !== PENDING) return;
this.status = FULFILLED;
this.value = value;
while (this.successCallback.length) this.successCallback.shift()()
}
reject = reason => {
if (this.status !== PENDING) return;
this.status = REJECTED;
this.reason = reason;
while (this.failCallback.length) this.failCallback.shift()()
}
then(successCallback, failCallback) {
successCallback = successCallback ? successCallback : value => value;
failCallback = failCallback ? failCallback : reason => { throw reason }
let promise2 = new MyPromise((resolve, reject) => {
if (this.status === FULFILLED) {
setTimeout(() => {
try {
let x = successCallback(this.value)
resolvePromise(promise2, x, resolve, reject)
自我介绍一下,小编13年上海交大毕业,曾经在小公司待过,也去过华为、OPPO等大厂,18年进入阿里一直到现在。
深知大多数前端工程师,想要提升技能,往往是自己摸索成长或者是报班学习,但对于培训机构动则几千的学费,着实压力不小。自己不成体系的自学效果低效又漫长,而且极易碰到天花板技术停滞不前!
因此收集整理了一份《2024年Web前端开发全套学习资料》,初衷也很简单,就是希望能够帮助到想自学提升又不知道该从何学起的朋友,同时减轻大家的负担。
既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上前端开发知识点,真正体系化!
由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!
如果你觉得这些内容对你有帮助,可以扫码获取!!(备注:前端)
最后
今天的文章可谓是积蓄了我这几年来的应聘和面试经历总结出来的经验,干货满满呀!如果你能够一直坚持看到这儿,那么首先我还是十分佩服你的毅力的。不过光是看完而不去付出行动,或者直接进入你的收藏夹里吃灰,那么我写这篇文章就没多大意义了。所以看完之后,还是多多行动起来吧!
可以非常负责地说,如果你能够坚持把我上面列举的内容都一个不拉地看完并且全部消化为自己的知识的话,那么你就至少已经达到了中级开发工程师以上的水平,进入大厂技术这块是基本没有什么问题的了。
值 — 处理成promise对象
- promise对象 — 原封不动的将promise对象作为resolve的返回值
const PENDING = ‘pending’;
const FULFILLED = ‘fulfilled’;
const REJECTED = ‘rejected’;
class MyPromise {
constructor(executor) {
try {
executor(this.resolve, this.reject)
} catch (e) {
this.reject(e);
}
}
status = PENDING;
value = undefined;
reason = undefined;
successCallback = [];
failCallback = [];
resolve = value => {
if (this.status !== PENDING) return;
this.status = FULFILLED;
this.value = value;
while (this.successCallback.length) this.successCallback.shift()()
}
reject = reason => {
if (this.status !== PENDING) return;
this.status = REJECTED;
this.reason = reason;
while (this.failCallback.length) this.failCallback.shift()()
}
then(successCallback, failCallback) {
successCallback = successCallback ? successCallback : value => value;
failCallback = failCallback ? failCallback : reason => { throw reason }
let promise2 = new MyPromise((resolve, reject) => {
if (this.status === FULFILLED) {
setTimeout(() => {
try {
let x = successCallback(this.value)
resolvePromise(promise2, x, resolve, reject)
自我介绍一下,小编13年上海交大毕业,曾经在小公司待过,也去过华为、OPPO等大厂,18年进入阿里一直到现在。
深知大多数前端工程师,想要提升技能,往往是自己摸索成长或者是报班学习,但对于培训机构动则几千的学费,着实压力不小。自己不成体系的自学效果低效又漫长,而且极易碰到天花板技术停滞不前!
因此收集整理了一份《2024年Web前端开发全套学习资料》,初衷也很简单,就是希望能够帮助到想自学提升又不知道该从何学起的朋友,同时减轻大家的负担。
[外链图片转存中…(img-oqtriHc7-1712364286312)]
[外链图片转存中…(img-3lL9eXGb-1712364286312)]
既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上前端开发知识点,真正体系化!
[外链图片转存中…(img-HTAI6czz-1712364286313)]
由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!
如果你觉得这些内容对你有帮助,可以扫码获取!!(备注:前端)
最后
今天的文章可谓是积蓄了我这几年来的应聘和面试经历总结出来的经验,干货满满呀!如果你能够一直坚持看到这儿,那么首先我还是十分佩服你的毅力的。不过光是看完而不去付出行动,或者直接进入你的收藏夹里吃灰,那么我写这篇文章就没多大意义了。所以看完之后,还是多多行动起来吧!
可以非常负责地说,如果你能够坚持把我上面列举的内容都一个不拉地看完并且全部消化为自己的知识的话,那么你就至少已经达到了中级开发工程师以上的水平,进入大厂技术这块是基本没有什么问题的了。