面试题随记

vue 和  react 的区别：

   共同点：

Vue和React存在着很多的共同点：

• • 数据驱动视图

  • 组件化

  • 都使用 Virtual DOM

   不同点：

1. 核心思想不同

vue的主要特点：灵活易用的渐进式框架，进行数据拦截/代理，它对侦测数据的变化更敏感、更精确。

React推崇函数式编程（纯组件），数据不可变以及单向数据流,当然需要双向的地方也可以手动实现

2. 组件写法差异

React推荐的做法是JSX + inline style, 也就是把 HTML 和 CSS 全都写进 JavaScript 中,即 all in js; 

Vue 推荐的做法是 template 的单文件组件格式(简单易懂，从传统前端转过来易于理解),即 html,css,JS 写在同一个文件(vue也支持JSX写法)

3. diff算法不同

Vue2的核心Diff算法采用了双端比较的算法，同时从新旧children的两端开始进行比较，借助key值找到可复用的节点，再进行相关操作。

react首先对新集合进行遍历，for( name in nextChildren)。通过唯一key来判断老集合中是否存在相同的节点。如果没有的话创建。如果有的话，if (preChild === nextChild )会将节点在新集合中的位置和在老集合中lastIndex进行比较，如果if (child._mountIndex < lastIndex) 进行移动操作，否则不进行移动操作。如果遍历的过程中，发现在新集合中没有，但在老集合中有的节点，会进行删除操作

4. 响应式原理不同

Vue

• Vue依赖收集，自动优化，数据可变。

• Vue递归监听data的所有属性,直接修改。

• 当数据改变时，自动找到引用组件重新渲染。

React基于状态机，手动优化，数据不可变，需要setState驱动新的state替换老的state。当数据改变时，以组件为根目录，默认全部重新渲染, 所以 React 中会需要 shouldComponentUpdate 这个生命周期函数方法来进行控制

5. 其他不同点

Vue为了更加简单易用，引入了指令、filter等概念以及大量的option API

eact的API比较少

————————————————
版权声明：本文为CSDN博主「barnett_y」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/sinat_17775997/article/details/115482179

 

项目的一个整个流程

第一、网站建设的基本流程：需求沟通

建设网站首选要沟通的就是需求，你是要做企业标准网站、还是营销型网站，对网站功能上面有哪些要求，如在线留言，在线下单，或者是产品需要设计制作详情页面等等，还有网站栏目的规划，企业信息对外展示哪些内容，这些都是网站建设的基本信息都要提前沟通好才好开展后面的额工作。

第二、网站建设的基本流程：网站策划

有了网站的基本信息，就要开始网站策划，多少个栏目涉及多少内容，所在行业竞争对手分析，网站设计方案，网站营运方案等等统一策划，并制作出思维导图，策划方案书。

第三、网站建设的基本流程：网站效果图设计

把方案交给设计人员设计制作网页界面，经客户确认效果ok，没问题，那么就可以开始切图制作网页。

第四、网站建设的基本流程：网页设计制作

按照PSD效果图切图，用DIV和CSS制作网页，完成整个网站所有的网页制作。

第五、网站建设的基本流程：网站内容设计发布

网站本地调试，各个版本品牌浏览器和移动设备全面测试网站使用能力，一直到全部正常运行为止。

第六、网站建设的基本流程：网站服务器部署

把做好的网站上传到已经购买好的服务器，运行调试。

第七、网站建设的基本流程：网站测试上线

解析网站域名，开始进入试运营解决，客户确认网站是否需要改进和提升的地方。

第八、网站建设的基本流程：网站维护更新

客户无异议，网站就进入了维护和更新的阶段，定期的更新内容发布企业相关信息。

 

地址栏输入地址后发生了什么

1. 浏览器会根据你输入的URL地址，去查找域名是否被本地DNS服务器缓存，不同浏览器的本地DNS服务器设置不同

• 若本地DNS服务器缓存了对应域名，则直接返回保存好的IP地址
• 若本地DNS服务器没有缓存，浏览器就会发起系统调用，查询本机host文件是否配置了IP地址
• 若本地也没有，则会向网络发起一个DNS查询

3. 在返回IP地址后，浏览器会和目标服务器建立一个TCP连接，在建立连接之后，浏览器会向服务器发送HTTP-GET请求

• 若只是请求一个简单页面，则直接返回
• 若是一些较大的网站站点，往往会重定向（3开头状态码），浏览器获得重定向码之后，在响应报文中找到重定向地址，重新开始第一步访问

代码管理工具

几种常用的代码管理工具：

（1）CVS

　　- 开启版本控制之门

　　- 1990年诞生，“远古时代”的主流源代码管理工具

（2）SVN

　　- 全称是Subversion，集中式版本控制之王者

　　- 是CVS的接班人，速度比CVS快，功能比CVS多且强大

　　- 在国内软件企业中使用最为普遍（70%-90%）

（3）Git

　　-是目前世界上最先进的分布式版本控制系统（没有之一）

（4）ClearCase

　　- 收费的集中式版本控制工具，安装比Windows还大，运行比蜗牛还慢

　　- 能用ClearCase的一般是世界500强，他们有个共同的特点是财大气粗

（5）VSS

　　- 微软的集中式版本控制工具，集成在Visual Studio中

Git使用的注意事项

1. push之前先pull（自动合并，如果有冲突需要手动解决）
2. 如果只是希望看到远端最新代码，使用fetch 命令，并且在本地手动merge并解决冲突（如果有的话）
3. 如果本地有文件还在暂存区，请先本地commit，然后进行pull操作，否则如果存在冲突并解决后，希望回退到自己的代码，则无法实现，所以commit一次就很重要，给git提供一个回退的commit id.
4. 如果希望回退到之前的某个commit id，请使用revert操作（可能需要多次），这样commit时候会产生一个新的commit，可以看出此地曾经存在一个回退。当然如果知道自己在回退操作，也可以使用reset，推送到远程仓库需要git push -f操作，但是你需要确定在commit时间和执行push操作的之间时间段，没有其他人提交新代码，否则不要这么做。
5. 多人协作时候推荐merge而不推荐rebase，除非开发分支只有一个开发人员才可以考虑使用rebase。
6. 使用git rebase进行squash时候，只对本地的commit进行操作，不要对已经push的commit操作，因为需要进行git push -f，但是这样会覆盖别人的提交，有很大风险，同时也会生成新的merge commit，反而效果上适得其反。
7. push自己的commit之前，先考虑下是否需要合并commit，进行squash，不要一个commit只涉及到一个无关紧要的修改。可以随时commit，不要随时push。
8. git merge操作时候如果自动解决冲突的情况下，commit的提交信息是很标准的，如果需要手动解决冲突，提交信息要记录为[source branch]merge to [target branch]: [your message]，不可遗漏branch信息，以后回溯时候不太好查看。
9. 如果希望在更新远端代码时候，不愿意生成一个merge commit，那么可以在git pull加上–rebase参数，是得本地分支变基到远端最新commit上

v-for 和 v-if 的区别

　　在使用中，v-for优先级比v-if高

　　 v-if是动态的向DOM树内添加或者删除DOM元素，v-show是通过设置DOM元素的display样式属性控制显隐。

react 合成事件

　　React合成事件是React 模拟原生DOM事件所有能力 的一个事件对象。
　　根据 W3C规范 来定义合成事件，兼容所有浏览器，拥有与浏览器原声事件相同的接口。

　　合成事件除了拥有和浏览器原生事件相同的接口，包括stopPropagation()和preventDefault()；

⚠️ 在React中，所有事件都是合成的，不是原生DOM事件，可以通过 e.nativeEvent 属性获取原生DOM事件。合成事件不会映射到原生事件；例如：在onMouseLeave事件中event.nativeEvent 将指向mouseout 事件；

　　为什么出现这个技术？
　　　浏览器兼容，实现更好的跨平台
　　　　顶层事件代理机制：保证冒泡一致性，可以跨浏览器执行。将不同平台事件模拟成合成事件；

　　　避免垃圾回收
　　　　React引入事件池，在事件池中获取或释放事件对象；
　　　　React事件对象不会被释放掉，而是存入一个数组中；当事件触发，就从这个数组中弹出，避免频繁地创建和销毁（垃圾回收）；

　　　方便事件统一管理和事务机制

————————————————
版权声明：本文为CSDN博主「Jayson柴」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/weixin_45678402/article/details/119210205