⑴ 什么是"前端工程化"
前端工程化是指使用软件工程的技术和方法来进行前端的开发流程、技术、工具、经验等规范化、标准化。其主要目的为了提高效率和降低成本，即提高开发过程中的开发效率，减少不必要的重复工作时间。
前端工程化是前端架构中重要的一环，主要就是为了解决上述大部分问题的。而前端工程本质上是软件工程的一种，因此我们应该从软件工程的角度来研究前端工程。
前端工程化有四个特点：模块化、组件化、自动化、规范化。
1、模块化：
就是将一个大文件拆分成相互依赖的小文件，再进行统一的拼装和加载。只有这样，才有多人协助的可能。在工程化之前，一直是使用js、jquery、ajax，这没有模块概念，对于开发大型且复杂的系统会有一定的限制。
2、组件化：
组件化≠模块化。模板化只是在文件层面上，对代码和资源的拆分；组件化是在设计层面上，对于UI的拆分。目前市场上的组件化框架最多，主要的有Vue，React，Angular2。
3、自动化：
“简单重复的工作交给机器来做”，自动化也就是有很多自动化工具代替我们来完成，例如持续集成、自动化构建、自动化部署、自动化测试等等。
4、规范化：（至关重要的一环）
在项目规划初期制定的好坏对于后期的开发有一定影响。包括的规范有：
目录结构的制定、编码规范、前后端接口规范、文档规范、组件管理、Git分支管理、Commit描述规范、定期codeReview、视觉图标规范。
(1)前端组件化开发是什么扩展阅读：
为什么需要前端工程化：
前端越来越复杂，设计的问题和环节也越来越多，不采用工程化管理，就无法很好的实现团队协同和降低复杂性。 原因如下：
1、前端范畴不断扩大
早期的前端只需要适配桌面浏览器，而现在的前端，需要适配不同类型和尺寸的设备，包括移动端网页，app应用等。
2、前后端分离
早期的前端只是后端 MVC 框架的一层模块， 而现在的前端普遍是从后端接口获取数据，编写处理逻辑，各种前端mvc前端框架也层出不穷。
3、模块化开发的出现
现在的前端开发不再是从零写起，重复造轮子，而是会引用大量内部和外部的组件和模块，这也导致前端必须进行模块管理。
4、转码器的盛行
为了提高效率，前端工程往往不会直接写html,css,和js代码，而是改用其他格式书写，再用工具编译为目标格式。
比如用Jade 写HTML，用less、sass、stylus 编写CSS,用ES6、Typescript编写JavaScript。
5、开发流程和团队
早期的前端团队往往只有几个人，而现在的前端团队可以扩展到几十人，甚至上百人。每个人只负责自己的一块内容。所以，如何协调多人多团队的工作，保证沟通顺畅，保证权限管理，越来越成为一大问题。
前端工程化的具体内容：
1、代码规范: 保证团队所有成员以同样的规范开发代码。
2、分支管理: 不同的开发人员开发不同的功能或组件，按照统一的流程合并到主干。
3、模块管理: 一方面，团队引用的模块应该是规范的;另一方面，必须保证这些模块可以正确的加入到最终编译好的包文件中。
4、自动化测试：为了保证和并进主干的代码达到质量标准，必须有测试，而且测试应该是自动化的，可以回归的；
5、构建：主干更新以后，自动将代码编译为最终的目标格式，并且准备好各种静态资源；
6、部署：将构建好的代码部署到生产环境。
⑵ Web前端学习新手的常见疑问汇总
今天小编要跟大家分享的文章是关于Web前端学习新手的常见疑问汇总。正在学习web前端工作的小伙伴们来和小编一起看一看吧，希望本篇文章能够对小伙伴们有所帮助。
1、Vue.js是什么?
渐进式框架
自底向上增量开发的设计
易学习
易整合
Vue.js(读音/vju_/,类似于view)是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue
采用自底向上增量开发的设计。Vue的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue完全有能力驱动采用单文件组件和
Vue生态系统支持的库开发的复杂单页应用。
2、vue.js到底适合做哪种类型的界面?
a、表单项繁多
b、内容需要根据用户的操作进行修改
Vue.js就是一个用于搭建类似于网页版知乎这种表单项繁多，且内容需要根据用户的操作进行修改的网页版应用。
3、单页应用程序(SPA)是什么?
一个页面就是应用(子应用)
顾名思义，单页应用一般指的就是一个页面就是应用，当然也可以是一个子应用，比如说知乎的一个页面就可以视为一个子应用。单页应用程序中一般交互处理非常多，而且页面中的内容需要根据用户的操作动态变化。
4、前面说的网页版知乎我也可以用JQuery写啊，为什么要用Vue.js呢?
a、产品是绝对需要反复修改的
b、修改可能会导致DOM的关联与嵌套层次要发生改变从而使jquery结构相关代码变的异常复杂
c、vue.js可以解决这个问题
你是否还记得你当初写JQuery的时候，有写过('#xxx').parent().parent().parent()这种代码呢?当你第一次写的时候，你觉得页面元素不多，不就是找这个元素的爸爸的爸爸的爸爸吗，我大不了在注释里面写清楚这个元素的爸爸的爸爸的爸爸不就好了。但是万一过几天之后你的项目组长或者你的产品经理突然对你做的网页提出修改要求，这个修改要求将会影响页面的结构，也就是DOM的关联与嵌套层次要发生改变，那么(‘#xxx’).parent().parent().parent()可能就会变成$(‘#xxx’).parent().parent().parent().parent().parent()了。
这还不算什么，等以后产品迭代越来越快，修改越来越多，而且页面中类似的关联和嵌套DOM元素不止一个，那么修改起来将非常费劲。而且JQuery选择器查找页面元素以及DOM操作本身也是有性能损失的，可能到时候打开这个页面，会变得越来越卡，而你却无从下手。
这个时候如果你学过Vue.js，那么这些抱怨将不复存在。
5、前端里面常说的视图层是什么?
我们把HTML中的DOM就可以与其他的部分独立开来划分出一个层次，这个层次就叫做视图层。
Vue的核心库只关注视图层
6、使用jquery开发完整页面的流程?
a、html写构架
b、css装饰
c、js交互
讲到JQuery，就不得不说到JavaScript的DOM操作了。如果你用JQuery来开发一个知乎，那么你就需要用JQuery中的各种DOM操作方法去操作HTML的DOM结构了。
现在我们把一个网页应用抽象一下，那么HTML中的DOM其实就是视图，一个网页就是通过DOM的组合与嵌套，形成了最基本的视图结构，再通过CSS的修饰，在基本的视图结构上“化妆”让他们看起来更加美观。最后涉及到交互部分，就需要用到JavaScript来接受用户的交互请求，并且通过事件机制来响应用户的交互操作，并且在事件的处理函数中进行各种数据的修改，比如说修改某个DOM中的innerHTML或者innerText部分。
7、Vue.js为什么能让基于网页的前端应用程序开发起来这么方便?
a、有声明式
b、响应式的数据绑定
c、组件化的开发
d、VirtualDOM
因为Vue.js有声明式，响应式的数据绑定，与组件化的开发，并且还使用了VirtualDOM这个看名字就觉得高大上的技术。
8、vue.js中常说的数据动态绑定是什么?
就是vue.js会自动响应数据的变化情况，并且根据用户在代码中预先写好的绑定关系，对所有绑定在一起的数据和视图内容都进行修改。而这种绑定关系，在图上是以input
标签的v-model属性来声明的，因此你在别的地方可能也会看到有人粗略的称vue.js为声明式渲染的模版引擎。
9、前端中为什么要组件化开发?
a、非组件化开发代码和工作量都非常大
b、修改起来生不如死
但是现在我们做单页应用，页面交互和结构十分复杂，一个页面上就有许许多多的模块需要编写，而且往往一个模块的代码量和工作量就非常庞大，如果还按照原先的方法来开发，那么会累死人。而且遇到以后的产品需求变更，修改起来也非常麻烦，生怕动了其中一个div之后，其他div跟着雪崩，整个页面全部乱套，或者由于JavaScript的事件冒泡机制，导致修改一些内层的DOM事件处理函数之后，出现各种莫名其妙的诡异BUG。
10、前端中如何进行组件化开发?
a、借用的后端的面向对象中的模块化思想(把一些大功能拆分成许多函数，然后分配给不同的人来开发)
b、把一个单页应用中的各种模块拆分到一个一个单独的组件(component)中，我们只要先在父级应用中写好各种组件标签(占坑)，并且在组件标签中写好要传入组件的参数(就像给函数传入参数一样，这个参数叫做组件的属性)，然后再分别写好各种组件的实现(填坑)
在面向对象编程中，我们可以使用面向对象的思想将各种模块打包成类或者把一个大的业务模块拆分成更多更小的几个类。在面向过程编程中，我们也可以把一些大功能拆分成许多函数，然后分配给不同的人来开发。
在前端应用，我们是否也可以像编程一样把模块封装呢?这就引入了组件化开发的思想。
Vue.js通过组件，把一个单页应用中的各种模块拆分到一个一个单独的组件(component)中，我们只要先在父级应用中写好各种组件标签(占坑)，并且在组件标签中写好要传入组件的参数(就像给函数传入参数一样，这个参数叫做组件的属性)，然后再分别写好各种组件的实现(填坑)，然后整个应用就算做完了。
11、为什么有VirtualDOM技术?
a、问题
现在的网速越来越快了，很多人家里都是几十甚至上百M的光纤，手机也是4G起步了，按道理一个网页才几百K，而且浏览器本身还会缓存很多资源文件，那么几十M的光纤为什么打开一个之前已经打开过，已经有缓存的页面还是感觉很慢呢?
b、原因
(1)、浏览器本身处理DOM也是有性能瓶颈的
(2)、用JQuery或者原生的JavaScriptDOM操作函数对DOM进行频繁操作的时候，浏览器要不停的渲染新的DOM树
这就是因为浏览器本身处理DOM也是有性能瓶颈的，尤其是在传统开发中，用JQuery或者原生的JavaScript
DOM操作函数对DOM进行频繁操作的时候，浏览器要不停的渲染新的DOM树，导致页面看起来非常卡顿。
12、VirtualDOM如何实现?
a、预计算dom的各种操作，把最后一次的结果渲染出来(减少dom的渲染次数)
而Virtual
DOM则是虚拟DOM的英文，简单来说，他就是一种可以预先通过JavaScript进行各种计算，把最终的DOM操作计算出来并优化，由于这个DOM操作属于预处理操作，并没有真实的操作DOM，所以叫做虚拟DOM。最后在计算完毕才真正将DOM操作提交，将DOM操作变化反映到DOM树上。
13、到底该怎么用Vue.js做单页应用开发?
其实可以直接看学习视频开始干，应该是最好的
a、介绍-vue.js官方文档的基础部分硬着头皮看一遍
我的建议是，先把介绍-
vue.js官方文档的基础部分硬着头皮看一遍。除了组件这个小节涉及到了很多晦涩难懂的名词以外，前面几章完全就是把Vue.js当作一个模版引擎来用。
b、ECMAScript6，Webpack，NPM以及Vue-Cli的基本用法，最好对Node.js也要有所了解
然后开始学习ECMAScript6，Webpack，NPM以及Vue-Cli的基本用法，最好对Node.js也要有所了解。
c、看网上各种实战视频以及文章还有别人开源的源代码
最后组件部分先大致看一遍，了解组件里面都有哪些概念之后，开始看网上各种实战视频以及文章还有别人开源的源代码。
14、ECMAScript是啥?
ECMAScript和JavaScript的关系是，前者是后者的规格，后者是前者的一种实现(另外的ECMAScript方言还有
Jscript和ActionScript)。日常场合，这两个词是可以互换的。
而ECMAScript6就是新一代的JavaScript语言。
15、Webpack是啥?
a、前端打包工具
Webpack是一个前端打包和构建工具。如果你之前一直是手写HTML，CSS，JavaScript，并且通过link标签将CSS引入你的HTML文件，以及通过Script标签的src属性引入外部的JS脚本，那么你肯定会对这个工具感到陌生。不要紧，我们先来了解一下为什么要用Webpack，然后带着原因去学习就好了。
16、为什么要用Webpack?
a、方便管理各种素材
b、打包以便减少浏览器的访问次数
前面说了，做一个单页应用程序本身就相当复杂，而且在做的时候肯定会使用到很多素材和别的第三方库，我们该如何去管理这些东西呢?
还有前面讲到了Webpack是一个前端打包工具，前端代码为什么要打包呢?因为单页应用程序中用到很多素材，如果每一个素材都通过在HTML中以src属性或者link来引入，那么请求一个页面的时候，可能浏览器就要发起十多次请求，往往请求的这些资源都是一些脚本代码或者很小的图片，这些资源本身才几k，下载连1秒都不需要，但是由于HTTP是应用层协议，它的下层是TCP这个运输层协议，TCP的握手和挥手过程消耗的时间可能比下载资源本身还要长，所以需要把这些小文件全部打包成一个文件，这样只要一次TCP握手和挥手的过程，就把多个资源给下载下来了，并且多个资源由于都是共享一个HTTP请求，所以head等部分也是共享的，相当于形成了规模效应，让网页展现更快，用户体验更好。
17、NPM和Node.js又是什么?它们是什么关系?
a、Node.js是一个服务端的JavaScript运行环境
Node.js是一个服务端的JavaScript运行环境，通过Node.js可以实现用JavaScript写独立程序。
b、Node.js可以写独立程序(Webpack就是Node.js写的)
像我们之前提到的Webpack就是Node.js写的，所以作为一个前端开发，即使你不用Node.js写独立程序，也得配一个Node.js运行环境，毕竟很多前端工具都是使用它写的。
c、NPM是一个node.js的包管理器(类似java的maven(包的依赖管理)，php也有一个类似的)。
NPM是一个node.js的包管理器。我们在传统开发的时候，JQuery.js大多都是网络搜索，然后去官网下载，或者直接引入CDN资源，这种方法太过于麻烦。如果以后遇到其他的包，这个包的代码本身可能还调用了其他的包(也称这个包和其他的那几个包存在依赖关系)，那么我们要在自己的项目中引入一个包将变得十分困难。现在我们有了NPM这个包管理器，直接可以通过
npminstallxxx包名称
的方式引入它，比如说
npminstallvue
18、Vue-CLi是啥?
它是一个vue.js的脚手架工具。说白了就是一个自动帮你生成好项目目录，配置好Webpack，以及各种依赖包的工具，它可以通过
npminstallvue-cli-g
的方式安装，后面的-g表示全局安装的意思，意味着你可以打开命令行之后直接通过vue命令调用它。
19、Vuex和Vue-route是什么(暂时了解即可)?
Vuex是vue的一个状态管理器。用于集中管理一个单页应用程序中的各种状态。
Vue-route是vue的一个前端路由器，这个路由器不是我们上网用的路由器，而是一个管理请求入口和页面映射关系的东西。它可以实现对页面局部进行无刷新的替换，让用户感觉就像切换到了网页一样。
要讲清楚这两个东西，又得花费大量篇幅，所以这里只是简单提一下，先学好vue.js本身才是最重要的。
以上就是小编今天为大家分享的关于Web前端学习新手的常见疑问汇总的文章，希望本篇文章能够对正在学习web前端知识的小伙伴们有所帮助，想要了解更多web前端相关知识记得关注北大青鸟web前端培训官网，最后祝愿小伙伴们学习成功，成为一名优秀的web前端工程师。
来源：原创小才君软件编程网站开发
⑶ 在前端中什么是组件化 什么是模块化
模块化更一种开发规范，比如cmd amd 是为了更好的解藕，比如一个网站，按照不同的模块来开发，比如你有个评论区，a 项目有，b 项目有，如果仅是单纯的模块开发，这个js 文件你就可以单独来回引用，
更比如 ，一个页面 分好多个功能， 这时候你要是都写在一个js 中 会越来越大，
而你把他分成不同的模块，
比如评论是一块
分页又是一块，
已经上线，或你不做了，后期别人拉手，或你接手别人的项目， 这时候来个需求让你把分页去掉，或修改 你可以清楚的找到对应模块文件 进行修改 或去掉
模块是自定义的，
组件，更想当于一个通用的东西，有的分功能组件，有的分业务组件
大图切换，这种就是单纯的一个效果展示，只要调用就ok
一个分页，也是只单纯的调用，
组件更是一个多处都可以使用 ，不需要再单独开发的
⑷ 常见的前端集成部署方案有哪些各自的优缺点是什么
前端行业经历了这么长时间的发展，技术元素非常丰富，这里列举出一般web团队需要用到的技术元素：
开发规范：包括开发、部署的目录规范，编码规范等。不要小瞧规范的威力，可以极大的提升开发效率，真正优秀的规范不会让使用者感到约束，而是能帮助他们快速定位问题，提升效率。
模块化开发：针对js、css，以功能或业务为单元组织代码。js方面解决独立作用域、依赖管理、api暴露、按需加载与执行、安全合并等问题，css方面解决依赖管理、组件内部样式管理等问题。是提升前端开发效率的重要基础。现在流行的模块化框架有requirejs、seajs等。
组件化开发：在模块化基础上，以页面小部件(component)为单位将页面小部件的js、css、html代码片段放在一起进行开发、维护，组件单元是资源独立的，组件在系统内可复用。比如头部(header)、尾部(footer)、搜索框(searchbar)、导航(menu)、对话框(dialog)等，甚至一些复杂的组件比如编辑器(editor)等。通常业务会针对组件化的js部分进行必要的封装，解决一些常见的组件渲染、交互问题。
组件仓库：有了组件化，我们希望将一些非常通用的组件放到一个公共的地方供团队共享，方便新项目复用，这个时候我们就需要引入一个组件仓库的东西，现在流行的组件库有bower、component等。团队发展到一定规模后，组件库的需求会变得非常强烈。
性能优化：这里的性能优化是指能够通过工程手段保证的性能优化点。由于其内容比较丰富，就不在这里展开了，感兴趣的同学可以阅读我的这两篇文章 [1] [2]。性能优化是前端项目发展到一定阶段必须经历的过程。这部分我想强调的一点是性能优化一定是一个工程问题和统计问题，不能用工程手段保证的性能优化是不靠谱的，优化时只考虑一个页面的首次加载，不考虑全局在宏观统计上的优化提升也是片面的。
项目部署：部署按照现行业界的分工标准，虽然不是前端的工作范畴，但它对性能优化有直接的影响，包括静态资源缓存、cdn、非覆盖式发布等问题。合理的静态资源资源部署可以为前端性能带来较大的优化空间。
开发流程：完整的开发流程包括本地开发调试、视觉效果走查确认、前后端联调、提测、上线等环节。对开发流程的改善可以大幅降低开发的时间成本，工作这些年见过很多独立的系统（cms系统、静态资源推送系统）将开发流程割裂开，对前端开发的效率有严重的阻碍。
开发工具：这里说的工具不是指IDE，而是工程工具，包括构建与优化工具、开发-调试-部署等流程工具，以及组件库获取、提交等相关工具，甚至运营、文档、配置发布等平台工具。前端开发需要工具支持，这个问题的根本原因来自前端领域语言特性（未来我会单独写一篇文章介绍前端领域语言缺陷问题）。前端开发所使用的语言（js、css、html）以及前端工程资源的加载与定位策略决定了前端工程必须要工具支持。由于这些工具通常都是独立的系统，要想把它们串联起来，才有了yeoman这样的封装。前面提到的7项技术元素都直接或间接的对前端开发工具设计产生一定的影响，因此能否串联其他技术要素，使得前端开发形成一个连贯可持续优化的开发体系，工具的设计至关重要。
⑸ 前端如何提升开发效率
来具体聊一聊提高前端工程师开发效率的那些方法！
当然除了以上5点，对于前端来说需要提高开发效率的地方还有很多，可谓任重而道远。希望以上几点能够给初识前端的同学带来启发并能够亲自实践。
⑹ 模块化和组件化的区别
组件和模块的定位不同。组件一般用于前端,模块化在后台运用的比较多。例如vue中的组件,主要是为了拆分vue实例的代码量,让我们可以以不同的组件来划分不同的功能模块,将来我们需要什么样的功能,就直接调用对应的组件即可。
⑺ 如何理解前端模块化
前端模块化
在JavaScript发展初期就是为了实现简单的页面交互逻辑，寥寥数语即可；如今CPU、浏览器性能得到了极大的提升，很多页面逻辑迁移到了客户端（表单验证等），随着web2.0时代的到来，Ajax技术得到广泛应用，jQuery等前端库层出不穷，前端代码日益膨胀
这时候JavaScript作为嵌入式的脚本语言的定位动摇了，JavaScript却没有为组织代码提供任何明显帮助，甚至没有类的概念，更不用说模块（mole）了，JavaScript极其简单的代码组织规范不足以驾驭如此庞大规模的代码
模块
既然JavaScript不能handle如此大规模的代码，我们可以借鉴一下其它语言是怎么处理大规模程序设计的，在Java中有一个重要带概念——package，逻辑上相关的代码组织到同一个包内，包内是一个相对独立的王国，不用担心命名冲突什么的，那么外部如果使用呢？直接import对应的package即可
import java.util.ArrayList;
遗憾的是JavaScript在设计时定位原因，没有提供类似的功能，开发者需要模拟出类似的功能，来隔离、组织复杂的JavaScript代码，我们称为模块化。
一个模块就是实现特定功能的文件，有了模块，我们就可以更方便地使用别人的代码，想要什么功能，就加载什么模块。模块开发需要遵循一定的规范，各行其是就都乱套了
规范形成的过程是痛苦的，前端的先驱在刀耕火种、茹毛饮血的阶段开始，发展到现在初具规模，简单了解一下这段不凡的历程
函数封装
我们在讲函数的时候提到，函数一个功能就是实现特定逻辑的一组语句打包，而且JavaScript的作用域就是基于函数的，所以把函数作为模块化的第一步是很自然的事情，在一个文件里面编写几个相关函数就是最开始的模块了
function fn1(){
statement
}
function fn2(){
statement
}
这样在需要的以后夹在函数所在文件，调用函数就可以了
这种做法的缺点很明显：污染了全局变量，无法保证不与其他模块发生变量名冲突，而且模块成员之间没什么关系。
对象
为了解决上面问题，对象的写法应运而生，可以把所有的模块成员封装在一个对象中
var myMole = {
var1: 1,
var2: 2,
fn1: function(){
},
fn2: function(){
}
}
这样我们在希望调用模块的时候引用对应文件，然后
myMole.fn2();
这样避免了变量污染，只要保证模块名唯一即可，同时同一模块内的成员也有了关系
看似不错的解决方案，但是也有缺陷，外部可以随意修改内部成员
myModel.var1 = 100;
这样就会产生意外的安全问题
立即执行函数
可以通过立即执行函数，来达到隐藏细节的目的
var myMole = (function(){
var var1 = 1;
var var2 = 2;
function fn1(){
}
function fn2(){
}
return {
fn1: fn1,
fn2: fn2
};
})();
这样在模块外部无法修改我们没有暴露出来的变量、函数
上述做法就是我们模块化的基础，目前，通行的JavaScript模块规范主要有两种：CommonJS和AMD
CommonJS
我们先从CommonJS谈起，因为在网页端没有模块化编程只是页面JavaScript逻辑复杂，但也可以工作下去，在服务器端却一定要有模块，所以虽然JavaScript在web端发展这么多年，第一个流行的模块化规范却由服务器端的JavaScript应用带来，CommonJS规范是由NodeJS发扬光大，这标志着JavaScript模块化编程正式登上舞台。
定义模块
根据CommonJS规范，一个单独的文件就是一个模块。每一个模块都是一个单独的作用域，也就是说，在该模块内部定义的变量，无法被其他模块读取，除非定义为global对象的属性
模块输出：
模块只有一个出口，mole.exports对象，我们需要把模块希望输出的内容放入该对象
加载模块：
加载模块使用require方法，该方法读取一个文件并执行，返回文件内部的mole.exports对象
⑻ 前端vue是什么
Vue.js 是一个JavaScriptMVVM库，是一套构建用户界面的渐进式框架。它是以数据驱动和组件化的思想构建的，采用自底向上增量开发的设计。相比于Angular.js，Vue.js提供了更加简洁、更易于理解的API，使得我们能够快速地上手并使用Vue.js；同时比起 React + Rex 相对复杂的架构，Vue.js 更加轻量级也更加容易上手，是初创项目的首选前端框架。Vue 的核心库只关注视图层，它不仅易于上手，还便于与第三方库或既有项目整合。
今天带领大家来了解一款渐进式JavaScript框架——Vue。
近年来，前端开发领域，旧浏览器逐渐淘汰，移动端开发需求逐年增加，前端交互越来越多，功能越来越复杂。架构从传统后台MVC向REST API + 前端MV* 迁移。
MV*相当于MVC即：
Model（模型）表示应用程序核心（比如数据库记录列表）。
View（视图）显示前端的学习都是需要不断的学习，学一天停一停相当于白学，学习效果很差，如果你想有人一起学习可以来这个扣裙，首先是132 中间是667最后是127 都是零基础的同学，大家相互鼓励 共同努力 只是学着玩就不建议来了!!!数据（数据库记录）。
Controller（控制器）处理输入（写入数据库记录）。
MVP
Model（模型）表示应用程序核心（比如数据库记录列表）。
View（视图）显示数据（数据库记录）。
Presenter（表示器）负责逻辑处理业务。
与MVC差别在于：
1、View与Model完全隔离。
2、Presenter与View的具体实现技术无关。
3、可以进行View的模拟测试。
MVVM（Vue就是一种MVVM框架）
Model（模型）表示应用程序核心（比如数据库记录列表）。
View（视图）显示数据（数据库记录）。
ViewModel（观察者）负责把Model的数据同步到View显示出来，还负责把View的修改同步回Model。
优点：高内聚，低耦合（可重用性、可移植性）。
Vue是一款数据驱动+组件化的前端开发框架，对比于Angular和React，Vue.js更轻量，gzip后大小只有26K （Angular 56K,React 44K），同时更易上手，学习曲线平稳，吸收两家之长，借鉴了angular的指令和react的组件化。
⑼ 什么叫组件化开发
张克军 提出的“组件化就是函数式界面开发”这一说法我是难以接受的，函数式界面开发就让它好好地叫“函数式组件化”吧，不然我们会在所谓的“传统UI框架”和“函数式界面开发”之间出现一个Gap，岂不是又要造个词给填上，多累……
我前面说会有一个Gap，这个Gap很可能就是我们现在想用“组件化”这个定义去表达的一些点，我想在此做一些个人的见解
我将之理解为以下几要素：
组件是对逻辑的封装，不限于图形元素。即我们可以把if做成组件、把一个倒计时做成组件、把一段动画做成组件、把路由做成组件、把数据架构做成组件，而这些并不能称为控件
组件具备单个可移植性，即“随加载随用”，不需要为其准备复杂的基础条件（如引入样式、引入框架等）。然而这一点现有那些所谓组件库做得并不好，技术上也不大现实
组件是声明式定义的，而非命令式。这个不想多说，很大程度上是自己主观的一个想法
而上面最重要的就是第一点，所以要问我什么是“组件化开发”，我的说法是：
把图形、非图形的各种逻辑均抽象为一个统一的概念（组件）来实现开发的模式
这与传统开发框架的最大区别就是统一了图形元素与非图形元素，除此之外我再想不出其它真正体现区别的点了
在这个概念下，包括router、ajax、mole loader、timer、animation、interval等，都是组件，共享统一的生命周期管理和对外接口，且都是声明式地进行组合
我的一位同事告诉我去年的深JS上，有位淘宝的朋友的话题叫做“前端组件服务化”，这里面提的那些个概念，是很符合我对“组件化”的认识的，他要是不给再强安个“服务化”的噱头就好了- -
不过话说回来，在这个要求之下，组件其实不是那么好进行抽象设计的，随便说几个例子，有难的也有简单的：
非图形元素的各种需求如何统一接口，如timer和ajax
组件可以横向组件，但是纵向复用如何解决，如希望任何图形元素都可以实现被鼠标拖拽的效果，则鼠标拖拽应该也是个组件，这个组件与其它组件的关系是什么
有些组件对其可被组合的组件是有要求的，比如HTML里就不大好意思把一个<p>放进一个<span>里，这一点如何在组件上表达（实现不难，表达比较难）
一些我们原本想当然认为纯的小函数的东西，是不是也能当组件玩，比如underscore.pick要不要也是个组件
⑽ 既然html都是由后端动态生成，为什么前端还要强调组件化开发
谁告诉你html都是后端动态生成的
后端开发还得基于前端来做
组件化开发可以减少页面开发成本 提高页面的可维护性和拓展性