框架使⽤注意点
框架
⾯向对象：
⾯向对象是⼀种程序开发的⽅法，它将对象作为程序的基本单元，将程序和数据封装其中，以提⾼软件的灵活性、重⽤性和扩展性。对象是把数据及对数据的操作⽅法放在⼀起，作为⼀个相互依存的整体。再说⼀下类与对象，类描述了⼀组有相同特性和相同⾏为的对象，具有相同属性和相同⽅法的对象的抽象就是类。即，对象的抽象是类，类的实例是对象。在⾯向对象的编程中，把⽤类创建对象的过程称为实例化。
⾯向过程与⾯向对象的区别
⾯向过程是⼀种直接的编程⽅法，它是按照编程语⾔的思路考虑问题。通过顺序执⾏⼀组语句来实现⼀个功能，这些语句的执⾏过程就是整个程序。
⾯向对象是⼀种抽象度更⾼的编程⽅法。它的⽬标是使模块的抽象度更⾼，⽬的是可复⽤。⾯向对象三⼤特性：封装，继承，多态。⾯向过程可以说是从细节⽅⾯思考问题
⾯向对象可以说是从宏观⽅⾯思考问题
对象的创建⽅式有对象字⾯量，⼯⼚⽅式，原型⽅式，构造函数，混合模式。
原型，原型链：
我们创建的每个函数都有⼀个prototype属性，这个属性是⼀个指针，指向⼀个对象，这个对象的⽤途是包含可以由特定类型的所有实例共享的属性和⽅法。那么，prototype就是通过调⽤构造函数⽽创建的那个对象实例的原型对象。
使⽤原型的好处是可以让对象实例共享它所包含的属性和⽅法。也就是说，不必在构造函数中添加定义对象信息，⽽是可以直接将这些信息添加到原型中。使⽤构造函数的主要问题就是每个⽅法都要在每个实例中创建⼀遍。
在JavaScript中,⼀共有两种类型的值，原始值和对象值。每个对象都有⼀个内部属性 prototype ，我们通常称之为原型。原型的值可以是⼀个对象，也可以是null。如果它的值是⼀个对象，则这个对象也⼀定有⾃⼰的原型。这样就形成了⼀条线性的链，我们称之为原型链。
简单的说就是在JavaScript 中，每当定义⼀个对象（函数）时候，对象中都会包含⼀些预定义的属性。其中函数对象的⼀个属性就是原型对象 prototype。JS在创建对象（不论是普通对象还是函数对象）的时候，都有⼀个叫做__proto__的内置属性，⽤于指向创建它的函数对象的原型对象prototype，我们把这个有__proto__串起来的直到Object.prototype.__proto__为null的链叫做原型链
angularjs：
angular是⾕歌开发的⼀款js框架，最核⼼的机制之⼀是数据双向绑定，利⽤脏检查机制，原理是Angular 在 scope 模型上设置了⼀个 监听队列，⽤来监听数据变化并更新 view 。每次绑定⼀个东西到 view 上时 AngularJS 就会往 $watch 队列⾥插⼊⼀条
digest 循环就会触发，遍历所有的 $watch ，最后更新 dom。Angular还提供了很多服务供我们使⽤（可简单回答下题服务），另外利⽤依赖注⼊在控制器中使⽤，说到依赖注⼊它是⼀种软件设计模式，⽬的是处理代码之间的依赖关系，减少组件间的耦合。Angular⾥⾯还有过滤器，例如orderby，filter等帮助我们变换输出形式，它还提供了⾃定义过滤器，根据过滤器参数的不同我们可以根据实际的需求做不同的返回处理，angular⾥⾯还有⾃定义指令帮助我们在构建动态web应⽤时弥补静态⽂本的不⾜，还提供了很多插件，例如动画插件，路由插件，等，路由可以让我们开发spa应⽤（可回答路由）
angular服务：
angular⾥⾯内置了三⼗多种服务，最常⽤的就是q等服务，除了内置服务，angular还提供了五种⾃定义服务供我们使⽤，有constant
watch ，⽤来检测它监视的model ⾥是否有变化的东西。当浏览器接收到可以被angularcontext 处理的事件时，http ⽤来前后数据交互的，其次就是⼀些location ，
，value，constant和value主要就是⽤于存放⼀些数据或⽅法以供使⽤，区别是constant⼀般是存放固定内容,value存放可能会被修改的内容，然后还有factory，它和constant,value最⼤的区别是,factory服务是有⼀个处理过程，经过这个过程，才返回结果的. 还有service⽅
法，ervice和factory的区别在于，它第⼆个参数传⼊的是⼀个构造函数，最后被注⼊的服务是这个构造函数实例化以后的结果.所以基本上使⽤service创建的服务的，也都可以使⽤factory来创建，还有⼀种就是provider，它属于供应商服务，设置⾥⾯必须先返回⼀个$get的构造函数，然后再返回值，这种写法就是可以在config中对设置的数据进⾏⼆次修改。后三种是我们⽐较常⽤的服务，他们三者之间的关系⼤致是这样的factory 把 service 的⽅法和数据放在⼀个对象⾥，并返回这个对象；service 通过构造函数⽅式创建 service，返回⼀个实例化对象；provider 创建⼀个可通过 config 配置的 service。
angular路由：
Angular1.x 中常⽤ ngRoute 和 ui.router，还有⼀种为 Angular2 设计的 （⾯向组件），ngRoute 模块是 Angular ⾃带的路由模块，⽽ ui.router 模块是基于 ngRoute模块开发的第三⽅模块。ui.router 是基于 state （状态）的， ngRoute 是基于 url 的，ui.router模块具有更强⼤的功能，主要体现在视图的嵌
套⽅⾯。使⽤ ui.router 能够定义有明确⽗⼦关系的路由，并通过 ui-view 指令将⼦路由模版插⼊到⽗路由模板的 ui-view 中去，从⽽实现视图嵌套。⽽在 ngRoute 中不能这样定义，如果同时在⽗⼦视图中 使⽤了ng-view 会陷⼊死循环。
混合开发：
混合开发就是原⽣＋html5构建的bybridapp，我们前端开发⼈员进⾏混合项⽬构建，常利⽤的封壳（打包app）平台有
cordova，hbuilder hello5+，两个平台的区别在于cordova需要借助原⽣的环境，封装android类型需要有androidsdk以及java jdk环境，ios类型需要有xcorde，h5+平台的话是借助dcloud云端⼤包平台，可以直接封装。混合应⽤相对于原⽣应⽤来说有很多优点，例如⼀次编译多平台运⾏，ui表现⼀致，更新不需要审查等，同时也有⼀些缺点，在性能上不如原⽣，很多硬件功能没有原⽣完善，不过可以借助cordova。H5+提供的硬件api进⾏完善。还有就是前段开发⼈员与ios或者安卓⼈员进⾏合作我们需要开发页⾯，实现样式以及功能交互，然后原⽣⼈员在原⽣壳⼦中内嵌轻量级浏览器，通过webview加载我们写的页⾯，这就是原⽣根h5⼈员的配合开发混合项⽬
react：
facebook在构建instagram⽹站的时候遇见两个问题⼀个是数据绑定的时候，⼤量操作真实dom，性能成本太⾼，然后就是⽹站的数据流向太混乱，不好控制，于是就推出了react框架，它是⼀个重视view层的框架，主要特点是声明事，⾃动dom操作。主要利⽤的就是虚拟dom，主要特点是单向数据流，核⼼⽅法是组件，组件的优势在于组件将数据和逻辑封装，能够提⾼代码复⽤率，组件⾼内聚低耦合，很容易对单个组件进⾏测试。因此降低测试难度，另外就是组件使⽤直观的语法可以极⼤提⾼可读性，降低代码复杂度。React中提供了属性和状态进⾏数据的传递，还有⽣命周期⽅便对组件的操作，⽣命周期分为三个阶段，初始化，运⾏中，卸载阶段，每个阶段都提供了钩⼦函数供我们去管理组件的操作。利⽤react与webpack我们可以进⾏模块化开发，⽅便对每个组件单独管理与操作，react中还提供了路
由，react－router，通过link 匹配路径，router history管理路由路径，route设置具体的路由路径，已经该路径要加载的组件，同时还提供了indexRoute⽅便我们设置初始加载的组件试图。React还有两个⽐较强⼤的数据流管理框架flux和redux（接下来可以回答下题）
flux，redux：
redux是⼀个应⽤数据流框架，主要是解决了组件间状态共享的问题，原理是集中式管理，主要有三个核⼼⽅
法，action，store，reducer，⼯作流程是view调⽤store的dispatch接收action传⼊store，reducer进⾏state操作，view通过store提供的getState获取最新的数据，flux也是⽤来进⾏数据操作的，有四个组成部分action，dispatch，view，store，⼯作流程是view发出⼀个action，派发器接收action，让store进⾏数据更新，更新完成以后store发出change，view接受change更新视图。Redux和Flux很像。主要区别在于Flux有多个可以改变应⽤状态的store，在Flux中dispatcher被⽤来传递数据到注册的回调事件，但是在redux中只能定义⼀个可更新状态的store，redux把store和Dispatcher合并，结构更加简单清晰
新增state，对状态的管理更加明确，通过redux，流程更加规范了，减少⼿动编码量，提⾼了编码效率，同时缺点时当数据更新时有时候组件不需要，但是也要重新绘制，有些影响效率。⼀般情况下，我们在构建多交互，多数据流的复杂项⽬应⽤时才会使⽤它们。同时redux的reducer可以通过commbinesreducer进⾏拆分，⽅便返回不同的state树，并且可以通过redux－thunk进⾏异步调⽤dispatch，进⾏数据管理。对于同样的⼩型状态管理⼯具，也可以更好的去使⽤mobx，mobx相对来说更加轻便，性能更好。对于数据类型的处理同样可以利⽤immutable进⾏处理，react-redux的ui组件以及容器组件进⾏组合操作，更加利于对于不同state的处理。
node：
node.js是⼀个基于Chrome v8引擎的javascript 运⾏环境。Node.js使⽤了⼀个事件驱动、⾮阻塞式 I/O
的模型，使其轻量⼜⾼效。使⽤C＋＋语⾔编写，特点是快，性能⾼，开发效率⾼，应⽤范围⼴，但是也耗费内存，⽐较新，ied不是很完善，中间件少，node可以解析js，没有浏览器安全级别限制，同时也提供了很多系统级别的api，像⽂件的读取，进程的管理等，我经常使⽤的node⾥⾯的模块有url对地址栏进⾏地址的解析操作，querystring⽤于解析与格式化 URL 查询字符串，fs对⽂件进⾏操作，http，https模块中的request⽅法进⾏获取数据，发送数据等。。，同时node还提供了路由，可以通过加载不同url显⽰不同视图内容，同样可以模拟后端不同接⼝存储不同的数据（剩下的可以回答下⾯⼏题）
mongodb：
MongoDB是⼀个基于分布式⽂件存储的数据库。由C++语⾔编写。是世界上⽬前⽤的最⼴泛的nosql数据库，也就是⾮关系型数据库，他的特点是⾼性能、易部署、易使⽤，存储数据⾮常⽅便。
他有以下优点，例如⾯向⽂档储存的数据库也就是BSON格式存储，说道bson，BSON基于JSON格式，对JSON进⾏改造的，bson的特点就是便利更快，操作更简单，同时增加了额外的数据类型， 然后mango还具有丰富的查询指令，⽀持索引，具有分⽚系统，⽆模式，同时也有⼀些缺点占⽤空间⼤，不⽀持事物，⽬前也不维护32位系统了，⼀个芒果⾥⾯可以创建很多数据库，数据库事由集合组成，集合就是MongoDB ⽂档组，类似于 RDBMS （关系数据库管理系统：Relational Database Man
agement System）中的表格。那⽂档其实就是⼀个键值(key-value)对也就是BSON，常⽤的操作就是对集合数据的增删改查。
express：
express 是基于node平台 开发的⼀个极其轻量的框架 帮助你快速开发web以及移动端应⽤，express不对node.js本⾝的特性进⾏⼆次抽象 ⽽是在基本功能上进⾏扩充，express完全是由路由和中间件构成的框架 从本质上来说⼀个express应⽤就是为了调⽤各种中间件。中间件是⼀个函数 --他可以访问request对象，响应对象(res) 以及处于请求–响应流程中的中间件，⼀般被命名为 next 的变量，中间件可以执⾏任何代码，可以修改请求和响应对象，可以结束请求－响应对象，也可以调⽤堆栈中的下⼀个中间件，我们把结束请求-响应流程的⽅法 称为是句柄函数。Express提供很多中间件，⽅便我们对于系统数据视图的操作与管理，与之配合的是我们常⽤的ejs模版引擎（答下题）
ejs：
EJS是⼀个简单⾼效的模板语⾔，通过数据和模板，可以⽣成HTML标记⽂本。可以说EJS是⼀个JavaScript库，EJS可以同时运⾏在客户端和服务器端，客户端安装直接引⼊⽂件即可，服务器端⽤npm包安装。使⽤ejs有很多优点。例如：可以快速编译和渲染，使⽤简单的模板标签，还可以⾃定义标记分隔符，⽀持⽂本包含，⽀持浏览器端和服务器端，模板静态缓存，⽀持express视图系统等，ej
s常⽤流程控制标签，可以更好的解析变量，操作逻辑。
vue：
vue是⼀个构建数据驱动的 web 界⾯的渐进式框架。Vue.js 的⽬标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。Vue.js借鉴了Angular以及React的⼀些核⼼思想，综合各⾃的长处进⾏了操作以及性能等⽅⾯的优化，vue⽐angular简单，⼩，运⾏速快快，都有数据双向绑定，vue与react都使⽤ virtual DOM虚拟dom，都提供了组件化的视图组件，都有丰富的插件库，react使⽤jsx渲染页⾯，vue使⽤更简单的模版。Vue也提供了丰富的指令进⾏操作，同时也有⽣命周期，所有的⽣命周期钩⼦⾃动绑定 this 上下⽂到实例中，因此你可以访问数据，对属性和⽅法进⾏运算。Vue.js 使⽤了基于 HTML 的模版语法，允许开发者声明式地将 DOM 绑定⾄底层
Vue 实例的数据。所有 Vue.js 的模板都是合法的 HTML ，所以能被遵循规范的浏览器和 HTML 解析器解析。Vue也提供了路由操作，通过router－link设置路径，path进⾏路由路径配置，components进⾏组件模版加载。他还提供了动画插件，可以结合animate。Css进⾏动画设置。还有⾃定义指令，过滤器等。
然后就是Vuex 是⼀个专为 Vue.js 设计的状态管理模式，vuex解决了组件之间同⼀状态的共享问题。当我们的应⽤遇到多个组件共享状态时，会需要多个组件依赖于同⼀状态，这时候使⽤vuex就可以很
好的解决。主要有五部分组成，module可以进⾏store仓库分割，⽅便管理不同数据，state进⾏整个应⽤数据集中管理，mutations是唯⼀⼀个能够修改状态值的对象，故通常存放业务逻辑进⾏数据变
更，actions是辅助处理mutations中异步函数操作的，同时还提供了mapActions辅助我们操作事件，getters是辅助我们对于状态的获取输出的，同时提供了mapGetters⽅便我们在组件内部通过computed进⾏store中状态的调⽤与获取。同时vue可以配合mint –ui／vant ／element这个ui框架快速构建移动端应⽤。vant –ui提供了很多漂亮的ui组件设计，⽅便我们快读构建开发项⽬，还可以配合elementui 进⾏pc端项⽬构建。
ionic：
ionic是⼀个⽤来开发混合⼿机应⽤的，开源的，免费的代码库。可以优化html、css和js的性能，构建⾼效的应⽤程序，⽽且还可以⽤于构建Sass和AngularJS的优化。ionic是⼀个专注于⽤WEB开发技术，基于HTML5创建类似于⼿机平台原⽣应⽤的⼀个开发框架。绑定了AngularJS和Sass。这个框架的⽬的是从web的⾓度开发⼿机应⽤，基于PhoneGap的编译平台，可以实现编译成各个平台的应⽤程序。她有以下特点1.ionic 基于Angular语法，简单易学，是⼀个轻量级框架。完美的融合下⼀代移动框架，⽀持 Angularjs 的特性， MVVM ，代码易维护。ionic 提供了漂亮的设计，通过 SASS 构建应⽤程序，它提供了很多 UI 组件来帮助开发者开发强⼤的应⽤。ionic 专注原⽣，让你看不出混合应⽤和原⽣的区别，ionic 提供了强⼤的命令⾏⼯具。ionic 性能优越，运⾏速度快。
单页⾯应⽤：
单页⾯应⽤single page web application
⼀般我们开发单页⾯应⽤有以下⼏个优点：
\1. 分离前后端关注点，前端负责界⾯显⽰，后端负责数据存储和计算，各司其职，不会把前后端的逻辑混杂在⼀起；
\2. 减轻服务器压⼒，服务器只⽤出数据就可以，不⽤管展⽰逻辑和页⾯合成，吞吐能⼒会提⾼⼏倍；
\3. 同⼀套后端程序代码，不⽤修改就可以⽤于Web界⾯、⼿机、平板等多种客户端；
除了优点同时还有⼀些缺点；例如SEO问题，现在可以通过Prerender等技术解决⼀部分；前进、后退、地址栏等，需要程序进⾏管理；书签，需要程序来提供⽀持；
· 使⽤angular来开发的话有以下⼏个特点：
· 速度：更好的⽤户体验，让⽤户在web app感受native app的速度和流畅，
· MVC：经典MVC开发模式，前后端各负其责。
· ajax：重前端，业务逻辑全部在本地操作，数据都需要通过AJAX同步、提交。
· 路由：在URL中采⽤#号来作为当前视图的地址，改变#号后的参数，页⾯并不会重载。
谈谈你对webpack的看法
WebPack 是⼀个模块打包⼯具，你可以使⽤WebPack管理你的模块依赖，并编绎输出模块们所需的静态⽂件。它能够很好地管理、打包Web开发中所⽤到的HTML、JavaScript、CSS以及各种静态⽂件（图⽚、字体等），让开发过程更加⾼效。对于不同类型的资
源，webpack有对应的模块加载器。webpack模块打包器会分析模块间的依赖关系，最后 ⽣成了优化且合并后的静态资源。
webpack的两⼤特⾊：
2.loader 可以处理各种类型的静态⽂件，并且⽀持串联操作
webpack 是以commonJS的形式来书写脚本滴，但对 AMD/CMD 的⽀持也很全⾯，⽅便旧项⽬进⾏代码迁移。
webpack具有requireJs和browserify的功能，但仍有很多⾃⼰的新特性：
1. 对 CommonJS 、 AMD 、ES6的语法做了兼容
2. 对js、css、图⽚等资源⽂件都⽀持打包
3. 串联式模块加载器以及插件机制，让其具有更好的灵活性和扩展性，例如提供对CoffeeScript、ES6的⽀持
4. 有独⽴的配置⽂件fig.js
5. 可以将代码切割成不同的chunk，实现按需加载，降低了初始化时间
6. ⽀持 SourceUrls 和 SourceMaps，易于调试
7. 具有强⼤的Plugin接⼝，⼤多是内部插件，使⽤起来⽐较灵活
8.webpack 使⽤异步 IO 并具有多级缓存。这使得 webpack 很快且在增量编译上更加快
es5  vs  es6
es5:
1. strict模式
严格模式，限制⼀些⽤法，‘use strict’;js获取json的key和value
2. Array增加⽅法
增加了every、some 、forEach、filter 、indexOf、lastIndexOf、isArray、map、reduce、reduceRight⽅法
PS： 还有其他⽅法 Function.prototype.bind、im、w
3. Object⽅法
Object.defineProperty
Object.defineProperties
Object.keys
Object.preventExtensions / Object.isExtensible
Object.seal / Object.isSealed
Object.freeze / Object.isFrozen
Es6
ECMAScript6在保证向下兼容的前提下，提供⼤量新特性
1.块级作⽤域 关键字let, 常量const
2.对象字⾯量的属性赋值简写（property value shorthand）
3.赋值解构
4.函数参数 - 默认值、参数打包、 数组展开（Default 、Rest 、Spread）
5.箭头函数 Arrow functions
6.字符串模板 Template strings
\7. Iterators（迭代器）+ for…of
8.⽣成器 （Generators）
9.Class
Class，有constructor、extends、super，但本质上是语法糖（对语⾔的功能并没有影响，但是更⽅便使⽤）。
10.Modules
ES6的内置模块功能借鉴了CommonJS和AMD各⾃的优点：
(1).具有CommonJS的精简语法、唯⼀导出出⼝(single exports)和循环依赖(cyclic dependencies)的特点。
(2).类似AMD，⽀持异步加载和可配置的模块加载。
11.Map + Set + WeakMap + WeakSet
四种集合类型，WeakMap、WeakSet作为属性键的对象如果没有别的变量在引⽤它们，则会被回收释放掉。
12.Math + Number + String + Array + Object APIs
\13. Proxies
使⽤代理（Proxy）监听对象的操作，然后可以做⼀些相应事情。
14.Symbols
Symbol是⼀种基本类型。Symbol 通过调⽤symbol函数产⽣，它接收⼀个可选的名字参数，该函数返回的symbol是唯⼀的。
15.Promises
Promises是处理异步操作的对象，使⽤了 Promise 对象之后可以⽤⼀种链式调⽤的⽅式来组织代码，让代码更加直观（类似的deferred 对象）。
⼀. Sass/Scss、Less是什么?
Sass (Syntactically Awesome Stylesheets)是⼀种动态样式语⾔，Sass语法属于缩排语法，⽐css⽐多出好些功能(如变量、嵌套、运算，混⼊(Mixin)、继承、颜⾊处理，函数等)，更容易阅读。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。