面试题分享

1. React 中 keys 的作用是什么？

Keys是react用于追踪哪些列表中元素被修改，被添加或者移除的辅助标识；在开发的过程中，我们需要保证某个元素的key与其同级元素中具有唯一性。在react diff算法中react会借助元素的key值来判断该元素是新创建的还是被移动而来的元素，从而减少不必要的元素重渲染。此外react还需要借助key值来判断元素与本地状态的关联关系；

1. 传入 setState 函数的第二个参数的作用是什么？

setState 第二个参数就是一个回调函数，用于可以实时的获取到更新之后的数据

1. React 中 refs 的作用是什么

Refs是react提供给我们的安全访问dom元素或这个某个组件实例的句柄也就是访问dom节点和访问react元素，我们可以为元素添加ref属性然后在回调函数中接收改元素在dom树中的句柄，该值会作为回调函数的第一个参数返回

1. 在生命周期中的哪一步你应该发起 AJAX 请求

我们把ajax请求放入到ComponentDidMount函数中执行，主要原因就是：react下一代调和算法fiber会通过开始或者停止渲染的方式优化应用性能，其会影响到ComponentWillMount的触发次数，对于ComponentWillMount这个生命周期的调用次数会变得不确定，react可能会多次频繁调用ComponentWillMount。如果我们将ajax请求放到ComponentWillMount函数中，那么显而易见会被触发多次，自然也不是好的选择；

如果我们将ajax请求放置在生命周期的其他函数中，我们并不能保证请求仅在组件挂载完毕后才会要求响应，如果我们的数据请求在组件挂载之前就完成，并且调用了setState函数将数据添加到组件状态中，对于未挂载的组件则会报错，而在ComponentDidMount函数中进行ajax请求则有效避免这个问题

1. shouldComponentUpdate 的作用

shouldComponentUpdate 在更新过程中，会触发render方法来生成新的虚拟dom，进行diff找出需要修改的dom，这个过程是很耗费时间的，在实际的操作中，我们会无意的触发render方法，为了避免不必要的render调用带来的性能消耗，所以react让我们可以在shouldComponent方法决定是否要执行余下的生命周期，默认它是返回true我们也可以手动设置false进行余下的生命周期

1. 概述下 React 中的事件处理逻辑

为了解决跨浏览器兼容性的问题，react会将浏览器原生事件（Browser Native Event）封装成合成事件（SyntheticEvent）传入设置的事件处理器中，这里和城市间提供了与原生事件相同的接口，不过他们屏蔽了底层浏览器的细节差异，保证了行为的一致性。另外。React并没有直接将时间附着到子元素上，而是单一事件监听器的方式将所有的时间发送到顶层进行处理，这样react在更新dom的时候就不需要考虑如何去处理附着在dom上的事件监听器，最终达到优化性能的目的

1. react组件的划分业务组件技术组件？

根据组件的职责通常把组件分为UI组件和容器组件，UI组件一般负责UI的呈现，容器组件负责管理数据和逻辑，两者通过react-redux提供connect方法联系起来

1. react旧版生命周期函数

挂载阶段constructor()在react挂载之前，会调用它的构造函数

ComponentWillMount：在调用render方法之前调用，并在初始化挂载及后续更新的时候都会被调用

ComponentDidMount():在组建挂载后立即调用

更新运行阶段：componentWillReceiveProps在接收父组件改变后的props需要重新渲染组建的时候用到的比较多，外部组件传递频繁的时候会导致效率比较低

ShouldComponentUpdate：用于控制组件重新渲染的生命周期，state发生变化的时候，组件会进入重新渲染的流程当中，在这里return false就可以阻止组件的更新

Render():render方法是class组件中唯一必须实现的方法

ComponentWillUpdate():等shouldComponentUpdate返回true后，组件会进入重新渲染完成之前进行这个函数

ComponentDidUpdate():每次state改变并重新渲染页面后会进入到这个生命周期或者销毁阶段

ComponentWillUnmount:():在此处完成组件的卸载和数据的销毁

1. react性能优化是哪个周期函数

ShouldComponentUpdate，这个方法，用来判断是否需要调用render重新描绘dom，因为dom的描绘非常消耗性能，如果我们在shouldComponentUpdate方法中能够写出更优化的dom diff算法，可以极大的提高性能

1. 为什么虚拟dom会提高性能

虚拟dom的本质就是一个js对象，虚拟dom就是把真实dom转换成一个js对象，然后交由一些技术来处理这个js对象以达到高效率处理dom操作

虚拟dom就相当于在js和真实dom中间加了一个缓存，利用dom diff算法避免了，没有必要的dom操作，从而去提高性能

1. 虚拟react性能优化方案

1. 避免使用内联函数，每次render渲染时，都会创建一个新的函数实例，应该在组件内部创建一个函数，将时间绑定到函数，这样每次调用render时，就不会创建单独的函数实例
2. 使用react fragement避免额外标记，用户创建新组件时，每个组件应具有单个父标签，父级不能有两个标签，所以顶部都要有一个公共标签，所以经常在组件顶部添加额外标签div，这个div标签充当父标签，没有其他的作用，这个时候可以使用fragment，它不会向组件引入任何的额外标记，但是可以作为父级标签
3. 懒加载组件，从工程方便考虑，webpack存在代码拆分的能力，可以为应用创建多个包并在运行时动态加载，减少初始包的大小，在react中使用suspense，lazy组件
4. 事件绑定方式，从性能考虑，在render方法中使用bind和箭头函数，都会生成新的方法实例，在constructor中给使用bind和箭头函数，性能提高
5. 服务器渲染，可以使用用户更快的看到显示成功的页面，服务端可以起一个node服务，可以使用express，koa等，调用react的renderToString方法，将跟组件渲染成字符串，在输出到相应中
6. 组件拆分，合理使用hooks

1. 简述flux 思想

Flux的提出主要是针对现在前端MVC框架的局限总结出来的一套基于dispatcher的前端应用架构模式，按照MVC的命名习惯，他应该叫ASCV；

在flux应用中，数据从action到dispatcher，再到store，最终到view的路线是不可逆的，各个角色之间不会像前段MVC模式那样存在交错的连线；

Flux将一个应用分层了四个部分：1）view视图层2）action：视图发出的消息3）dispatcher：用来接收actions执行回调函数4）store：用来存放应用的状态，一旦发生改变，就提醒views更新页面；

Flux最大的热点：就是数据的“单向流动”，数据总是“单向流动”，任何相邻的部分都不会发生数据的“双向流动”

1. 你对版本管理的理解？常用的版本管理工具有哪些？

版本控制，是维护工程蓝图的标准做法，能够追踪工程蓝图从诞生一直到定案的过程，此外，版本控制也是一种软件工程技巧，借此能在软件开发的过程中，确保由不同人编辑同一个程序文件都能得到同步透过文档控制，能够记录任何工程项目内各个木块的改动历程，并为每次改动编上序号

项目源代码的版本管理工具中，比较常用的主要有CVS,SVN,Git和Mercurial，目前谷歌支持SVN,Git，Mercurial三种方式

1. 你对Git的理解？

Git就是一个仓库管理工具，我们可以利用它很好对代码进行管理，多分支开发，版本回退等操作；git是一个代码托管平台，我们可以利用git将代码放到上面进行托管，git有分支分为本地分支和远程分支，可以理解为分支之间互不干扰，可以处在不同的开发进度上，通过git checkout命令去切换本地分支，与关联远程分支，达到项目的多版本管理的目的

1. Git常用的命令有哪些？

Git clone url：用来接收下载整个代码历史

Git init：初始化仓库

Git add: 提交全部文件修改到暂存区

Git commit -m “<注释>”提交代码到本地仓库，并写提交的注释

Git commit -v提交的时候显示所有的diff信息

Git merge <分支名> 合并分支

Git branch -D <分支名>：删除本地的某个分支

Git branch ：查看本地的所有分支

Git branch -r ：查看远程的所有分支

1. 对git pull 和 git fetch 的理解？有什么区别？

Git fetch是将远程主机的最新内容拉到本地，用户检查了以后决定是否合并到工作本机分支中，而git pull 则是将远程主机的最新内容拉下来后直接合并，这样有可能会产生冲突，需要手动解决，它们两个的相同点：现在作用上它们的功能大致都是相同的都能起到更新代码的作用；不同点：拉取不同：git fetch会将数据拉取到本地仓库，他并不会自动合并或者修改当前工作；commitId不同：git fetch 使用git fetch更新代码，本地的库中master的commitID不变还是等于1；git pull：使用git pull更新改吗，本地的库中master的commitID发生改变，变成了2

1. 你对git rebase 和 git merge的理解？区别？

Git rebase是让提交的记录更加的清晰刻度

Git merge 都用来合并分支

1. git 发生冲突的场景？如何解决？

一般情况下，出现冲突的场景：多个分支代码合并到一个分支的时候；多个分支向同一个远程分支进行推送具体的情况就是，多个分支修改了同一个文件（任何地方）或者多个分支修改了同一个文件名称，如果两个分支中分别修改了不同文件中的部分，是不会产生冲突的，直接合并就可以了，应该在命令中，就是push、pull、stash、rebase等命令下都有可能会产生冲突的情况；

解决：git会用<<<<<<,=======,>>>>>>标记出不同分支的内容：<<<<<<和=======之间的区域就是当前更改的内容；=======和>>>>>>>之间的区域就是传入进来更改的内容，现在就是要将冲突的内容进行更改，对每个文件使用 git add命令来讲其标记为冲突已解决，一旦暂存这些原本有冲突的文件，git就会将他们标记为已解决，然后在提交 git add .. git commit -m “conflict fixed”然后使用git log命令可以看大合并的信息；

当git无法自动合并到分支，就必须首先解决冲突，解决冲突之后，在提交，合并完成，解决冲突就是把git合并失败的文件手动编辑为我们想要的内容，再提交

1. 你对操作系统的理解？核心概念有哪些？

操作系统是一组主管并控制计算机操作、运用和运行硬件，软件资源和提供公共服务来组织用户交互和相互关联的系统软件程序，同时也是计算机系统的内核与基石，简单来说就是操作系统就是一种复杂的软件，相当于软件管家；

核心概念都是对具体物理硬件的抽象，主要有：进程（线程）：进程（线程是操作系统对cpu的抽象）；虚拟内存（地址空间）：虚拟内存是操作系统对物理内存的抽象；文件：文件是操作系统对物理磁盘的抽象；shell：它是一个程序，可以从键盘获取命令，并将其提交给操作系统以执行；GUI：是一种用户界面，语序用户通过图形图标和音频指示与电子设备进行交互；计算机架构：在计算机工程中，计算机体系结构式描述计算机系统功能，阻止和实现的一组规则和方法，主要包括指令集、内存管理、I/O和总线结构；多处理系统：是指计算机同时运行多个程序的能力；程序计数器：程序计数器是一个CPU中寄存器用于指示计算机在其程序序列中的位置；多线程：是指软件或者硬件上实现多个线程并发执行的技术；CPU核心：他是CPU的大脑直接接收指令，并执行计算或运算以满足这些指令，一个CPU可以有多个内核等等等等

1. 什么是进程？什么是线程？区别？

进程是程序的一次运行过程，进程可以看成程序执行的一个实例，进程是系统进行资源分配和调度的一个独立单位

线程是进行的一个实体，是进程的一条执行路径，是CPU调度和分派的基本单位，它是比进程更小的能独立运行的基本单位

区别：地址空间和其他资源：进程间相互独立，同一进程的各线程间共享。某进程内的线程和其他进程内不可见；通信：进程间通信IPC（管道，信号量，共享内存，消息队列），线程就可以直接读写进程数据端（比如全局变量）来进程通信一一需要进程同步和互斥手段的辅助，以保证数据的一致性；调度和切换：线程上下文切换比进程上下文切换快得多；在多线程OS中，进程不是一个可执行的实体；一个程序至少有一个线程