Daily-Interview-Question

加入「前端面试互助群」学习小组，搜索公众号「高级前端进阶」，关注即可加入！

工作日每天一道大厂前端面试题，一年后再回头，会感谢曾经努力的自己！

线上版本阅读更流畅，点击阅读

推荐一个不错的前端算法系列，点击查看

推荐扫码使用微信小程序，除了本项目之外，还囊括了算法题、选择题等多种类型题目和详细解析

记住我们的 Slogan：上下班路上刷一点，半年突击进大厂

今日面试题

第 162 题：实现对象的 Map 函数类似 Array.prototype.map

解析：第 162 题

最近汇总

第 161 题：用最精炼的代码实现数组非零非负最小值 index

// 例如：[10,21,0,-7,35,7,9,23,18] 输出 5, 7 最小
function getIndex(arr){
      let index=null;
      ...
      return index;
}

解析：第 161 题

第 160 题：输出以下代码运行结果，为什么？如果希望每隔 1s 输出一个结果，应该如何改造？注意不可改动 square 方法

const list = [1, 2, 3]
const square = num => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(num * num)
    }, 1000)
  })
}

function test() {
  list.forEach(async x=> {
    const res = await square(x)
    console.log(res)
  })
}
test()

解析：第 160 题

第 159 题：实现 Promise.retry，成功后 resolve 结果，失败后重试，尝试超过一定次数才真正的 reject

解析：第 159 题

第 158 题：如何模拟实现 Array.prototype.splice

解析：第 158 题

第 157 题：浏览器缓存 ETag 里的值是怎么生成的

解析：第 157 题

第 156 题：求最终 left、right 的宽度

<div class="container">
    <div class="left"></div>
    <div class="right"></div>
</div>

<style>
  * {
    padding: 0;
    margin: 0;
  }
  .container {
    width: 600px;
    height: 300px;
    display: flex;
  }
  .left {
    flex: 1 2 300px;
    background: red;
  }
  .right {
    flex: 2 1 200px;
    background: blue;
  }
</style>

注：此题和 155 题 left、right 样式有些不同

解析：第 156 题

第 155 题：求最终 left、right 的宽度

<div class="container">
    <div class="left"></div>
    <div class="right"></div>
</div>

<style>
  * {
    padding: 0;
    margin: 0;
  }
  .container {
    width: 600px;
    height: 300px;
    display: flex;
  }
  .left {
    flex: 1 2 500px;
    background: red;
  }
  .right {
    flex: 2 1 400px;
    background: blue;
  }
</style>