pdd二面自我复习版

// 原生js

// input输入框  onChange blur input

// 难处理的问题

// 框选 矩阵检测
// 防抖 节流 防止频繁调用
// 用数据计算的方式 防止卡顿

// 怎么做的矩阵检测 对角
// RAF


// async函数
// Function

async function fn(){
  return 1234;
}
async function test(){
  let result = await fn();
  console.log(result);
}

//pending

let p = new Promise((resolve, reject)=>{
  console.log(4);
  // ...
  if(Math.random()>0.5) resolve('success');
  reject('failed');
})

console.log(1);
test();
console.log(2);
p.then(() => {
  console.log(3);
})
/*
4
1
2
1234
3
*/


function requestPendingFunc(reqFn, timeout) {
  // let res_map = new Map();
  return function(){
    if(reqFn.called) return reqFn.p;
    reqFn.called = true;
    let start = new Date.getTime();
    const p = new Promise((resolve, reject)=>{
      let done = false;
      reqFn().then(data=>{
        resolve(data)
        done = true;
      }, err=>{
        // if((new Date.getTime() - start)/1000 > timeout) reject(err);
        if(done) {
          reject('over time!');
          return;
        }
        reqFn().then(data=>{
            resolve(data);
            done = true;
          },
          err=>{
            done = true;
            reject(err)
          }).finally(_=>done=true);
        reject(err)
      })
      setTimeout(()=>{
        if(done === false) done = !done; reject('over time!')
      }, timeout)
    })
    reqFn.p = p;
    return reqFn.p;
  }
}

const fn1= requestPendingFunc(() => {
  return new Promise((resolve, reject)=>{
    setTimeout(()=>{
      const res = Math.random();
      if(res>0.5) resolve(`success ${res}`);
      reject('failed');
      // ....异步逻辑 会消耗一定的时间
      // ...
    }, Math.random())
  })
}, 5000);
(async function () {
  fn1().then((res) => {
    console.log(1, res);
  })
  fn1().then((res) => {
    console.log(2, res);
  })
  fn1().then((res) => {
    console.log(3, res);
  })
  const res = await fn1();
  console.log(res);
})();
// 弹窗 屏幕垂直居中 如果要求你实现点击其他区域 关掉弹窗

全程项目问题+基础，面试官和我公用文本编辑器来交流。上面是面试结束时的编辑器内容。

input的事件有哪些？
你的项目中有没有解决什么难以处理的问题？
矩阵相交如何检测？
节流、防抖？
了解过RAF吗？
async函数和普通函数的区别？
写一个async函数（和它的调用）？
写一个promise的构造？
promise和同步代码结合的输出？
promise、同步代码、和async结合的输出？
完成一个函数requestPendingFunc，该函数可以传入两个参数：待执行的基本函数和时限。调用该函数返回一个新的函数（也就是下面代码的fn1），如果多次调用这个新的函数（fn1），只要其中一次的调用获得了结果，所有的调用获得同样结果。如果超时，返回失败结果（'overtime'）
在8的基础上，添加一个需求：允许失败后且未超时情况下，再尝试调用一次，其他规则一样。
如果有一个弹窗，如何实现点击弹窗外部后隐藏弹窗？
反问+聊天。

function requestPendingFunc(reqFn, timeout) {}

const fn1= requestPendingFunc(() => {
  return new Promise((resolve, reject)=>{
    setTimeout(()=>{
      const res = Math.random();
      if(res>0.5) resolve(`success ${res}`);
      reject('failed');
      // ....异步逻辑 会消耗一定的时间
      // ...
    }, Math.random())
  })
}, 5000);
(async function () {
  fn1().then((res) => {
    console.log(1, res);
  })
  fn1().then((res) => {
    console.log(2, res);
  })
  fn1().then((res) => {
    console.log(3, res);
  })
  const res = await fn1();
  console.log(res);
})();
//res应该输出同样的值