Skip to content

滴滴秋储一面

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));

输出顺序和原因:

  1. 立即输出 0​(大约在 0ms 时):

    • 因为 runReject(0)​ 的延迟时间为 1000 * 0 = 0ms​,会立即执行:

      js
      console.log(0)  // 输出 0
      rej(`Error:0`) // 触发拒绝
  2. 立即输出 Error:0​(紧接着 0​ 后):

    • Promise.race​ 第一个完成的是 runReject(0)​(拒绝状态),所以进入 .catch​:

      js
      console.log(err) // 输出 "Error:0"
  3. 1 秒后连续输出 123​:

    • 所有 runAsync​ 的延迟时间都是 1000ms,它们会按调用顺序依次执行:

      js
      console.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")

执行步骤:

  1. 同步代码执行:

    • 调用 async1()

    • async1​ 中:

      js
      console.log("async1 start"); // 输出: async1 start
      await async2();              // 进入 async2
    • async2​ 中:

      js
      setTimeout(()=>{ console.log('timer2') },0) // 注册宏任务1
      console.log("async2"); // 输出: async2
    • async2​ 结束,await​ 之后的代码包装成微任务

    • 继续执行全局代码:

      js
      setTimeout(()=>{ console.log('timer3') },0) // 注册宏任务2
      console.log("start"); // 输出: start
  2. 微任务队列处理:

    • 执行 await async2()​ 后的代码:

      js
      console.log("async1 end");  // 输出: async1 end
      setTimeout(()=>{console.log('timer1')},0) // 注册宏任务3
  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();

执行过程与输出分析:

  1. var o = obj.say; o();(全局调用)

    • say​ 方法被直接赋值给变量 o​,然后作为普通函数调用
    • 在非严格模式下,函数内的 this​ 指向全局对象(浏览器中是 window​)
    • 箭头函数 f1​ 继承外层的 this​(全局对象)
    • 输出: "1111" [Window]​ (或 Node.js 中的 global​ 对象)
  2. obj.say();(方法调用)

    • 通过 obj​ 对象调用 say​ 方法
    • 普通函数的 this​ 指向调用者 obj
    • 箭头函数 f1​ 继承外层的 this​(obj​)
    • 输出: "1111" [obj 对象]
    markdown
    {
      say: function,
      pro: { ... }
    }
  3. obj.pro.getPro();(箭头函数调用)

    • getPro​ 是箭头函数,它的 this​ 在定义时确定(词法作用域)
    • 定义在 pro​ 对象内部,但对象字面量不创建作用域
    • 因此继承外层作用域(全局作用域)
    • 输出: [Window]​(或 Node.js 中的 global​ 对象)

完整输出结果:

markdown
1111 [Window]      // o() 的结果
1111 [obj 对象]    // obj.say() 的结果
[Window]           // obj.pro.getPro() 的结果
本站访客数 人次 本站总访问量