什么是高阶组件、受控组件、非受控组件？
- 高阶组件
是个函数，输出结果是个新组件，可以对输入的组件就行加工，并返回一个具有特定功能的组件。 - 受控组件
相当于input中的value值通过state值获取，onChange事件改变state中的value值。实现了双向绑定，任意一方的数据发生变化，另一方也会随之改变 。 - 非受控组件
不需要设置对应的state属性，可通过ref来直接操作真实的dom。
http的缓存机制
关于HTTP的缓存机制来说，这些缓存策略都会体现在HTTP的头部信息的字段上，这些策略会根据是否需要重新向服务器发起请求可以分为强缓存和协商缓存两大类。
强缓存：请求某个资源文件时，服务端就会在response
header中对该资源文件做缓存配置：cache-control，常见的设置是max-age public private
no-cache no-store immutable等。当用户打开某页面，浏览器会判断缓存是否过期，没有过期就会从缓存中读取数据。
协商缓存：协商缓存就是需要客户端和服务器两端进行交互的；每次请求回来的response
header中的etag和last-modified；下次请求带上，服务端会进行标识和对比，如果资源更新了就会返回新的资源和对应的etag和last-modified；反之资源没有变。
HTML5 存储类型有什么区别？
HTML5 能够本地存储数据，在之前都是使用 cookies 。HTML5 提供了两种本地存储方案： localStorage 用于持久化的本地存储，数据永远不会过期，关闭浏览器也不会丢失。 sessionStorage 同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。
使用箭头函数应注意什么？
（1）用了箭头函数，this就不是指向window，而是父级（指向是可变的）
（2）不能够使用arguments对象
（3）不能用作构造函数，所以不能使用new命令，否则会报错
（4）不可以使用yield命令，因此箭头函数不能用作 Generator 函数
简述es6的新特性
1.增加块作用域
2.增加let const声明方法
3.解构赋值
4.函数参数扩展 （函数参数可以使用默认值、不定参数以及拓展参数）
5.增加class类的支持
6.增加箭头函数
7.增加模块和模块加载
8.增加新的API math, number, string, array, object
请介绍一下Node事件循环的流程
在进程启动时，Node便会创建一个类似于while(true)的循环，每执行一次循环体的过程我们称为Tick。每个Tick的过程就是查看是否有事件待处理。如果有就取出事件及其相关的回调函数。然后进入下一个循环，如果不再有事件处理，就退出进程。
为什么JavaScript是单线程？
作为浏览器脚本语言，JavaScript的主要用途是与用户互动，以及操作DOM。这决定了它只能是单线程，否则会带来很复杂的同步问题。比如，假定JavaScript同时有两个线程，一个线程在某个DOM节点上添加内容，另一个线程删除了这个节点，浏览器不知道该以哪个线程为主，单线程这已经成了这门语言的核心特征。
为了利用多核CPU的计算能力，HTML5提出Web Worker标准，允许JavaScript脚本创建多个线程，但是子线程完全受主线程控制，且不得操作DOM。所以，这个新标准并没有改变JavaScript单线程的本质。
map和forEach的区别？
map和forEach都是对数组的遍历，但是他们是有区别的，forEach()方法不会返回执行结果，而是undefined。也就是说，forEach()会修改原来的数组。而map()方法会得到一个新的数组并返回。
例如，在react经常需要使用数据进行渲染元素的时候，那么这时候，我们就需要使用map了,返回一个新的元素的数组进行渲染。而forEach就是不需要返回新的数据，需要在原数组的每一项上修改的时候，我们经常会用到。
react中context的使用？
context，通过createContext创建一个context，在所有组件的最外层包裹一个provider,然后通过给provider绑定数据以及方法，然后后代组件可以通过tatic contextType 或者consumer来获取context里面的值，如果是consumer的话，那么就是使用一个回调函数，回调函数的参数就是context的值
React路由加载的几种方式？
路由组件的加载一共有三种方式，component\render\children
component可以直接引入组件名，也可以通过一个回调函数去引入一个组件
render只可以通过回调函数引入组件
children和render一样也是通过一个回调函数组件，但是children引入的组件，无论路径是否匹配都显示引入的组件，最后通过match对象的match属性去对应相应的路由，常用于高亮效果等！
提升网页加载速度的方式？（优化）
1、首先可以减少http的请求
2、首页可以使用服务端渲染
3、懒加载图片
4、添加Expires请求头，缓存http访问的组件，下次访问的时候减少不必要的http请求，提高加载速度。
5、使用CDN，减小服务器负担
6、启用GZIP压缩，压缩必要资源，从而给用户发送最小的HTML文件和CSS/JS等资源
节流和防抖
防抖：就是指触发事件后在 n 秒内函数只能执行一次，如果在 n 秒内又触发了事件，则会重新计算函数执行时间。
假设我们网站有个搜索框，用户输入文本我们会自动联想匹配出一些结果供用户选择。
节流：就是指连续触发事件但是在 n 秒中只执行一次函数。节流会稀释函数的执行频率
滚动浏览器滚动条的时候，更新页面上的某些布局内容或者去调用后台的某接口查询内容。
html5的语义化标签给我们带来了啥好处
- 结构清晰
- 可读性好
- 便于团队维护开发
- 搜索引擎可根据标签的语言确定上下文和权重问题，
- 容易被搜索引擎抓住机会
computed和watch的区别？
computed：
如果不使用计算属性，那么 message.split(’’).reverse().join(’’) 就会直接写到 template 里，那么在模版中放入太多声明式的逻辑会让模板本身过重，尤其当在页面中使用大量复杂的逻辑表达式处理数据时，会对页面的可维护性造成很大的影响，而且计算属性如果依赖不变的话，它就会变成缓存，computed的值就不会重新计算。而且他返回的是一个值，同时也不能进行异步操作。所以就有了watch。
watch也是用来监听数据的变化的，watch与computed的区别就是它支持异步，不支持缓存。而且watch在第一次监听的时候不会触发，想要触发必须得在第二个参数上面配置（immeiate）。此外还有另外一个参数是deep，可以用来深度监听一个数组或者是对象。
v-if 和 v-show 区别
v-show 只是在 display: none 和 display: block 之间切换。无论初始条件是什么都会被渲染出来，后面只需要切换 CSS，DOM 还是一直保留着的。所以总的来说 v-show 在初始渲染时有更高的开销，但是切换开销很小，更适合于频繁切换的场景。
v-if 的话就得说到 Vue 底层的编译了。当属性初始为 false 时，组件就不会被渲染，直到条件为 true，并且切换条件时会触发销毁/挂载组件，所以总的来说在切换时开销更高，更适合不经常切换的场景。
并且基于 v-if 的这种惰性渲染机制，可以在必要的时候才去渲染组件，减少整个页面的初始渲染开销。
vue中的key
key 的特殊 attribute 主要用在 Vue 的虚拟 DOM 算法，在新旧 nodes 对比时辨识 VNodes。如果不使用 key，Vue会使用一种最大限度减少动态元素并且尽可能的尝试就地修改/复用相同类型元素的算法。而使用 key 时，它会基于 key 的变化重新排列元素顺序，并且会移除 key 不存在的元素。所以key 的作用主要是为了高效的更新虚拟 DOM。
git怎么删除远程和本地分支
- git branch 查看本地分支
- 删除本地分支，删除需要删除的分支之前切换到别的分支然后执行，git branch --delete 分支名字
- 删除远程分支，git push origin --delete 分支的名字。
div+css 的布局较 table 布局有什么优点？
改版的时候更方便 只要改 css 文件。
页面加载速度更快、结构化清晰、页面显示简洁。
表现与结构相分离。
易于优化（seo）搜索引擎更友好，排名更容易靠前。
div+css布局的好处：
1.符合W3C标准，代码结构清晰明了，结构、样式和行为分离，带来足够好的可维护性。
2.布局精准，网站版面布局修改简单。
3.加快了页面的加载速度（最重要的）。
4.节约站点所占的空间和站点的流量。
5.用只包含结构化内容的HTML代替嵌套的标签，提高另外搜索引擎对网页的搜索效率。
table布局的好处（table布局也不是一点用的没有，这点是毋庸置疑的）
1.容易上手。
2.可以形成复杂的变化，简单快速。
3.表现上更加“严谨”，在不同浏览器中都能得到很好的兼容。
vue路由懒加载方式；
方法一 resolve
这一种方法较常见。它主要是使用了resolve的异步机制，用require代替了import,实现按需加载
方法二 官网方法
vue-router在官网提供了一种方法，可以理解也是为通过Promise的resolve机制。因为Promise函数返回的Promise为resolve组件本身，而我们又可以使用import来导入组件。
方法三 require.ensure
这种模式可以通过参数中的webpackChunkName将js分开打包。
component: resolve => require.ensure([], () => resolve(require(’@/components/’+componentName)), ‘webpackChunkName’)
结合 Vue 的异步组件和 Webpack 的代码分割功能，把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件
redux工作流程；
首先，用户发出 Action。然后，Store 自动调用 Reducer，并且传入两个参数：当前 State 和收到的 Action。 Reducer 会返回新的 State 。State 一旦有变化，Store 就会调用监听函数。listener可以通过store.getState()得到当前状态。如果使用的是 React，这时可以触发重新渲染 View。
Es6 module和commonjs的区别；
CommonJS和ES6 Module是目前使用较为广泛的模块标准。它们的主要区别在于
1.前者建立模块依赖关系是在运行时，后者是在编译时；
2.在模块导入方面，CommonJS导入的是值拷贝，ES6 Module导入的是只读的变量映射；
3.ES6 Module通过其静态特性可以进行编译过程中的优化，并且具备处理循环依赖的能力。
hash、chunkhash、contenthash三者区别
一、hash（所有文件哈希值相同，只要改变内容跟之前的不一致，所有哈希值都改变，没有做到缓存意义）
二、chunkhash（同一个模块，就算将js和css分离，其哈希值也是相同的，修改一处，js和css哈希值都会变，同hash，没有做到缓存意义）
三、contenthash（只要文件内容不一样，产生的哈希值就不一样）
扫一扫
466
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
