面试官:react和vue有什么区别吗?
前言
大家好呀,清明节这两天有没有出门踏青扫墓呢!!!
言归正传,这是作者面试系列的第二篇文章!!!!!!!
react和vue是什么?有啥区别吗?
三大框架之二,大家应该都不会陌生,都有学习过或者开发中使用。
但是他们到底有啥区别呢?这个就是我们这篇文章所需探讨并学习的。
开始!
MVC 和 MVVM
首先,来说明下这些字母代表的含义
- M:Model 模型
- V:View 视图
- C:Controller 控制器
- VM:ViewModel 视图模型
首先说下MVC,大家肯定也知道三大框架中的另外一个(anuglar)。
如果你写过angular那就肯定能很清楚的了解这个含义,看如下代码:
<input ng-model="ball.basketball" />.contronller('BallController', ($scope) => {const ball = {basketball: '我是蔡徐坤'}$scope.ball = ball
})
复制代码
input标签很好理解,就是MVC中的V(view)视图。
controller顾名思义,就是MVC中的C(controller)控制器。
ball的话就是MVC中的M(model)模型。
MVC的概念很简单,你要展示一个篮球的页面。
- 设置一个篮球的模型放在那等待使用。
- 写一个你需要展示篮球的视图。
- 使用控制器来让模型和视图交互。
看起来MVC的概念很舒服,框架的很规范,但是代码量多了之后,就会显得整个项目很臃肿,一点都不灵活。
作者有幸维护过一个称为“屎山”的angular1.x项目,因为经过上百次(大概有)的需求迭代后,每个controller的代码超过2000行,每次修bug和写新需求,都需要维护很多方方面面的东西。
然后我们来了解下MVVM。
<input v-model="ball.basketball" />
let vm = new Vue({data: {ball: {baskertball: '蔡徐坤就是我'}}
})
复制代码
- M:Model 模型
- V:View 视图
- VM: ViewModel 视图模型
其实看代码就理解了,vm其实就是vue对象。它的功能就是绑定到view上,Model里的篮球不管更新,还是做其他操作,都会通过vm来通知派发至view。
这样做的好处呢,第一点,一个业务逻辑你就不用写很多遍。类似一个shopcart的功能,你把它的封装成一个组件(ViewModel)在很多地方都可以直接引入调用。
跑题了
写着写着作者就觉得跑题了,其实vue和react都是借鉴了mvvm的概念思想,加上工程师自己的想法而出现的两个优秀框架。
他们的区别:
- vue的标签如v-model,比react的方便,其实也是一层封装好的语法糖,绑一个input也就不用再写change事件之类的。
- react的jsx功能很强大,扩展性极强。
- vue的dom操作很方便,各种方便的for指令 if指令等等。
- react的思想很棒,各种抽象和模式使得代码更加美观等等。
react和vue有什么区别吗?你可以这样说!
- 引出mvc和mvvm的概念。
- 讲解react和vue的底层思想。
- 说出他们的优点和缺点。
- 实践:你在xx项目中,因为xx问题所以选择xx框架。
- 最后说出结论。
例如作者自己对这个问题的解答如下:
- mvc和mvvm具体是指xxxxxxx,他们的区别是xxxx,各方的优缺点xxxx。
- vue的底层是用xxxx实现的,另外碰到数组的话因为有xx缺陷,vue的底层是重写了关于数组的八个函数等等。
- react的jsx功能强大,灵活性强,但是代码必须要规范,每个人都有自己的代码风格。 4.因为项目的迭代更新很快,便于多人开发,所以我选择的是xx框架。
- 其实用任何框架都要根据真实环境下的各种因素结合,并不是哪个框架就是强无敌,拿起来直接黏贴复制一把梭的。
好了这篇需要讲的东西已经结束了。
这是第二篇关于框架优势的一篇文章。
面试系列第一篇: 面试官:你知道Callback Hell(回调地狱)吗?
如果您有收获或者疑问请在下方评论,求赞!谢谢观看到这里。
转载于:https://juejin.im/post/5ca6fd2f6fb9a05e643def4f
面试官:react和vue有什么区别吗?相关推荐
- 【面试题】当面试官让我回答React和Vue框架的区别......
Vue 和 React 作为当前前端两大火热的框架,面试的时候自然不少被提及: 请说一下你对react/vue框架的理解 请对比一下两大框架的优缺点 其实react和vue大体上是相同的,比如都使用虚 ...
- 面试官:说说Vue响应式原理
前言: 经常有面试官会问"你能说说vue的响应式原理吗?很多不明就里的人会说是v-model,其实面试官想问的是vue能实现响应式使用的是JS中的什么API,而且v-model这个属于双向数 ...
- 面试官:说说 typeof 与 instanceof 区别?
一.typeof typeof 操作符返回一个字符串,表示未经计算的操作数的类型 使用方法如下: typeof operand typeof(operand) operand表示对象或原始值的表达式, ...
- 【运维面试】面试官:reids和memcache的区别?
前言 redis和memcache的区别在面试中也经常会被提到,今天我们来看看redis与memcache的知识 概念 memcached: 一款开源的,高性能,分布式的内存系统 redis:一个开源 ...
- 面试官:谈谈equals() 和 == 的区别
引言 谈谈equals() 和 == 的区别,这是一个非常经典的问题,不是特别难,面试也时有问道:但是很多小伙伴在面试时脑子却一片空白,痛失offer:所以在这里我详细介绍一下这两者的区别,希望对你能 ...
- 当面试官问你Vue响应式原理,你可以这么回答他
看过vue官方文档的同学,对这张图应该已然相当熟悉了. vue的响应式是如何实现的? 听过太多回答,通过Object.defineProperty,可是再详细的问时,对方浑然不知. 先撸为敬 cons ...
- 面试官:Java深拷贝和浅拷贝区别
文章目录 一.拷贝的引入 (1).引用拷贝 (2).对象拷贝 二.浅拷贝 (1).定义 (2).浅拷贝实例 三.深拷贝 (1).定义 (2).深拷贝实例 一.拷贝的引入 (1).引用拷贝 创建一个指向 ...
- 面试官:Vue中组件和插件有什么区别?
一.组件是什么 回顾一下对组件的定义: 组件就是把图形.非图形的各种逻辑均抽象为一个统一的概念(组件)来实现开发的模式,在Vue中每一个.vue文件都可以视为一个组件 组件的优势 降低整个系统的耦合度 ...
- 「从源码中学习」面试官都不知道的Vue题目答案
前言 当回答面试官问及的Vue问题,我们除了照本宣科的回答外,其实还可以根据少量的源码来秀一把,来体现出你对Vue的深度了解. 本文会陆续更新,此次涉及以下问题: "new Vue()做了什 ...
最新文章
- Laravel/Lumen搭建服务器性能测试
- SVN钩子HOOK设置自动备份,服务本地可以看到所有更新内容。
- 【差分】Tallest Cow(poj 3263/luogu 2879)
- 计算机硬件系统都是看得见的,计算机组成硬件系统).doc
- 【嵌入式】非操作系统下GPIO口控制器及LED灯编程
- mysql中替代 =_SELECT * WHERE var == [MySQL中的许多替代方法之一]?
- javascript 数组操作函数
- k8s、Deployment多副本资源详解、SERVICE通信、案例一nginx端口暴漏、案例二tomcat端口暴漏、案例三jenkins端口暴漏
- 机器学习入门(五):集成学习Bagging,Boosting,RandomForest和GridSearchCV参数调优
- 网络营销中的几个常见基本术语
- CT图像的三维表面重建
- PMI-ACP证书续证需要多少费用?
- Photoshop各历史版本回顾以及系统要求
- Meta宣布大裁员,超11000人!毕业前夜员工瑟瑟发抖,坐等明早的大礼包开奖!...
- No SQL treatise
- 用PS将一张照片调成简笔画风格
- LM7809三端稳压管TO252封装
- 办公软件商务应用是计算机吗,电子商务中Office办公软件的应用
- c程序第四堂课后作业
- 2021通信行业终极观展指南