1，精通 html5 css3 新特性，能熟练使用 html+css 完成页面的绘制
H5:一、语义标签
二、增强型表单
三、视频和音频
四、Canvas绘图
五、SVG绘图
六、地理定位
七、拖放API
八、WebWorker
九、WebStorage
十、WebSocket
css3：1.过渡 transition： CSS属性，花费时间，效果曲线(默认ease)，延迟时间(默认0)复制代码
2.动画 animation：动画名称，一个周期花费时间，运动曲线（默认ease），动画延迟（默认0），播放次数（默认1），是否反向播放动画（默认normal），是否暂停动画（默认running）
3.阴影 box-shadow: 水平阴影的位置 垂直阴影的位置 模糊距离 阴影的大小 阴影的颜色 阴影开始方向（默认是从里往外，设置inset就是从外往里）;复制代码
4.边框 border-image: 图片url 图像边界向内偏移 图像边界的宽度(默认为边框的宽度) 用于指定在边框外部绘制偏移的量（默认0） 铺满方式--重复（repeat）、拉伸（stretch）或铺满（round）（默认：拉伸（stretch））;
5.背景 background-clip 制定背景绘制（显示）区域 background-origin background-size
6.渐变
作者：逆风飘游的鱼
链接：www.jianshu.com/p/56b7302d7…
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
2，熟练使用 JavaScript，JQuery 和 Ajax,对页面的交互有很好的的掌握能力
创建快速动态网页的技术
AJAX 通过在后台与服务器进行少量数据交换，使网页实现异步更新。这意味着可以在不重载整个页面的情况下，对网页的某些部分进行更新。
3，熟练使用 vue 相关技术栈，能熟练使用 vue, vuex ,vue-router 进行项目开发
vue-router hash模式#/history模式
状态管理模式 : vue状态自管理应用包含以下几个部分：
state， 驱动应用的数据源； === vue => data
mutations 以声明方式将 state 映射到视图； === vue => methods
actions， 响应在 view 上的用户输入导致的状态变化 vue => created
getters 处理且计算复杂的数据类型 === vue => computer
modules 使状态管理 模块化 避免代码拢余
Vuex的辅助方法（mapState、mapGetter、mapMutation、mapAction）
4，在工作中熟练使用 css 预处理器 LESS 或者 SCSS 进行项目样式单元的开发。
SASS是世界上最成熟、最稳定、最强大的专业级CSS扩展语言。是一个相对比较新的编程语言，SASS出现主要是为了前端开发，因为它可以用来定义一套新的语法规则，以加强 和提升CSS，通过这种新的语言，你可以使用最高效的方式，最少量的代码创建复杂的设计。
5，熟练使用 Vant-UI，Ant-UI， MUI 等前端 UI 框架
树形控件 / 级联面板 / 步骤条 / 面包屑
6，熟练模块化开发，熟悉 commonJS 规范，熟练使用 webpack/gulp 等工具
CommonJS 规范很好，但是不适用于浏览器环境，于是有了 AMD 和 CMD 两种方案。AMD 全称 Asynchronous Module Definition，即异步模块定义。它采用异步方式加载模块，模块的加载不影响它后面语句的运行。所有依赖这个模块的语句，都定义在一个回调函数中，等到加载完成之后，这个回调函数才会运行。除了和 CommonJS 同步加载方式不同之外，AMD 在模块的定义与引用上也有所不同//////前端自动化构建工具，就是用来让我们不再做机械重复的事情，解放我们的双手的 webpack/glup
1.Gulp侧重于前端开发过程 的控制管理（像是流水线），我们可以通过给gulp配置不同的task来让gulp实现不同的功能，从而构建整个前端开发流程。
2.Webpack有人也称之为 模块打包机 ，由此也可以看出Webpack更侧重于模块打包，当然我们可以把开发中的所有资源（图片、js文件、css文件等）都可以看成模块，最初Webpack本身就是为前端JS代码打包而设计的，后来被扩展到其他资源的打包处理。Webpack是通过loader（加载器）和plugins（插件）对资源进行处理的。
7，熟悉 react 开发框架，使用过 react + mobx + react-router-dom 进行项目开发
observable和autorun
1、@observable: 使用此标签监控要检测的数据。（被观察者）
2、@observer: 使用此标签监控当数据变化是要更新的Component组件类（观察者）。
3、@action:使用此标签监控数据改变的自定义方法(当在需要数据改变的时候执行此自定义方法，那么View层也会跟着自动变化，默认此View层已经使用@observer标签监控)
4、@inject：使用此标签标示注入相关的store对象，使得当前组件可以从state获取store对象。如不使用此标签，则组件无法获取store对象。
8，熟悉 php nodejs 等后台语言,熟悉 mysql mongdb 等数据库,有编写数据接口的经验
MySQL是关系型数据库。优势：在不同的引擎上有不同 的存储方式。
Mongodb是非关系型数据库(nosql ),属于文档型数据库。文档是mongoDB中数据的基本单元，类似 关系数据库的行，
多个键值对有序地放置在一起便是文档，语法有点类似javascript面向对象的查询语言，
它是一个面向集合的，模式自由的文档型数据库。
9，熟练Vscode,HBulid
10，熟练使用 git 版本管理工具，进行项目代码管理和合作开发；
解决代码冲突的整个流程：
1、远程路径存在或本地新建一个分支；
2、分支库与主库代码一致；
3、本地从分支库上拉取新代码；
4、本地代码已经修改，本地与新代码之间的冲突；
3、整合本地代码、新代码；
4、整合后，提交融合后的代码到个人私库上；
5、发送合入请求。
11，掌握 MVVM 框架的原理和使用(必问)
MVVM相比与MVC模式主要是分离了试图和模型，所有的交互都通过ViewModel进行了数据的通知与交互，从而达到了低耦合的优点，View的修改可独立于Model的修改，可提高重用性，可在View中重用独立的视图逻辑。归根结底可总结为数据的双向绑定的过程，即ViewModel的数据与Model的绑定，ViewModel的数据与View中的数据绑定，从而达到数据低耦合高重用性的过程。(被问过N遍)
12，掌握第三方 js 插件，如使用 eCharts 绘制 K 线图,使用File-save下载Excel,等
ECharts，一个使用 JavaScript 实现的开源可视化库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（IE8/9/10/11，Chrome，Firefox，Safari等），底层依赖矢量图形库 ZRender，提供直观，交互丰富，可高度个性化定制的数据可视化图表。(可说可不说)
(大屏可视化数据) ==> 分辨率 2K 业务场景 订单配送详情
15，了解 ES6,ES7 新语法(划重点)
1. var let const 2. 箭头函数 4. 模板字符串 5.解构{...Array} 6.模块export import 7.参数 es6支持设置默认值： 8.类 9,Promises
ES7 ===> 1. includes 2.Async Await (送分题)
2，react和vue的区别。
第一点框架不同，Vue本质是MVVM框架，由MVC发展而来；
React是前端组件化框架，由后端组件化发展而来。
第二点监听数据变化不同。Vue通过 getter/setter以及一些函数的劫持，能精确知道数据变化。React默认是通过比较引用的方式（diff）进行的，如果不优化可能导致大量不必要的VDOM的重新渲染。
第三点渲染方式不同。Vue可以更快地计算出Virtual DOM的差异，这是由于它在渲染过程中，会跟踪每一个组件的依赖关系，不需要重新渲染整个组件树。React在应用的状态被改变时，全部子组件都会重新渲染。通过shouldComponentUpdate这个生命周期方法可以进行控制，但Vue将此视为默认的优化。
3。关于路由勾子函数。
beforeRouteEnter (to, from, next) {
// 在渲染该组件的对应路由被 confirm 前调用 },
beforeRouteUpdate (to, from, next) {
// 在当前路由改变，但是该组件被复用时调用
beforeRouteLeave (to, from, next) {
// 导航离开该组件的对应路由时调用
全局路由，组件路由守卫，路由独享守卫。
4，v-for 与v-if的优先级，v-for。所以最好不要一起使用，可以ul --li。
5，关于原型链。
1、所有的引用类型（数组、函数、对象）可以自由扩展属性（除null以外）。
2、所有的引用类型都有一个’_ _ proto_ _'属性(也叫隐式原型，它是一个普通的对象)。
3、所有的函数都有一个’prototype’属性(这也叫显式原型，它也是一个普通的对象)。
4、所有引用类型，它的’_ _ proto_ _'属性指向它的构造函数的’prototype’属性。
5、当试图得到一个对象的属性时，如果这个对象本身不存在这个属性，那么就会去它的’_ _ proto_ _'属性(也就是它的构造函数的’prototype’属性)中去寻找。
6，关于原型链污染？
原型污染是指将属性注入现有JavaScript语言构造原型（如对象）的能力。
JavaScript允许更改所有Object属性，包括它们的神奇属性，如_proto_，constructor和prototype。
在一个应用中，如果攻击者控制并修改了一个对象的原型，那么将可以影响所有和这个对象来自同一个类、父祖类的对象，所有JavaScript对象通过原型链继承，都会继承Object.prototype上的属性，这种攻击方式就是原型链污染。
7，关于 keep- alive。
keep-alive 是 Vue 内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染。
8，data是函数而不是对象。
组件最大优点是可被复用，因为对象是一个引用数据类型，如果data是一个对象的情况下会造成所有组件共用一个data。而当data是一个函数的情况下，每次函数执行完毕后都会返回一个新的对象，这样的话每个组件都会维护一份独立的对象（data）
9，响应式布局的实现和原理。
媒体查询，根据屏幕不同的宽对应的给出不同的样式。
百分比布局，高随着浏览器的高度的变化而变化，从而实现响应式的效果。
REM布局 一般不要给元素设置具体的宽度，但是对于一些小图标可以设定具体宽度值
-
高度值可以设置固定值，设计稿有多大，我们就严格有多大
-
所有设置的固定值都用rem做单位（首先在HTML总设置一个基准值：px和rem的对应比例，然后在效果图上获取px值，布局的时候转化为rem值)
-
js获取真实屏幕的宽度，让其除以设计稿的宽度，算出比例，把之前的基准值按照比例进行重新的设定，这样项目就可以在移动端自适应了
10。清除浮动。
1，父级div定义 height
2。overflow hidden
3，overflow auto
1。对象的深浅拷贝
深拷贝1、JSON.parse（）与JSON.stringify（）深拷贝可以通过JSON对象的方法，来进行对象的深拷贝，代码如下：//纯数据json对象的深度克隆function deepClone(obj) { return JSON.parse(JSON.stringify(obj));}理解：通过对象符串化和字符串对象化进行对象的拷贝。此方法只使用与纯JSON对象的深拷贝
使用Object.assign（） 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。理解：上述代码将原始对象拷贝到一个空对象，就得到原始对象的克隆，原对象和拷贝对象指向不同的内存地址，修改原对象和克隆对象，互补影响。
深拷贝
- // 方法一let two_brand = one_brand.map(o => Object.assign({}, o));
- // 方法二let two_brand = one_brand.map(o => ({...o}));
- // 方法三（推荐）let two_brand = _.cloneDeep(one_brand);
4.// 方法四let two_brand = JSON.parse(JSON.stringify(one_brand))
浅拷贝
-
// 数组 方法一 let two_brand = one_brand.slice(0);
-
// 字符 方法二（推荐）let two_brand = _.clone(one_brand)
2，关于this指向问题。
1.普通函数的this：指向它的调用者，如果没有调用者则默认指向window.
2.箭头函数的this: 指向箭头函数定义时所处的对象，而不是箭头函数使用时所在的对象，默认使用父级的this.
3.严格模式下，this指向undefined
3,apply call bind
apply和call都是为了改变某个函数运行时的上下文而存在的（就是为了改变函数内部this的指向
4,,关于 BFC,就是一种独立渲染的区域.就是一种规则,规则如下
1, 里面的元素是上下排列的
2,里面的元素从左边开始
3,margin决定垂直方向的距离
4,子元素不会影响外部元素 (会解决margin-top传递问题)
5, 重点哦,BFC不会和浮动发生重叠
6,在BFC里面，浮动参与高度计算**
再说说触发BFC的四个因素吧
1, float, 浮动会触发BFC
2 display:inline-block 改变元素为行内块级元素
3 position:absolute/fixed 绝对定位和相对定位
4 overflow:hidden; 溢出隐藏同样可以触发BFC
最后,是最重要的,也就是BFC的应用,简单说说它的两个基本应用吧
1,可以解决margin-top的传递问题
2,可以清楚浮动带来的,父元素高度塌陷的的问题
1，Vue生命周期
创建之前，开始创建，初始化模版，挂载dom
2，闭包的特点与优缺点
函数套函数，外层函数返回里面的函数，全局中调用，作为变量储存。 优点 避免命名污染，模块化思想。 缺点。容易造成内存泄漏，不能被垃圾回收。
3，对于v-model的理解
底层原理是大量语法糖，给属性绑定getter 、setter，实现数据的双向绑定。
4,post 和 get 请求的区别
(1) get 是简单请求, 安全性交低,一般用于渲染,如列表页和详情页
(2) post是复杂请求,安全性较低,受同源策略影响,一般用于登录注册页
5、显隐的区别
visibility: hidden----将元素隐藏，但是在网页中该占的位置还是占着,其具有继承性...
display: none----将元素的显示设为无，即在网页中不占任何的位置,各种属性值都将“丢失”。
visibility 属性指定一个元素是否是可见的。
display这个属性用于定义建立布局时元素生成的显示框类型。
要实现从JSON字符串转换为JS对象，使用 JSON.parse() 方法：
实现从JS对象转换为JSON字符串，使用 JSON.stringify() 方法：
问题一 : 问题描述 Forbidden,图片禁止异步加载
问题解决
问题二: 登录注册 正则里验证通过的话就可以点击,要验证密码和手机号,当输入手机号后,没有验证密码,首次就可以点击,之后的话就恢复了遇真为真,
watch适合处理一个数据影响多个数据的场景
computed适合处理一个数据受多个数据的影响
1、什么是Vue生命周期？
Vue实例从创建到销毁的过程，就是Vue的生命周期。也就是从开始创建、初始化数据、编译模板、挂载Dom – > 渲染、更新–>渲染、卸载等一系列过程，我们称这是Vue的生命周期。
2、Vue生命周期的作用是什么？
它的生命周期中有多个事件钩子，让我们在控制整个vue实例的过程时更容易形成好的逻辑。
3、vue生命周期总共有几个阶段？详细讲讲
答：它可以总共分为8个阶段：创建前/后, 载入前/后,更新前/后,销毁前/后
创建前/后： 在beforeCreated阶段，vue实例的挂载元素 el还没有。
载入前/后：在beforeMount阶段，vue实例的$el和data都初始化了，但还是挂载之前为虚拟的dom节点，data.message还未替换。在mounted阶段，vue实例挂载完成，data.message成功渲染。
更新前/后：当data变化时，会触发beforeUpdate和updated方法。
销毁前/后：在执行destroy方法后，对data的改变不会再触发周期函数，说明此时vue实例已经解除了事件监听以及和dom的绑定，但是dom结构依然存在
4、DOM 渲染在 哪个周期中就已经完成？
答：DOM 渲染在 mounted 中就已经完成了。
Vue的作用范围会将app 里面所有的 DOM 渲染 成 虚拟DOM(?) 把存储在内存中用来描述html标签的那些数据称之为虚拟dom 虚拟dom是暂时的 抽象的 它会瞬间渲染成真实dom
2,6 个 vue 指令 分别说明什么意思
(1) v-if指令：条件渲染指令，它根据表达式的真假来删除和插入元素
v-show和v-if区别=>v-show不管条件是否成立，都会渲染html,而v-if只有条件成立才会渲染
(2) v-for指令:v-for指令基于一个数组渲染一个列表，它和JavaScript的遍历语法相似,v-for="item in list”,list是一个数组，优先级高于(1);
(3) v-model 实现数据的双向绑定,底层原理就是 Object.defineProperty() 进行数据劫持 (监听数据改变 从而触发修改视图的逻辑函数)
(4)v-bind指令(简写“：”):v-bind动态地绑定一个或多个特性，可以在其名称后面带一个参数，中间放一个冒号隔开，这个参数通常是HTML元素的特性（attribute），
(5)v-on指令(简写“@”)：v-on用于监听DOM事件,用法和v-bind类似，例如<button v-on:click="show”>，修改代码：<button @click="show">
(6) v-HTML 相当于双大括号语法,且可以解析html标签
3 三者的区别
- computed属性的结果会被缓存，除非依赖的响应式属性变化才会重新计算。主要当作属性来使用；
- methods方法表示一个具体的操作，主要书写业务逻辑；
- watch一个对象，键是需要观察的表达式，值是对应回调函数。主要用来监听某些特定数据的变化，从而进行某些具体的业务逻辑操作；可以看作是computed和methods的结合体；
watch和computed各自处理的数据关系场景不同
1.watch擅长处理的场景：一个数据影响多个数据
2.computed擅长处理的场景：一个数据受多个数据影响
4,v-model 实现数据双向绑定
view 视图层 修改视图(input 事件) v-model 会自动去更新对应的 数据(model)
model 数据层 修改数据 通过js修改数据 v-model 会自动的去更新 数据对应的 视图 (view)
v-model 本质上不过是语法糖 ( 包含大量逻辑代码块集合
负责监听用户的输入事件以更新数据,底层原理就是 :
Object.defineProperty() 进行数据劫持 (监听数据改变 从而触发修改视图的逻辑函数) (监听输入框输入事件 从而修改对应的数据) 它会根据控件类型自动选取正确的方法来更新元素
v-model 也有修饰符
lazy input 变为 change 延迟触发
trim 去除首尾空格
number 用户的输入值转为数值类型
5, 说一下 什么 变异数组和非变异数组 以及 可变对象 和 不可变对象
变异数组的方法
1. 变异数组方法 触发vue 视图更新 改变原数组
push()
pop()
shift()
unshift()
splice()
sort()
reverse()
join()
2. 非变异数组方法 不会改变原数组 无法触发Vue视图更新 返回新的数组
filter()
concat()
slice()
find()
6. vue 如何实现 深度监听 以及什么时候需要用到深度监听
深度监听需要用到的情况：
watch:{} 可监听数据，数据发生变化， 处理函数，watch虽可监听，但只是浅监听，只监听数据第一层或者第二层，例如对象里面套对象data: {obj: {a: 123} }
深度监听使用方法：
重点：handler方法，deep属性，immediate属性
handler方法，之前我们写的 watch 方法其实默认写的就是这个handler,Vue.js会去处理这个逻辑，最终编译出来其实就是这个handler。
deep的意思就是深入观察，监听器会一层层的往下遍历，给对象的所有属性都加上这个监听器，但是这样性能开销就会非常大了，任何修改obj里面任何一个属性都会触发这个监听器里的 handler。
7 关于自定义
自定义指令是用来操作DOM的。尽管Vue推崇数据驱动视图的理念，但并非所有情况都适合数据驱动。自定义指令就是一种有效的补充和扩展，不仅可用于定义任何的DOM操作，并且是可复用的。
过滤器的作用：实现数据的筛选、过滤、格式化。
8你选vue框架的出发点是什么？vue开发中遇到过哪些棘手的问题？
vue的优势：
1.是一个轻巧、高性能、可组件化的MVVM库，同时拥有非常容易上手的API
2.响应式编程、组件化
3.轻量级框架、简单易学、双向数据绑定、组件化、视图、数据和结构的分离、虚拟DOM、运行速度快
遇到的坑:
1. 路由变化页面数据h不刷新问题
出现这种情况是因为依赖路由的params参数获取写在created生命周期里面,因为相同路由二次甚至多次加载的关系 没有达到监听，退出页面再进入另一个文章页面并不会运行created组件生命周期,导致文章数据还是第一次进入的数据解决方法：watch监听路由是否变化
9,this.$nextTick 使用过没? 具体用于什么场景
定义：将回调延迟到下次 DOM 更新循环之后执行。在修改数据之后立即使用它，然后等待 DOM 更新。（当data中的某个属性改变的时候，这个值并不是立即渲染到页面上，而是先放到watcher队列上（异步），只有当前任务空闲的时候才会去执行watcher队列上的任务。）
优点：想对未来更新后的视图进行操作，我们只需要把要执行的函数传递给this.$nextTick方法，vue就会给我们做这个工作。
10,vue slot 具体用法 你项目怎么使用slot
slot用于封装组件中，写在子组件 接收父组件动态传递子组件内容片断
slot插槽的使用方法其实就是类似于一个子组件或者标签的引用的过程，在父组件里面定义一个slot，给她起个name，然后组件引入到子组件，子组件里面有个元素的属性slot值等于name，然后父组件里面没有值的时候就可以显示子组件里面的信息了（切记：插槽slot要写在父组件里面！！！）
2020/11/10 11:39
(1) ajax 交互式网页应用的网页开发技术
1: 创建一个异步调用对象
2:创建一个新的`HTTP`请求,并指定该请求的方法及验证信息
(3)设置响应`HTTP`请求状态变化的函数.
(4)发送`HTTP`请求.
(5)获取异步调用返回的数据.
(6)使用JS和DOM实现局部刷新.
ajax的核心是 ： 通过XmlHttpRequest获取非本页内容，
jsonp的核心 ： 动态添加
(2)this
a.如果是一般函数,this指向全局对象window;
b.在严格模式下,为undefined.
c.对象的方法里调用,this指向调用该方法的对象.
d.构造函数里的this,指向创建出来的实例.
(call,apply,bind会改变this的指向)
(3) jquery:
（1）使用模块化思想,模块间保持独立,
不会导致多个开发人员合作时产生冲突
（2）结构清晰，高内聚，低耦合
（3）多态的方式使方法可以重载，提高了代码的复用率
（4）jQuery 的链式调用以及回溯（dom操作的链式操作）
（5）jQuery.extend方法来实现扩展静态方法或实例方法
缺点 :
不能向后兼容 , 多个插件易冲突 , 插件兼容性差
jquery的稳定性 , 对动画和特效的支持差
(4) 闭包的特点
1.必须有两个函数，并且是嵌套关系，外面的函数必须返回里面的函数
2.在全局中必须接收返回 函数作为变量储存
3.闭包能够形成一个封闭的空间，可以避免污染，储存私有变量，
存在函数里面 ，这个私有变量不会在函数运行完后被清理 ，
可以像全局变量一样被使用，不会失效。
缺点:闭包最大缺点就是会造成内存泄漏，存在堆中，不会被垃圾回收；
优点：
1.内容更封闭，保证命名不会冲突；
2.模块化开发—封闭的模块化环境
(5) 什么是深浅拷贝,区别是什么?
浅拷贝（shallowCopy）只是增加了一个指针指向已存在的内存地址，
深拷贝（deepCopy）是增加了一个指针并且申请了一个新的内存，使这个增加的指针向这个新的内存
浅拷贝 拿人手短,共用内存,复制指针 => 深拷贝,自食其力,复制指针,开辟内存
8. 说一下你最近项目开发的技术亮点
1.使用了命名视图
2.使用了复杂的加密方式 base64 MD5(不可逆)
3.配置了一个拦截器request
4.自己封装了一个懒加载的指令,加载图片
9. 说一下你的前端成长经历,你是如何一步步成为前端大牛的?
简单的说：就是以下几点：多做…多想…多看…多做demo，发现问题,分析问题,解决问题,由浅入深!
6. 如何使元素垂直水平居中? 4种
1.弹性盒方法——flex布局
元素：display: flex;justify-content: center;align-items: center;
2.纯absolute
父元素 position: relative
子元素 position: absolute;top: 50%;left: 50%; margin-left:-1/2子元素宽度; margin-top: -1/2子元素高度;
3.margin：auto+absolute
父元素 position: relative
子元素 position: absolute；top: 0； left: 0; right:0; bottom:0;margin:auto
4.定位+transform：
父元素 position: relative
子元素 position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%)
(7)关于你所熟悉的后端语言
- PHP
PHP。它是由安装在web服务器（Apache、Ngix）上的组件运行的。PHP代码可以和HTML混合到一块。 对于初学者就能很快写出很有价值的代码，这并不需要太多的练习。 这让PHP变得越来越流行, 现在全球百分之八十的服务器上都在运行着PHP。全球四分之一的网站都在用的一个内容管理系统–WordPress，就是用PHP写的。
- Node.js
Node.js。它是基于Google的V8 JavaScript解释引擎（在Chrome浏览器里它负责执行客户端的JavaScript代码）。与其它语言不同的是Node.js内置了处理网络请求和响应的函数库，所以你不需要单独的服务器（Apache、Ngix）或者其他依赖。Node.js虽然很新但是很快就获得了极大的追捧。在很多的大公司都有在使用，例如：Microsoft，Yahoo，LinkedIn和PayPal。
(8). 谈谈你对面向对象的理解 面向对象的特点?
面向对象：先构造概念，然后将概念实例化，所有实例化对象都可以使用概念内的方法
通俗的理解就是：万物皆对象！世界上的任何事和物都可以被视为对象，而我们需要关注的是对象本身可以实现的功能，不需要深入理解构成对象的元素。
面向对象有四个特点：
1. 抽象：抓住核心问题
2. 封装：即把能够实现功能的函数写成封装起来，在面向对象里叫做方法。简单来说就是把实现功能的函数写成方法。
3. 继承：继承的意思是，在实现同一种功能的前提下，新对象可以使用旧对象的属性和方法。
4. 多态：一个变量在引用不同类型的情况下的不同状态。多态开发在开发组件和模块化开发的时候能节省很多资源。
原型（prototype）
原型可以用来构造函数的属性和方法，使这个构造函数的属性和方法成为公用的。使用原型的优点：在内存中节省资源，提高系统性能。
(9)如何深入理解原型链
原型链就是创建一个构造函数，它会默认生成一个prototype属性并指向原型对象。使用下一个构造函数的原型对象作为这个构造函数的实例。即 nextFuction.prototype = new thisFuction();
在下下一个构造函数的原型对象 = new nextFuction。这样下去就会构成一条实例与原型之间的链条，这就是原型链。
在通过原型链实现继承的情况下，当读取模式访问实例中的属性时，会先搜索实例，然后再搜索实例的原型，在一层一层直到找到或者到达原型链的末端停止，返回undefined。所有引用类型都是从object继承来的。
(10)如何区分 宿主对象 内置对象 本地对象 分别有哪些?
宿主对象 window document 简单的说就是官方未定义的都是宿主对象
内置对象 不可以实例化的对象 例如: Global Math
本地对象 可以实例化的对象 例如: Object Array Function Number RegExp Date ...
(11)解析网址 http://localhost:8080/a/b/c?a=1&b=2#abc
protocol: 'http:',//协议
hostname: 'localhost',域名
port: '8080',//端口
pathname: '/a/b/c', //路径名
search: '?a=1&b=2',
hash: '#abc',
href: 'http://localhost:8080/a/b/c?a=1&b=2#abc'
path: '/a/b/c?a=1&b=2',
query: 'a=1&b=2',
用到的最多的就是pathname和query两个属性了，请注意区分host/hostname、search/query、path/pathname之间的区别
(12) 说一下什么是变量提升 如何解决变量提升
当我们在一个变量定义前调用这个变量会输出一个undefind，因为我们用var来声明这个变量的时候会在调用这个变量的前面假设定义了一个没有被赋值的变量 ,这就是变量提升，当我们用function关键字来定义一个函数的时候在任何地方我们都可以调用这个函数，如果我们用变量声明的方式来定义函数，在函数定义的前面调用函数会报undefind，也是因为变量提升， 用let声明一个变量就不会存在变量提升
1. 你做的页面在哪些流览器测试过？这些浏览器的内核分别是什么?
IE: trident 内核
Firefox：gecko 内核
Safari:webkit 内核
Opera:以前是 presto 内核，Opera 现已改用
Chrome 的 Blink 内核
Doctype ：告诉浏览器按照何种规范解析页 面
vue 父组件 去访问 通信 作用 子组件 方式有哪些 ?
1、ref 加在子组件上，用this.ref.name 获取到的是组件实例，可以使用组件的所有方法。
2.父组件通过 props 向下传递数据给子组件,子组件在props中创建一个属性，用以接收父组件传过来的值
3 空的vue实例
4 vuex
vue子组件 去通信 父组件的方式有哪些？
1.通过this.emit绑定的事件watchChild，然后父组件监听watchChild，一旦watchChild被触发便会触发父组件的parentReceive方法.
2.在子组件props中定义属性onOK，类型为function，然后在父组件中把要触发的方法名传递给onOK属性，最后在子组件中判断onOk是否存在，是的话直接执行这个方法。
3.this.$parent方法
vue路由 里面路由守卫 哪三种路由守卫？什么作用
监听路由切换 各写以一个路由守卫函数
1全局守卫 ① 全局 router.beforeEach((to, from, next) => {})
② 后置 router.afterEach((to, from) => {})
③ 全局解析守卫 router.beforeResolve((to, from, next) => {})
2组件内守卫 router.beforeRouteEnter((to, from, next) => {})
router.beforeRouteUpdate((to, from, next) => {})
router.beforeRouteLeave((to, from, next) => {})
3路由独享守卫 router.beforeEnter((to, from, next) => {})
作用 ：对每一次页面的跳转或刷新进行判断
1. 简述一下你知道的有哪些ES6的新特性
Let const 结构赋值 箭头函数 字符串模板 class类
类。promise。箭头函数 解构赋值。let const async await
1.箭头操作符(箭头函数)
2.类的支持（class）
3.字符串模板
4.参数结构
5.参数默认值，不定参数，拓展参数
6.let与const 关键字
7.模块
8.Promise
2. 说一下什么是块级作用域 , 它有什么作用
块级作用域就是let const,作用就是不会进行变量提升，能解决内存泄漏
Let const
作用：
变量提升
1. 块级作用域任意嵌套
2. 外层作用域无法读取内层作用域的变量
3. 内层作用域可以定义外层作用域的同名变量
4. 函数本身的作用域在其所在的块级作用域之内
5. 在ES5中，因为没有块级作用域，获得广泛运用的是立即执行函数。现在ES6增加了块级作用域，那么立即执行函数就不再必要了
6. 在严格模式下，函数只能在顶级作用域和函数内声明，在if代码块和循环代码块下的声明都会报错。
3. 谈谈箭头函数 有什么特点 ()=>{}(敲黑板)
1.不能作为构造函数，不能使用new
2.不能使用arguments，取而代之用rest参数解决
3.不绑定this，会捕获其定义时所在的this指向作为自己的this
4.箭头函数没有原型对象
5.与执行时this无关 ，只与定义时的this有关。 箭头函数能够保存this的指向
1、语法简单
2、内置return语句、单行代码返回当前代码的返回值、多行时返回undefined
3、自动绑定this、this为上级的作用域中、也就是定义时所在的作用域中的this
4、没有arguments参数
5、 没有constructor、prototype属性、不能被new
6、以字面量的形式作为对象的属性时、容易发生引用错误
5. ES6 中你是怎么使用 promise 的 ？
New promise 带2个参数（resolve，reject）执行返回一个成功的回调函数或是一个失败的回调函数。再在返回的函数上直接调用then方法，then接收一个参数，是函数（这个函数是回调函数）
promise是用来实现异步编程的一种解决方案
Promise在生命周期内有三种状态，
分别是
pending（进行中）、
Resolved（已完成，又称 Fulfilled） 或
rejected（已失败）
使用方式：（一个成功的resolve函数， 一个失败的reject函数）
（1）new Promise(function(resolve, reject)
（2）then(resolve,reject)
（3）then(resolve),catch(reject)
6. 严格模式 有什么 特点 ? （3-4条）
1.严格模式下不可以使用with（）
2.严格模式下，变量必须声明
3.严格模式下，this默认是undefined
4.严格模式下，为只读变量和不可扩展对象赋值会报错
5.严格模式下，函数的形参不可以同名
6.严格模式下，不可以使用caller和arguments的属性，会报错
7. 混合开发的原理(cordova DCloud 微信JSSDK)
WebViewJavacrriptBridge是移动UIView和Html交互通信的桥梁，实现native code和js 的互相调用的桥梁。
8. 混合开发的优缺点
优点
1.一次编译多平台运行
2.开发速度快，不需要了解各个平台的native开发语言也可以开发轻量级移动应用
3.各平台UI表现一致
4.内容更新不需要内容审查
缺点
1. 使用体验与native开发有差距
2. 前端代码容易被盗取
9. JSSDK 你知道的有哪些 API (SDK JDK)
Wx.createAudioContext(相机)
Wx.createMapContext（地图）
Wx.getExtConfig（第三方平台）
Wx.getShareInfo（获取转发详细信息）
分享到朋友圈 wx.ready(function{ })
图像选择接口 wx.chooseImage({})
获取地理位置接口 wx.getLocation({})
wx.request wx.showtoast. wx.showloading wx.getstoragesync. wx.getuserinfo
Map. Swiper button input scroll-view from image
1 你在实际开发中如何和IOS/Android 程0.序员进行交互的。
传统开发模式：
一般传统上的开发协作模式有两种：
一种是前端先写一个静态页面，写好后，让后端去套模板。静态页面可以本地开发，也无需考虑业务逻辑只需要实现View即可。不足是还需要后端套模板，这些前端代码后端需要浏览一遍，以免出错。
另一种协作模式是，前端直接去写模板，这样做的问题在于，前端编写过程中很依赖与后端环境，如果当后端没写完的情况下，前端几乎没法干活。
从传统到前后端分离：
前后端分离意味着，前后端之间使用 JSON 来交流，两个开发团队之间使用 API 作为契约进行交互。从此，后台选用的技术栈不影响前台。当后台开发人员选择 Java 的时候，我可以不用 JSP 来编写前端页面，继续使用我的 React 又或者 Angular。而我使用 React 时，也不影响后台使用某一个框架。安卓和IOS app也可以使用 JSON 来和后端交流。
当变量还没有赋值的时候，使用变量的时候，会报一个undefined，js是弱语言，会进行变量提升
后台传一个URL给你，将URL传给安卓/iOS,他负责播放
12. 微信小程序开发 中 关于 page的生命周期钩子函数 有哪些?
onload onready. onShow,onHide,onUnload
14. 微信小程序 你经常使用哪些指令 wx:if wx:for
15. 微信小程序 绑定事件 bindtap 和 catch 的区别
bindtap. 不会阻止事件冒泡。 catch。阻止事件冒泡
1. html5 新特性 CSS3 新特性
html5 新特性
用于绘画的 canvas 元素
用于媒介回放的 video 和 audio 元素
对本地离线存储的更好的支持 localStorage&sessionStorage
新的特殊内容元素，比如 article、footer、header、nav、section
新的表单控件，比如 calendar、date、time、email、url、search
css3 新特性
阴影 文本阴影text-shadow 盒子阴影 box-shadow
边框圆角 border-radius
边框图片boeder-image
过渡trasition
animation动画
2D 3D动画
伪类选择器 first-child last-child nth-child(n)
背景： 背景大小 background-size 背景原点background-origin 多背景background: url() ,url(),url()
渐变 ： 线性渐变：background-image:linear-gradient(渐变方向开始和结束状态，渐变范围（距离）) 径向渐变background-image:radial-gradient(圆点，开始、结束)
2. 本地存储指的是什么? localStorage&sessionStorage 的区别?什么是离线存储
本地存储指的是储存在用户本地终端上的数据
sessionStorage，只会在窗口打开的时候才有效，一次性缓存会话，关闭浏览器自动释放
localStorage，只要没有手动清除，就会一直保留，永久存储，以文件形式存储
HTML5提出的一个新的特性：离线存储。通过离线存储，我们可以通过把需要离线存储在本地的文件列在一个manifest配置文件中，这样即使在离线的情况下，用户也可以正常使用App。
3. 前端性能优化的方法有哪些? 6条
1.优化图片资源的格式和大小
2.开启网络压缩
3.使用浏览器缓存
4.减少重定向请求
5.使用CDN存储静态资源
6.减少DNS查询次数
7.压缩css和js内容
4. 你知道浏览器兼容的bug有哪些，说出对应兼容bug的解决方式 3 条
一、不同浏览器的标签默认的外边界和内填充不同
解决方案：css里 *{margin:0; padding:0;}
二、块属性标签float后，又有横向的margin情况下，在IE6显示margin比设置的大
解决方案：在float的标签样式控制中加入display:inline;转化为行内属性
三、设置较小高度标签(一般小于10px)，在IE6、IE7，遨游中高度超出设置高度值
解决方案：给超出高度的标签设置overflow:hidden;或者设置行高line-height小于你设置的高度
四，标签最低高度设置min-height不兼容
解决方案：如果设置一个标签最小高度为200px，需要进行设置 {min-height:200px; height:auto !important;height: 200px; overflow:visible;}
6. DOM和DOM2事件写法的区别?
dom0级后面绑定的事件会覆盖前面绑定的事件，点击的时候会执行新绑定的
dom2级不会覆盖前面绑定的事件，点击的时候所有绑定的事件会依次执行一遍
8. webpack和gulp的区别？
1.Gulp侧重于前端开发的 整个过程 的控制管理（像是流水线），我们可以通过给gulp配置不通的task（通过Gulp中的gulp.task()方法配置，比如启动server、sass/less预编译、文件的合并压缩等等）来让gulp实现不同的功能，从而构建整个前端开发流程。
2.Webpack有人也称之为 模块打包机 ，由此也可以看出Webpack更侧重于模块打包，当然我们可以把开发中的所有资源（图片、js文件、css文件等）都可以看成模块，最初Webpack本身就是为前端JS代码打包而设计的，后来被扩展到其他资源的打包处理。Webpack是通过loader（加载器）和plugins（插件）对资源进行处理的。
3.另外我们知道Gulp是对整个过程进行控制，所以在其配置文件（gulpfile.js）中配置的每一个task对项目中 该task配置路径下所有的资源 都可以管理。比如，对sass文件进行预编译的task可以对其配置路径下的所有sass文件进行预编译处理
1. 你觉得的HTTP的状态码有哪些?仔细说明
1开头：（被接受，需要继续处理。）这一类型的状态码，代表请求已被接受，需要继续处理。
200开头 （请求成功）这一类型的状态码，代表请求已成功被服务器接收、理解、并接受
304开头 （请求被重定向）这类状态码代表需要客户端采取进一步的操作才能完成请求。通常，这些状态码用来重定向，后续的请求地址（重定向目标）在本次响应的 Location 域中指明。
400开头：（请求错误）这类的状态码代表了客户端看起来可能发生了错误，妨碍了服务器的处理。
500开头：（服务器错误）这类状态码代表了服务器在处理请求的过程中有错误或者异常状态发生，也有可能是服务器意识到以当前的软硬件资源无法完成对请求的处理。
具体：
200 OK 服务器成功处理了请求（这个是我们见到最多的）
404 Not Found(页面丢失)未找到资源
500 Internal Server Error：服务器内部出现了错误.数据库问题
3. 你项目中如何处理跨域请求?（JSONP 反向代理 proxy postMessage CROS ）
同源策略:
请求的url地址,必须与浏览器上的url地址处于同域上,也就是域名,端口,协议相同.
1.jsonp
通常为了减轻web服务器的负载，我们把js、css，img等静态资源分离到另一台独立域名的服务器上，在html页面中再通过相应的标签从不同域名下加载静态资源，而被浏览器允许，基于此原理，我们可以通过动态创建script，再请求一个带参网址实现跨域通信。
JSONP 是 JSON with padding（填充式 JSON 或参数式 JSON）的简写。
5. 什么是事件委托? 列举使用事件委托的地方\
1.通俗的讲，事件就是onclick，onmouseover，onmouseout，等就是事件，委托呢，就是让别人来做，这个事件本来是加在某些元素上的，然而你却加到别人身上来做，完成这个事件。也就是：利用冒泡的原理，把事件加到父级上，触发执行效果。
好处:
1.提高性能。
2.新添加的元素还会有之前的事件。
6. 你如何在jquery 插件的基础上封装新的插件 (.fn.extend ) (.fn 的区别 )
1. jQuery.extend() 方法有一个重载。
jQuery.extend(object) ,一个参数的用于扩展jQuery类本身，也就是用来在jQuery类/命名空间上增加新函数，或者叫静态方法，例如jQuery内置的 ajax方法都是用jQuery.ajax()这样调用的，有点像 “类名.方法名” 静态方法的调用方式。
2.jQuery.fn.extend(object)扩展 jQuery 元素集来提供新的方法（通常用来制作插件）。
首先我们来看fn 是什么东西呢。查看jQuery代码，就不难发现。
jQuery.fn = jQuery.prototype = {
init: function( selector, context ) {.....};
};
7. 使用版本控制工具git
git remote -v 查看远程关联网址
git remote rm origin 清除之前的关联
git remote add origin https:// 添加新的关联
git stash 保存当前工作进度
git pull origin master 拉取远程代码到本地
// 最基础的五步步走!
git add ./ 把代码添加到暂存区
git commit -m "bu1" 代码提交到了 HEAD
git push origin master 代码提交到远端仓库
分支与远程的关系
创建“feature_x”的分支，并切换过去：git checkout -b feature_x
切换回主分支：git checkout master
再把新建的分支删掉：git branch -d feature_x
除非将分支推送到远端仓库，不然该分支就是 不为他人所见的：
git push origin
4.解决冲突绝招
如果冲突，自己修改的文件自己知道，则把修改的文件复制到其它目录，然后强制用远程覆盖本地文件，然后把修改的文件考回来覆盖。这样的好处是多人修改后，多个文件，修改起来太复杂。这样的方式非常方便高效。
具体：
别光解决问题，想想究竟发生了什么
学会预见未来的浏览器发展趋势
前后端开发的一个主要区别在于后端代码通常都运行在完全由你掌控的环境下。前端相对来说不那么在你的掌控之中。不同用户的平台或设备是前端永恒的话题，你的代码需要优雅掌控这一切。
阅读规范文档
浏览器有 bug 是很难免的事，但是当同一份代码在两个浏览器渲染出来的效果不一样，人们总会不假思索的推测，那个“广受好评”的浏览器是对的，而“不起眼”的浏览器是错的。但事实并不一定如此，当我的假设出现错误时，我选取的变通办法都会在未来遭遇问题。
阅读别人的代码
自己独立解决问题绝对是个不错的方式，但是这不应该是我唯一的方式，因为它很快就会让我稳定在某个层次。阅读别人的代码会让我开阔思维，并且阅读和理解别人写的代码也是团队协作或开源贡献必须具备的能力。
与比你聪明的人一起工作
“造轮子”
造一个自己喜欢的或者平时使用频率很高的的 JavaScript 库或 CSS 框架，在我遇到困难的时候，所有现成的库的源代码都会为我提供帮助。
把你学到的东西都记录下来
10. 如何看待当前前端发展的趋势,和未来技术走向?
看未来的发展方向，无非就是看现在的解决方案所存在的痛点。
1. 浏览器的性能问题
和原生的 App 相比，性能一直一个致命的痛点，如果要追求性能，肯定得用原生 App。那么在性能上，未来几年可能是一个方向。
①前端代码编译为字节码，虽然还是难以达到原生App的水平，但已经能够满足绝大部分应用的性能需求，WebAssembly 字节码和底层机器码很相似可快速装载运行，因此性能相对于 JS 解释执行大大提升。
②统一的DOM树限制了单线程的渲染
理论上来说，一个页面某个时间变化的部分只是集中在一小块区域，没有必要将整个DOM树锁住。因此，一个可能的方向是分区渲染，即将页面划分为几个不同的区域，每个区域有独立的DOM树，独立渲染，那么性能会高很多，类似于 App 开发中的组件，组件类的运行不影响其它组件，如果需要依赖其它组件，通过组件间消息进行通信。
Ps:
1. 多注重框架原理，现在对于前端工程化，个人认为差不多到了瓶颈期，很难有新的突破，注重原理才能很好的应对未来的发展。
2. 眼界放宽、拓宽自己知识的广度。
3.TS 一定会再火的，未来项目会越来越复杂，用了 TS 项目的风险会可控很多。
1. （什么是模块化开发 怎么实现模块化开发） require exports defined
模块定义 define
模块暴露 exports
模块引入 require
2. node 开发 返回的数据的文档类型格式有哪些 5条 （content-type）
buffer string css js from json
3. npm 安装开发依赖 项目依赖
--global -g 全局依赖
--save-dev -D 开发依赖 devDependencies 辅助开发
--save -S 项目依赖 dependencies 项目始终需要
4. mongodb 和 mysql 数据库的区别
5. 说一下加密方式有哪些 谈一下基于node 加密模块
常用的加密方式有md5、sha1、base64、Hmac、AES、Diffie-Hellman等，基于node的加密模块是crypto模块
6. node + express ejs 后端模板引擎 有哪些特点
1，缓存功能，能够缓存已经解析好的html模版；
2，可以使用express视图系统；
3，可以自定义标签，
比如 '<%' 可以使用 '{{' 替代， '%>' 用 '}}' 代替；
4，编译和渲染速度快；
5，支持浏览器端和服务器端；
6，自定义标记分隔符；
模版标签很简单。 编译速度快。完全支持express系统。
