前端面试总结(2020精华题）
前言：
公司如何招到合乎老板心意的前端开发工程师。个人又是如何能够找到心动的企业呢？会解决问题能够培养你独立解决的能力，能提出独树一帜的问题能给人耳目一新的感觉。
正文：
今天我们团队的伙伴面试了一个自称是五年开发经验的人员，但满意程度确实很低。究竟问了些啥？我们一起巩固一下
1.git
首先很多人用过git,git的问法可大可小，可多可少。git也是一个检查面试者是刚刚培训出来的还是真的有工作经验（但是不能保证有几年工作经验）。
常用的git命令：
- git init(创建仓库)
- git status(查看仓库的状态)
- git diff 文件名 (这次相较上次修改了哪些内容)
- git add 文件名 (将添加的文件放到本地暂存区中)
- git commit (将栈存区内容提交到代码区中)
- git clone git地址(将远程仓库的代码克隆到本地)
- git branch 查看当前分支
- git checkout 切换分支
- git rm
# 从版本库中删除文件 - git reset
# 从暂存区恢复到工作文件 - git pull # 抓取远程仓库所有分支更新并合并到本地
- git push -f origin develop 强制提交
(1)、SSH秘钥
1、生成一组SSH秘钥
ssh-keygen -t rsa -f ~/.ssh/id_rsa -P '' -C "你的[email protected]"2、使生成的私钥生效
ssh-agent bash && ssh-add ~/.ssh/id_rsa3、使用下述命令查看公钥，然后在GitLab上，个人设置里，添加SSH的公钥
cat ~/.ssh/id_rsa.pub4、验证秘钥可用性
ssh [email protected](替换为你的GIT服务器地址)（2）、首次提交代码（刚刚被拉进新项目）
//以下是首次提交
git init
git add .
git commit -m "描述"
git remote add origin 远程git分支地址
git pull origin master
git push origin master（3）、更新远程库代码：
//修改后上传
git add -A
git status
git commit -m "描述"
git status
git remote -v
git push origin master（4）、克隆一份代码：
git clone 远程url（5） 、git回滚
如果一不小心提交失败，就可以使用git回滚命令，回滚到上次提交代码之前
git reset --hard HEAD^ 回退到上个版本
git reset --hard HEAD~3 回退到前3次提交之前，以此类推，回退到n次提交之前
git reset --hard “提交id名” 每次提交都会对应唯一的commit id（版本号），git中可以查
到，当然，也可以 git log 查到。（6） 、git撤销
git add后撤销：
git reset HEAD . //撤销所有add文件
git reset HEAD -filename //撤销单个add文件git commit后撤销：
git push后撤销：
git merge 撤销：
建议查看：
https://www.cnblogs.com/songgj/p/8965580.html
https://blog.csdn.net/weixin_38676357/article/details/81333015
（7）git push完后发现远程地址不对，提交不成功，及时修改git远程地址：
2.vue
vue.js是一套构建用户界面的渐进式框架。
这句话可能大家并不陌生,但是真正理解这句话的可能并不多,其实,读懂了这句话,也就明白了vue的核心理念.
那么,怎样理解什么是渐进式框架?在这之前,我们首先要理解什么是框架.在最初的前端开发中,为了完成某个功能,我们需要通过js在HTML页面中获得dom节点,随后获得dom节点中的文本内容或者在dom节点上添加事件,进行一系列的程序操作,但是,如果任务量很大的情况下,代码会随着业务的增加而变得臃肿和混乱,在现实的开发中,负责的逻辑和巨大的开发量,是原生js无法完成的.
这个时候,开发人员将js代码分为了三个板块,数据(Model),逻辑控制(*),视图(View),数据板块只负责数据部分,视图板块负责更改样式,逻辑控制负责联系视图板块和数据板块,这样子有很大的好处,当需求发生变动时,只需要修改对应的板块就好。
3.v-modle的原理:
vue中的双向数据是通过数据劫持(Object.defineProperty())结合发布者-订阅者模式来实现的。
简单的来说，通过Object.defineProperty对监听的每一个属性设置get 和 set 方法。
4.vue-router 和嵌套路由
嵌套路由就是路由里面嵌套他的子路由
子路由关键属性children
每一个子路由里面可以嵌套多个组件
子组件又有路由导航和路由容器
还有一点是正则匹配（正则匹配可以简化很多if繁琐的代码）。
5.vue组件传值
父传子：props
子传父：this.$emit
兄弟之间：bus函数
6.vue的源码
GitHub上面下载vue的源码（https://github.com/vuejs/vue）
7.ref和refs
ref 被用来给DOM元素或子组件注册引用信息，引用信息会根据父组件的 $refs 对象进行注册。如果在普通的DOM元素上使用，引用信息就是元素; 如果用在子组件上，引用信息就是组件实例。
8.对可视化了解多少？svg熟悉吗？
详情：最火Web前端组态软件(可视化)
9.原生js是什么水平
框架解决不了的原生都能解决，原生的也是可大可小。有些项目当前流行的框架根本用不了的时候，你只能用原生去开发了。
10.项目解决冲突的办法
找到冲突的文件，并对比冲突的地方，仔细查看代码。
在这里推荐一个代码文件比较的工具，Beyond，如下图：
11.在项目上如何应用修改之后的element代码
这个还是你真的去接触element源码并修改后多出用到组件才会体会。
感悟：
你只有用尽全力，才可以看起来毫不费力！
参考文章：
- 深入理解vue
- Vue源码系列-Vue中文社区
- vue中的路由及嵌套路由
- 前端项目里常见的十种报错及其解决办法
- 人人都能懂的Vue源码系列(一)—Vue源码目录结构