什么时候开始记录都不算晚，即使已经是晚了，但是再早的东西也会有淘汰的时候，收藏另说。
问题主要选取一些高频和基础的问题。（问题的回答只是本人的理解，非参考答案，有些答案只给个提示，详解可谷歌百度或在CSDN内搜索相关文章、同时本人每次回顾更新文章都会重新搜一下，与时俱进同步新答案）
JS的基本类型和引用类型有哪些？
答：
基本类型：字符串（String）、数字(Number)、布尔(Boolean)、空（Null）、未定义（Undefined）、Symbol 六种。
引用类型：对象(Object)、数组(Array)、函数(Function)
2、什么是JS的子类型和父类型？
答：
当创建一个类时，您不需要重新编写新的数据成员和成员函数，只需指定新建的类继承了一个已有的类的成员即可。这个已有的类称为基类（父类），新建的类称为派生类（子类）。
3、JS深拷贝和浅拷贝的原理和区别？
答：
浅拷贝：指的是创建新的数据，这个数据有着原始数据属性值的一份精确拷贝，如果属性是基本类型，拷贝的就是基本类型的值。如果属性是引用类型，拷贝的就是内存地址即浅拷贝是拷贝一层，深层次的引用类型则共享内存地址。
深拷贝：开辟一个新的栈，两个对象属完成相同，但是对应两个不同的地址，修改一个对象的属性，不会改变另一个对象的属性。
区别：
浅拷贝只复制属性指向某个对象的指针，而不复制对象本身，新旧对象还是共享同一块内存，修改对象属性会影响原对象。但深拷贝会另外创造一个一模一样的对象，新对象跟原对象不共享内存，修改新对象不会改到原对象
白话来说：拷贝的值（包括对象里面的每一项键值对），前提为拷贝类型为引用类型的情况下，如果是浅拷贝，修改拷贝后的值，被拷贝对象里的值（就是对象里的对象、数组里的数组、对象里的数组）/数组，就如果属性是引用类型，就会跟着改变，如果是比如某个属性字符串，就不会改变，当然拷贝后的值是完全改变的。如果是深拷贝，不管原对象的值是不是引用类型，都不会改变，当然拷贝后的对象完全改变。
小结：
前提为拷贝类型为引用类型的情况下：
浅拷贝是拷贝一层，属性为对象时，浅拷贝是复制，两个对象指向同一个地址
深拷贝是递归拷贝深层次，属性为对象时，深拷贝是新开栈，两个对象指向不同的地址
https://github.com/febobo/web-interview/issues/56
4、JS深拷贝的实现方法？
答：
浅拷贝：
1、正常的右边对象等号赋值给左方对象。
2、Object.assign
3、Array.slice()
4、Array.concat()
5、拓展运算符 [...Array]
深拷贝：拷贝后两个对象的值并不会相等，因为栈地址不同。
1、_.cloneDeep()
2、jQuery.extend()
3、JSON.stringify()、JSON.parse(JSON.stringify(obj1))、此方法不会拷贝对象里面的undefined、函数和 symbol('A')
4、循环递归
https://github.com/febobo/web-interview/issues/56
5、什么是vuex和vue全家桶？
答：
Vuex是一个专为Vue.js应用程序开发的状态管理模式，它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。 Vue全家桶是一个由Vue.js、Vue Router、Vuex和Vue CLI组成的集合，它们可以帮助开发者构建和管理Vue.js应用程序。
6、vuex的五大属性是什么？
答：
Vuex的五大属性是state、getters、mutations、actions、modules。
7、Vuex的 mutation 和 actions 的区别是什么？
答：
Mutation 是指状态的改变，它是对数据的持久性操作，一旦 commit，它就会改变 State；而 Actions 是指对Mutations 的封装，它只是提交 Mutations，不会改变 State，vuex作者不希望你将异步操作放在Mutations中，所以就给你设置了一个区域，让你放异步操作，这就是 Actions，什么异步操作都在action中消化了，最后再去提交mutation的。比如 Mutations 是对数据库中的数据进行修改、更新、删除操作，而 Actions 则是执行一些逻辑和状态转换操作，比如在用户注册时，先执行一个 action 来验证用户名是否已存在，然后再执行一个 mutation 来保存新注册的用户信息。
https://juejin.cn/post/6928468842377117709#heading-12
8、vue的指令有哪一些，什么是vue的自定义指令？
答：
Vue指令有v-if，v-for，v-model，v-show，v-on，v-bind，v-pre，v-cloak，v-once，v-html，v-text等。Vue的自定义指令是指用户可以自己定义指令，以实现特定的功能，并用v-自定义名字的形式调用。Vue自定义指令是Vue.js中可以用来定义自己的特定HTML特性的功能，它可以帮助开发者更轻松地创建交互式用户界面。它们可以是动态的，也可以是静态的，可以用来修改和监测DOM元素，也可以用来为Vue实例添加自定义行为。
9、怎么创建vue的自定义指令？
答：
Vue的自定义指令可以通过Vue.directive()函数来实现，该函数接收两个参数，第一个参数是指令的名称，第二个参数是 一个对象，该对象包含bind、update、unbind等函数，这些函数可以自定义实现指令的功能。
https://github.com/febobo/web-interview/issues/21
10、vue的插槽有哪一些，他们的区别是什么？
答：
- 默认插槽
- 具名插槽
- 作用域插槽
默认插槽：子组件用`<slot>`标签来确定渲染的位置，标签里面可以放`DOM`结构，当父组件使用的时候没有往插槽传入内容，标签内`DOM`结构就会显示在页面。
具名插槽：可以为`<slot>`标签插槽起名，增加 name 属性，允许组件的使用者，在实例中提供多个插槽内容，可以通过具名插槽来控制插槽内容的插入位置。
作用域插槽：子组件在`<slot>`标签作用域上绑定自定义属性来将子组件的信息传给父组件使用，这些属性会被挂在父组件`v-slot`接受的对象上，也就是父组件通过在子组件标签内写 v-slot 接收信息。
https://github.com/febobo/web-interview/issues/16
11、怎么理解浏览器的数据持久化/缓存？
答：
浏览器数据持久化是指，当用户关闭浏览器时，浏览器能够保存用户的数据，使得他们下次打开浏览器时，能够恢复之前的数据状态。这样，用户就可以继续使用浏览器，而不必重新输入所有的信息。
12、5种浏览器数据持久化/缓存的方案和区别？
答：
浏览器缓存方式有 cookie、localStorage、sessionStorage、IndexedDB 和 session 五种。
cookie：Cookie 将状态/数据信息保存在客户端,cookie存储的容量较小，一般<=4KB，cookie可以长期存储。
localStorage：用于长久保存整个网站的本地数据，容量大小有5M，保存的数据没有过期时间，直到手动去除。
sessionStorage：用于临时保存同一窗口(或标签页)的本地数据，容量大小有5M，在关闭窗口或标签页之后将会删除这些数据。
IndexedDB：IndexedDB支持复杂的数据类型，可以存储大量的数据，但是它的API复杂，操作起来比较困难。
session：Session将状态/数据信息保存在服务器端，session存储容量大小没有限制，session在超过一定的操作时间(通常为30分钟)后会失效，但是当关闭浏览器时 浏览器会自动清除掉session中的信息。
13、4种前端的本地存储方法？
答：
浏览器本地存储方式有 cookie、localStorage、sessionStorage、IndexedDB 四种。
14、修改 ui 组件库样式的方法有哪些？
答：
1、直接对当前组件样式进行修改，并加上 !important 提升优先级。
2、前提使用 sass 或者 less 预处理器时，使用 /deep/ 来穿透当前元素样式下组件的样式。
3、使用vue通用穿透样式方法 ::v-deep 直接指向组件样式。
4、不使用 sass 或者 less 预处理器时，直接使用 >>> 三个大于号指向组件样式。
15、有哪几种方法防止样式污染？
答：
1、给页面style 标签加上 scoped,修改的组件样式只在当前页面生效。
2、vue 支持多个 style 标签，给其中一个style 标签加上 scoped，修改的样式只在当前页面生效，另一个style 标签正常写页面其他样式。
3、使用 sass 或者 less 样式预处理器，分块分层嵌套样式。
4、保证样式命名唯一性。
定义全局通用样式，直接在页面标签的 class 属性调用全局样式。
16、什么是css的作用域？
答：
CSS的作用域是指它将CSS声明应用于哪些文档元素。CSS声明可以应用于网站上的所有文档元素，也可以仅应用于特定的文档元素。如标签的 class 属性下的样式，就是属于当前属性的样式范围，如vue 的 scoped, 是当前页面的css作用域。
17、JS同步转异步和异步转同步的实现方式？
答：
拓展：JS 中转异步的应用场景
定时任务：setTimeout、setInterval 网络请求：ajax 请求、axios 请求
事件监听器：addEventListener 同步转异步：首先原本 JS 就是单线程的，也就是同步的，转异步的实现方式有 setTimeout、setInterval、addEventListener ，这种异步场景，不需要我们手动实现异步，直接调用即可。但是对于ajax请求、nodeJs中操作数据库这种异步，实现的方式有：使用最原始的【回调函数】，但是回调函数很容易陷入回调地狱，第二种方式是使用【Promise】或者【Generator】，配合语法糖 async/await 使用。即可实现同步请求/方法转换成异步。
https://mp.weixin.qq.com/s/LBUiTRLeY3FhAKIOkwl_6g
拓展：JS 中转同步的应用场景
A 函数向后台请求得到数据 dataA ，B 函数需要利用到数据 dataA 立即进行一些计算或者向后台请求别的数据，这时候写
`this.A(); `
`this.B(); `
会报错，因为异步的原因，执行 B 的时候 A 的数据 dataA 还没返回。 异步转同步：仍然可以使用 【Promise】，可以在第一个函数请求完了之后，在 .then 里再执行另一个异步函数，函数可以单独写在执行同步函数的同级，也就是一个总方法调用其他两个方法。第二种方式是使用语法糖 async 与 await，在 async 函数里使用 try 与 catch 来实现同步。
https://juejin.cn/post/6914096805437243406
18、什么是 promise？
答：
Promise 是异步编程的一种解决方案： 从语法上讲，promise是一个对象，从它可以获取异步操作的消息；从本意上讲，它是承诺，承诺它过一段时间会给你一个结果。 promise有三种状态： pending(等待态)，fulfiled(成功态)，rejected(失败态)；状态一旦改变，就不会再变。创造promise实例后，它会立即执行。
19、网络请求异步转同步的方法？
答：
使用最原始的【回调函数】，但是回调函数很容易陷入回调地狱，第二种方式是使用【Promise】或者【Generator】，配合语法糖 async/await 使用。即可实现同步请求/方法转换成异步。
20、如何理解async和await，他们解决异步的方案是什么，如果我解决好几个请求如何顺序的执行这几个请求？
答：
`async/await`的用处就是：用同步方式，执行异步操作。想要顺序执行好几个请求，每个请求都使用 Promise 构造函数，然后使用一个 async 来包裹一个方法，方法里面 await 每一个 promise 函数，就可以做到从上到下顺序执行每一个请求。
21、await的实现原理？
答：
await的实现原理是将当前线程挂起，不占用CPU资源，然后将线程放入等待队列，当异步操作完成后，调度器会把等待队列中的线程唤醒，继续执行后续任务。异步编程中，它可以将异步操作以同步操作的形式表达出来，实现原理主要是利用了Promise对象，await 表达式会暂停当前函数的执行，等到异步操作完成，Promise 对象状态变为 resolved，await 表达式才会恢复执行，resolve 的参数会作为 await 表达式的返回值。在async函数中，await规定了异步操作只能一个一个排队执行，从而达到用同步方式，执行异步操作的效果，这里注意了：await只能在async函数中使用，不然会报错。async函数返回的是一个Promise对象，有无值看有无return值，
22、有没有用nodejs开发过接口？
答：
是的，我曾经使用Node.js开发过接口，在这个项目中，我使用了MongoDB作为后端数据库，Express.js框架来构建REST API，并且使用Node.js来处理传入的HTTP请求。
22、怎么使用nodejs开发接口？
答：
1.安装Node.js：使用Node.js开发接口需要安装Node.js，可以从官网下载最新版本的Node.js；
2.创建新项目：使用命令行工具创建一个新的Node.js项目；
3.编写接口代码：使用Express框架编写接口代码；
4.测试接口：使用Postman或curl工具来测试开发的接口；
5.部署接口：使用Nginx或Apache部署接口； 6.监控接口：使用监控工具来监控接口的性能和稳定性。
23、nodejs异步转同步的方式？
答：
可以使用Promise、async/await、generator函数或者Node.js的util模块中的promisify来实现Node.js异步转同步。
24、聊一聊webpack打包原理？
答：
Webpack 是一个模块打包工具，它的原理是分析模块间的依赖关系，最终将入口文件（entry）及其依赖的所有模块组合成一个或多个bundle文件输出到出口（output）。在Webpack中，模块可以是JavaScript、CSS、图片、字体文件等等，Webpack 会递归分析每个模块的依赖关系，最终打包成浏览器可识别的代码。
25、有没有写过uniapp，总共用了哪些技术栈？
答：
我曾经写过uniapp，主要使用的技术栈有：Vue、Vuex、Vue-router、ES6、Sass、Flex布局、小程序原生组件，uniapp相关组件库等。