滴滴秋储一面
javascript
function runAsync(x){
const p=new Promise(r=>
setTimeout (()=>r(x, console.log (x)), 1000) );
return p;
}
function runReject(x){
const p= new Promise((res, rej)=>
setTimeout(()=> rej(`Error:${x}`,console.log(x)),1000*x) );
return p;
}
Promise.race [runReject (0), runAsync(1), runAsync(2), runAsync(3)]) .then(res=> console.log("result:",res))
.catch(err => console.log(err));输出顺序和原因:
立即输出
0(大约在 0ms 时):因为
runReject(0) 的延迟时间为1000 * 0 = 0ms,会立即执行:jsconsole.log(0) // 输出 0 rej(`Error:0`) // 触发拒绝
立即输出
Error:0(紧接着0 后):
Promise.race 第一个完成的是runReject(0)(拒绝状态),所以进入.catch:jsconsole.log(err) // 输出 "Error:0"
1 秒后连续输出
1 、2 、3:所有
runAsync 的延迟时间都是 1000ms,它们会按调用顺序依次执行:jsconsole.log(1) // 来自 runAsync(1) console.log(2) // 来自 runAsync(2) console.log(3) // 来自 runAsync(3)
javascript
async function async1(){
console.log ("asyncl start");
await async2();
console.log("async1 end");
setTimeout(()=>{
console.log ('timer1')} ,0)
}
async function async2(){
setTimeout(()=>{console.log('timer2') },0)
console.log ("async2");
}
async1();
setTimeout (()=> {console.log ('timer3) }, 0)
console.log ("start")执行步骤:
同步代码执行:
调用
async1()在
async1 中:jsconsole.log("async1 start"); // 输出: async1 start await async2(); // 进入 async2在
async2 中:jssetTimeout(()=>{ console.log('timer2') },0) // 注册宏任务1 console.log("async2"); // 输出: async2
async2 结束,await 之后的代码包装成微任务继续执行全局代码:
jssetTimeout(()=>{ console.log('timer3') },0) // 注册宏任务2 console.log("start"); // 输出: start
微任务队列处理:
执行
await async2() 后的代码:jsconsole.log("async1 end"); // 输出: async1 end setTimeout(()=>{console.log('timer1')},0) // 注册宏任务3
宏任务队列处理(按照注册顺序):
js// 宏任务1(来自 async2): console.log('timer2') → 输出: timer2 // 宏任务2(来自全局): console.log('timer3') → 输出: timer3 // 宏任务3(来自 async1): console.log('timer1') → 输出: timer1
最终输出顺序:
markdown
async1 start // 同步代码
async2 // 同步代码
start // 同步代码
async1 end // 微任务
timer2 // 宏任务 (最先注册)
timer3 // 宏任务
timer1 // 宏任务 (最后注册)
javascript
var obj = {
say: function() {
var f1 = () => {
console.log("1111", this);
}
f1();
},
pro: {
getPro: () => {
console.log(this);
}
}
}
var o = obj.say; // 修正:varo → var o
o();
obj.say();
obj.pro.getPro();执行过程与输出分析:
var o = obj.say; o(); (全局调用) :-
say 方法被直接赋值给变量o,然后作为普通函数调用 - 在非严格模式下,函数内的
this 指向全局对象(浏览器中是window) - 箭头函数
f1 继承外层的this(全局对象) - 输出:
"1111" [Window] (或 Node.js 中的global 对象)
-
obj.say(); (方法调用) :- 通过
obj 对象调用say 方法 - 普通函数的
this 指向调用者obj - 箭头函数
f1 继承外层的this(obj) - 输出:
"1111" [obj 对象]
markdown{ say: function, pro: { ... } }- 通过
obj.pro.getPro(); (箭头函数调用) :-
getPro 是箭头函数,它的this 在定义时确定(词法作用域) - 定义在
pro 对象内部,但对象字面量不创建作用域 - 因此继承外层作用域(全局作用域)
- 输出:
[Window](或 Node.js 中的global 对象)
-
完整输出结果:
markdown
1111 [Window] // o() 的结果
1111 [obj 对象] // obj.say() 的结果
[Window] // obj.pro.getPro() 的结果