AI prompts
base on 我是依扬（木易杨），公众号「高级前端进阶」作者，每天搞定一道前端大厂面试题，祝大家天天进步，一年后会看到不一样的自己。 # Daily-Interview-Question
加入「前端面试互助群」学习小组，搜索公众号「高级前端进阶」，关注即可加入！
工作日每天一道大厂前端面试题，一年后再回头，会感谢曾经努力的自己！
[线上版本阅读更流畅，点击阅读](https://muyiy.cn/question/)
<br/>
[推荐一个不错的前端算法系列，点击查看](https://github.com/sisterAn/JavaScript-Algorithms)
<br/>
推荐扫码使用微信小程序，除了本项目之外，还囊括了算法题、选择题等多种类型题目和详细解析
记住我们的 Slogan：上下班路上刷一点，半年突击进大厂
<img src="http://resource.muyiy.cn/image/20200106214930.jpg" height="250px">
<br/>
## 今日面试题
第 162 题：实现对象的 Map 函数类似 Array.prototype.map
解析：[第 162 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/431)
<br/>
## 最近汇总
第 161 题：用最精炼的代码实现数组非零非负最小值 index
```js
// 例如：[10,21,0,-7,35,7,9,23,18] 输出 5, 7 最小
function getIndex(arr){
let index=null;
...
return index;
}
```
解析：[第 161 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/421)
<br/>
第 160 题：输出以下代码运行结果，为什么？如果希望每隔 1s 输出一个结果，应该如何改造？注意不可改动 square 方法
```js
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 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/389)
<br/>
第 159 题：实现 `Promise.retry`，成功后 `resolve` 结果，失败后重试，尝试超过一定次数才真正的 `reject`
解析：[第 159 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/387)
<br/>
第 158 题：如何模拟实现 Array.prototype.splice
解析：[第 158 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/384)
<br/>
第 157 题：浏览器缓存 ETag 里的值是怎么生成的
解析：[第 157 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/383)
<br/>
第 156 题：求最终 left、right 的宽度
```js
<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 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/382)
<br/>
第 155 题：求最终 left、right 的宽度
```js
<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>
```
解析：[第 155 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/381)
<br/>
第 154 题：弹性盒子中 flex: 0 1 auto 表示什么意思
解析：[第 154 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/380)
<br/>
第 153 题：实现一个批量请求函数 multiRequest(urls, maxNum)
要求如下：
1. 要求最大并发数 maxNum
2. 每当有一个请求返回，就留下一个空位，可以增加新的请求
3. 所有请求完成后，结果按照 urls 里面的顺序依次打出
解析：[第 153 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/378)
<br/>
2019-12-31
> 第 152 题：实现一个 normalize 函数，能将输入的特定的字符串转化为特定的结构化数据
解析：[第 152 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/331)
<br/>
2019-11-25
> 第 151 题：用最简洁代码实现 indexOf 方法
>
解析：[第 151 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/321)
<br/>
2019-11-21
> 第 150 题：二分查找如何定位左边界和右边界
>
> 不使用JS数组API，查找有序数列最先出现的位置和最后出现的位置
解析：[第 150 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/320)
<br/>
2019-11-12
> 第 149 题：babel 怎么把字符串解析成 AST，是怎么进行词法/语法分析的？
解析：[第 149 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/315)
<br/>
2019-11-01
> 第 148 题： webpack 中 loader 和 plugin 的区别是什么（平安）
解析：[第 148 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/308)
<br/>
2019-10-31
> 第 147 题：v-if、v-show、v-html 的原理是什么，它是如何封装的？
解析：[第 147 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/307)
<br/>
2019-10-29
> 第 146 题：Vue 中的 computed 和 watch 的区别在哪里（虾皮）
解析：[第 146 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/304)
<br/>
2019-10-24
> 第 145 题：前端项目如何找出性能瓶颈（阿里）
解析：[第 145 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/300)
<br/>
2019-10-22
> 第 144 题：手写二进制转 Base64（阿里）
解析：[第 144 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/299)
<br/>
2019-10-21
> 第 143 题：将 '10000000000' 形式的字符串，以每 3 位进行分隔展示 '10.000.000.000'
解析：[第 143 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/296)
<br/>
2019-10-17
> 第 142 题：（算法题）求多个数组之间的交集（阿里）
解析：[第 142 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/293)
<br/>
2019-10-15
> 第 141 题：Vue 中的 computed 是如何实现的（腾讯、平安）
解析：[第 141 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/291)
<br/>
2019-10-14
> 第 140 题：为什么 HTTP1.1 不能实现多路复用（腾讯）
解析：[第 140 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/290)
<br/>
2019-09-17
> 第 139 题：谈一谈 nextTick 的原理
解析：[第 139 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/281)
<br/>
2019-09-11
> 第 138 题：反转链表，每 k 个节点反转一次，不足 k 就保持原有顺序（哔哩哔哩）
解析：[第 138 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/278)
<br/>
2019-09-04
> 第 137 题：如何在 H5 和小程序项目中计算白屏时间和首屏时间，说说你的思路
解析：[第 137 题](https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/272)
<br/>
## 所有面试题汇总
- [壹题所有题目及答案汇总](https://github.com/Advanced-Frontend/Daily-Interview-Question/blob/master/datum/summary.md)
<br/>
## 半月刊
- [前端 100 问：能搞懂 80% 的请把简历给我](https://github.com/yygmind/blog/issues/43)
- [【半月刊 1】前端高频面试题及答案汇总](https://juejin.im/post/5c6977e46fb9a049fd1063dc)
- [【半月刊 2】前端高频面试题及答案汇总](https://juejin.im/post/5c7bd72ef265da2de80f7f17)
- [【半月刊 3】前端高频面试题及答案汇总](https://juejin.im/post/5c9ac3f66fb9a070e056718f)
- [【半月刊 4】前端高频面试题及答案汇总](https://juejin.im/post/5cb3376bf265da039c0543da)
<br/>
## 联系我
进阶系列文章汇总如下，觉得不错点个 star，欢迎 **加群** 互相学习。
> [https://github.com/yygmind/blog](https://github.com/yygmind/blog)
我是木易杨，公众号「高级前端进阶」作者，跟着我**每周重点攻克一个前端面试重难点**。接下来让我带你走进高级前端的世界，在进阶的路上，共勉！
", Assign "at most 3 tags" to the expected json: {"id":"8188","tags":[]} "only from the tags list I provide: [{"id":77,"name":"3d"},{"id":89,"name":"agent"},{"id":17,"name":"ai"},{"id":54,"name":"algorithm"},{"id":24,"name":"api"},{"id":44,"name":"authentication"},{"id":3,"name":"aws"},{"id":27,"name":"backend"},{"id":60,"name":"benchmark"},{"id":72,"name":"best-practices"},{"id":39,"name":"bitcoin"},{"id":37,"name":"blockchain"},{"id":1,"name":"blog"},{"id":45,"name":"bundler"},{"id":58,"name":"cache"},{"id":21,"name":"chat"},{"id":49,"name":"cicd"},{"id":4,"name":"cli"},{"id":64,"name":"cloud-native"},{"id":48,"name":"cms"},{"id":61,"name":"compiler"},{"id":68,"name":"containerization"},{"id":92,"name":"crm"},{"id":34,"name":"data"},{"id":47,"name":"database"},{"id":8,"name":"declarative-gui "},{"id":9,"name":"deploy-tool"},{"id":53,"name":"desktop-app"},{"id":6,"name":"dev-exp-lib"},{"id":59,"name":"dev-tool"},{"id":13,"name":"ecommerce"},{"id":26,"name":"editor"},{"id":66,"name":"emulator"},{"id":62,"name":"filesystem"},{"id":80,"name":"finance"},{"id":15,"name":"firmware"},{"id":73,"name":"for-fun"},{"id":2,"name":"framework"},{"id":11,"name":"frontend"},{"id":22,"name":"game"},{"id":81,"name":"game-engine "},{"id":23,"name":"graphql"},{"id":84,"name":"gui"},{"id":91,"name":"http"},{"id":5,"name":"http-client"},{"id":51,"name":"iac"},{"id":30,"name":"ide"},{"id":78,"name":"iot"},{"id":40,"name":"json"},{"id":83,"name":"julian"},{"id":38,"name":"k8s"},{"id":31,"name":"language"},{"id":10,"name":"learning-resource"},{"id":33,"name":"lib"},{"id":41,"name":"linter"},{"id":28,"name":"lms"},{"id":16,"name":"logging"},{"id":76,"name":"low-code"},{"id":90,"name":"message-queue"},{"id":42,"name":"mobile-app"},{"id":18,"name":"monitoring"},{"id":36,"name":"networking"},{"id":7,"name":"node-version"},{"id":55,"name":"nosql"},{"id":57,"name":"observability"},{"id":46,"name":"orm"},{"id":52,"name":"os"},{"id":14,"name":"parser"},{"id":74,"name":"react"},{"id":82,"name":"real-time"},{"id":56,"name":"robot"},{"id":65,"name":"runtime"},{"id":32,"name":"sdk"},{"id":71,"name":"search"},{"id":63,"name":"secrets"},{"id":25,"name":"security"},{"id":85,"name":"server"},{"id":86,"name":"serverless"},{"id":70,"name":"storage"},{"id":75,"name":"system-design"},{"id":79,"name":"terminal"},{"id":29,"name":"testing"},{"id":12,"name":"ui"},{"id":50,"name":"ux"},{"id":88,"name":"video"},{"id":20,"name":"web-app"},{"id":35,"name":"web-server"},{"id":43,"name":"webassembly"},{"id":69,"name":"workflow"},{"id":87,"name":"yaml"}]" returns me the "expected json"