一、CSS 01.Flex布局
display:flex; 在父元素设置，子元素受弹性盒影响，默认排成一行，如果超出一行，按比例压缩?
容器属性：
1.flex-direction属性
取值：row(默认)?| row-reverse | column | column-reverse
用于控制项目排列方向与顺序，默认row，即横向排列，项目排列顺序为正序1-2-3；row-reverse同为横向排列，但项目顺序为倒序3-2-1。
column 与row相反，为纵向排列，项目顺序为正序1-2-3，column-reverse同为纵向排列，项目顺序为倒序3-2-1。
2.flex-wrap属性
取值：nowrap(默认)?| wrap | wrap-reverse
用于控制项目是否换行，nowrap表示不换行；
举个例子：比如容器宽度为300px，容器中有6个宽度为60px的项目，nowrap情况下，项目会强行等分容器宽度从而不换行，那么项目实际宽度也就只有50px了，而非我们自己设置的60px。
3.flex-flow属性
flex-flow属性是flex-deriction与flex-wrap属性的简写集合，默认属性为row nowrap，即横向排列，且不换行，如果需要控制项目排列与换行，推荐使用此属性，而非单独写两个。
4.justify-content属性
取值：flex-start(默认)?| flex-end | center | space-between | space-around | space-evenly;
用于控制项目在横轴的对齐方式，默认flex-start即左对齐，center 为居中，对应的flex-end为右对齐。space-between为左右两端对齐，即左右两侧项目都紧贴容器，且项目之间间距相等。space-around为项目之间间距为左右两侧项目到容器间距的2倍；space-evenly为项目之间间距与项目与容器间距相等，相当于除去项目宽度，平均分配了剩余宽度作为项目左右margin。
5.align-items属性
取值：flex-start | flex-end | center | baseline |?stretch(默认)
用于控制项目在纵轴排列方式，默认stretch即如果项目没设置高度，或高度为auto，则占满整个容器，下面第一张图的项目没设置高度，其余图片中均为60px。flex-start会让项目在纵轴紧贴容器顶部，flex-end与之相反：center使用最多，自然不会陌生，在纵轴中心位置排列：baseline比较特殊，它让项目以第一行文字的基线为参照进行排列：
6.align-content
取值：flex-start | flex-end | center | space-between | space-around | space-evenly |?stretch(默认);
用于控制多行项目的对齐方式，如果项目只有一行则不会起作用；默认stretch，即在项目没设置高度，或高度为auto情况下让项目填满整个容器，与align-items类似
项目属性：
1.order
取值：默认0，用于决定项目排列顺序，数值越小，项目排列越靠前。
2.flex-grow
取值：默认0，用于决定项目在有剩余空间的情况下是否放大，默认不放大；注意，即便设置了固定宽度，也会放大。
假设默认三个项目中前两个个项目都是0，最后一个是1，最后的项目会沾满剩余所有空间。
3.flex-shrink
取值：默认1，用于决定项目在空间不足时是否缩小，默认项目都是1，即空间不足时大家一起等比缩小；注意，即便设置了固定宽度，也会缩小。
但如果某个项目flex-shrink设置为0，则即便空间不够，自身也不缩小。
4.flex-basis
取值：默认auto，用于设置项目宽度，默认auto时，项目会保持默认宽度，或者以width为自身的宽度，但如果设置了flex-basis，权重会width属性高，因此会覆盖widtn属性。
5.flex
取值：默认0 1 auto，flex属性是flex-grow，flex-shrink与flex-basis三个属性的简写，用于定义项目放大，缩小与宽度。
该属性有两个快捷键值，分别是auto(1 1 auto)等分放大缩小，与none(0 0 auto)不放大不缩小。
6.align-self
取值：auto(默认)?| flex-start | flex-end | center | baseline | stretch，表示继承父容器的align-items属性。如果没父元素，则默认stretch。
用于让个别项目拥有与其它项目不同的对齐方式，各值的表现与父容器的align-items属性完全一致。
02.CSS3新特性 transition：过渡animation：动画transform：形状转换选择器box-shadow：阴影border-radius：边框圆形化处理rgba：颜色弹性布局Flexaudio 音频video 视频text-shadow 03.img中alt和title的区别alt属性是在图片不能正常显示时出现的文本提示。
title属性是在鼠标在移动到元素上的文本提示。
?04.用纯CSS创建一个三角形? <style> div { width: 0; height: 0; border-top: 40px solid transparent; border-left: 40px solid transparent; border-right: 40px solid transparent; border-bottom: 40px solid #ff0000; } </style> </head> <body> <div></div> </body> 05.CSS的盒子模型box-sizing:conten-box（标准模型）| border-box（IE模型）
标准盒子模型：宽度=内容的宽度（content）+ border + padding
IE盒子模型：宽度=内容宽度（content+border+padding)
?06.div水平居中a. 已知宽度，block元素 ，添加添加margin:0 auto属性。
b.已知宽度，绝对定位的居中 ，上下左右都为0，margin:auto
07.div水平垂直居中div {
position: relative / fixed; /* 相对定位或绝对定位均可 */
width:500px;
height:300px;
top: 50%;
left: 50%;
margin-top:-150px;
margin-left:-250px;?
}
div {
position: relative / fixed; /* 相对定位或绝对定位均可 */
top: 50%;
left: 50%;
transform：translate（-50%，-50%）
}
div {
display:flex;
justify-content:center;
align-content:center;
}
?08.清除浮动 clear清除浮动（添加空div法）在浮动元素下方添加空div,并给该元素写css样式 {clear:both;height:0;overflow:hidden;}给浮动元素父级设置高度父级同时浮动（需要给父级同级元素添加浮动）父级设置成inline-block，其margin: 0 auto居中方式失效给父级添加overflow:hidden 清除浮动方法万能清除法 after伪类 清浮动（现在主流方法，推荐使用）float_div:after{ content:"."; clear:both; display:block; height:0; overflow:hidden; visibility:hidden; } .float_div{ zoom:1 }
?09.display:none 和 visibility: hidden的区别display:none 隐藏对应的元素，在文档布局中不再给它分配空间，它各边的元素会合拢，就当他从来不存在。
visibility:hidden 隐藏对应的元素，但是在文档布局中仍保留原来的空间。
?10.CSS中 link 和@import 的区别 link属于HTML标签，而@import是CSS提供的页面被加载的时，link会同时被加载（并行），而@import引用的CSS会等到页面被加载完再加载（串行）import只在IE5以上才能识别，而link是HTML标签，无兼容问题link方式的样式的权重 高于@import的权重. ?11.position的absolute与fixed共同点与不同点共同点： 改变行内元素的呈现方式，display被置为block 让元素脱离普通流，不占据空间 默认会覆盖到非定位元素上
不同点： absolute的”根元素“是可以设置的 fixed的”根元素“固定为浏览器窗口。当你滚动网页，fixed元素与浏览器窗口之间的距离是不变的。
?12.transition和animation的区别主要区别是transition需要触发一个事件才能改变属性， 而animation不需要触发任何事件的情况下才会随时间改变属性值，并且transition为2帧，从from .... to，而animation可以一帧一帧的。
transition 规定动画的名字 规定完成过渡效果需要多少秒或毫秒 规定速度效果 定义过渡效果何时开始 animation 指定要绑定到选择器的关键帧的名称
13.?CSS优先级 !important（优先级最高）id 选择器class选择器、属性选择器、伪类选择器标签选择器、伪元素选择器通配符选择器、关系选择器 （优先级最低） ?14.title与h3的区别、b与strong的区别、i与em的区别？?<b>与 <strong>用在网页上都能使字体加粗，二者的不同是：<b>是物理元素 ;<strong>是逻辑元素。 物理元素强调的是一种物理行为。比如说，把一段文字用b加粗，意思是告诉浏览器应该加粗显示，没有其他作用。而<strong>可以从字面理解知道它是强调的意思，<strong>是逻辑标签，强调文档逻辑。?对于搜索引擎（SEO）来说，<strong>比<b>重视的多。 <em>和<i>都是斜体，但是<em>是逻辑元素，<i>是物理元素。
15.BFCBFC(Block formatting context)直译为"块级格式化上下文"。它是一个独立的渲染区域，只有Block-level box参与,
哪些情况会产生BFC:
根元素float属性不为noneposition为absolute或fixeddisplay为inline-block, table-cell, table-caption, flex, inline-flexoverflow不为visible ?二、JS 0.基本数据类型 nullundefindBooleanStringNumbersymbol 1.typeof和instance of 检测数据类型有什么区别？相同点： 都常用来判断一个变量是否为空，或者是什么类型的。
不同点：
typeof 返回值是一个字符串，用来说明变量的数据类型instanceof 用于判断一个变量是否属于某个对象的实例 ?2.元素消失的方法 opacity:0,该元素隐藏起来了，但不会改变页面布局，并且，如果该元素已经绑定了一些事件，如click事件也能触发。visibility:hidden,该元素隐藏起来了，但不会改变页面布局，但是不会触发该元素已经绑定的事件。display:node, 把元素隐藏起来，并且会改变页面布局，可以理解成在页面中把该元素删掉。z-index:-1 ?3.浅拷贝和深拷贝浅拷贝只是对指针的拷贝，拷贝后两个指针指向同一个内存空间
深拷贝不但对指针进行拷贝，而且对指针指向的内容进行拷贝，经深拷贝后的指针是指向两个不同地址的指针。
?4.es6的新特性 let定义块级作用域变量 没有变量的提升，必须先声明后使用 let声明的变量，不能与前面的let，var，conset声明的变量重名const 定义只读变量 const声明变量的同时必须赋值，const声明的变量必须初始化，一旦初始化完毕就不允许修改 const声明变量也是一个块级作用域变量 const声明的变量没有“变量的提升”，必须先声明后使用 const声明的变量不能与前面的let， var ， const声明的变量重 const定义的对象\数组中的属性值可以修改,基础数据类型不可以ES6可以给形参函数设置默认值数组之前加上三个点（...）展开运算符数组的解构赋值、对象的解构赋值箭头函数的特点 箭头函数相当于匿名函数，是不能作为构造函数的，不能被new 箭头函数没有arguments实参集合,取而代之用...剩余运算符解决 箭头函数没有自己的this。他的this是继承当前上下文中的this 箭头函数没有函数原型 箭头函数不能当做Generator函数，不能使用yield关键字 不能使用call、apply、bind改变箭头函数中this指向 Set数据结构，数组去重 ?5.==和===区别是什么？==返回一个布尔值；相等返回true，不相等返回false； 允许不同数据类型之间的比较； 如果是不同类型的数据进行，会默认进行数据类型之间的转换； 如果是对象数据类型的比较，比较的是空间地址
=== 只要数据类型不一样，就返回false；
6.call bind apply 的区别？ 都是用于改变this指向通过apply和call改变函数的this指向，他们两个函数的第一个参数都是一样的表示要改变指向的那个对象，第二个参数，apply是数组，而call则是arg1,arg2...这种形式。通过bind改变this作用域会返回一个新的函数，这个函数不会马上执行。 7.js继承方式 原型链继承 核心： 将父类的实例作为子类的原型构造继承 核心：使用父类的构造函数来增强子类实例，等于是复制父类的实例属性给子类实例继承 核心：为父类实例添加新特性，作为子类实例返回拷贝继承组合继承 核心：通过调用父类构造，继承父类的属性并保留传参的优点，然后通过将父类实例作为子类原型，实现 函数复用寄生组合继承 核心：通过寄生方式，砍掉父类的实例属性，这样，在调用两次父类的构造的时候，就不会初始化两次实 例方法/属性，避免的组合继承的缺点 8.闭包的理解在函数的内部可以访问全局变量，但是在函数的外部无法访问函数内部的局部变量。 有时候我们需要获取函数内部的局部变量，此时就要使用到闭包。 做法就是在函数内部再定义一个函数，这个函数就可以访问外部的变量，之后我们再把内部函数作为外部函数的返回值，这样就可以在外部函数中读取到局部变量了。 闭包就是定义在一个函数内部的函数，是连接内外函数的桥梁。
9.原型和原型链?把所有的对象共用的属性全部放在堆内存的一个对象（共用属性组成的对象），然后让每一个对象的 __proto__存储这个「共用属性组成的对象」的地址。而这个共用属性就是原型，原型出现的目的就是为了减少不必要的内存消耗。而原型链就是对象通过__proto__向当前实例所属类的原型上查找属性或方法的机制，如果找到Object的原型上还是没有找到想要的属性或者是方法则查找结束，最终会返回null
10.浏览器输入网址到页面渲染全过程 DNS解析TCP连接（三次握手）发送HTTP请求服务器处理请求并返回HTTP报文浏览器解析渲染页面关闭TCP连接（四次挥手） 11.?cookies，sessionStorage 和 localStorage 的区别相同点：都是保存在浏览器端，且同源的。
不同点：
cookie数据始终在同源的http请求中携带，即cookie在浏览器和服务器间来回传递。而sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。cookie数据还有路径（path）的概念，可以限制cookie只属于某个路径下。 存储大小限制也不同，cookie数据不能超过4k，同时因为每次http请求都会携带cookie，所以cookie只适合保存很小的数据。sessionStorage和localStorage 虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大。 数据有效期不同，sessionStorage：仅在当前浏览器窗口关闭前有效，自然也就不可能持久保持；localStorage：始终有效，窗口或浏览器关闭也一直保存，因此用作持久数据；cookie只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭。 作用域不同，sessionStorage不在不同的浏览器窗口中共享，即使是同一个页面；localStorage 在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的。 12.js中跨域方法 jsonp跨域(只能解决get）document.domain?基础域名相同 子域名不同window.name?利用在一个浏览器窗口内，载入所有的域名都是共享一个window.name服务器设置对CORS的支持?原理：服务器设置Access-Control-Allow-Origin HTTP响应头之后，浏览器将会允许跨域请求利用h5新特性window.postMessage()Web Sockets 13.?页面优化方法 减少 HTTP请求数从设计实现层面简化页面合理设置 HTTP缓存资源合并与压缩合并 CSS图片，减少请求数的又一个好办法。将外部脚本置底（将脚本内容在页面信息内容加载后再加载）多图片网页使用图片懒加载。在js中尽量减少闭包的使用尽量合并css和js文件尽量使用字体图标或者SVG图标，来代替传统的PNG等格式的图片减少对DOM的操作在JS中避免“嵌套循环”和 “死循环”尽可能使用事件委托（事件代理）来处理事件绑定的操作 14.Ajax步骤 ?创建ajax实例执行open 确定要访问的链接 以及同步异步监听请求状态发送请求 15.?数组去重的方法function unique(arr){
var arr2 = arr.sort();
var res = [arr2[0]];
for(var i=1;i<arr2.length;i++)
{ if(arr2[i] !== res[res.length-1]){ res.push(arr2[i]); } }
return res; }
利用下标查询
function unique(arr){
var newArr = [arr[0]];
for(var i=1;i<arr.length;i++){ if(newArr.indexOf(arr[i]) == -1){ newArr.push(arr[i]); } }
return newArr; }
16.?ajax中get和post请求的区别 get 一般用于获取数据get请求如果需要传递参数，那么会默认将参数拼接到url的后面；然后发送给服务器；get请求传递参数大小是有限制的；是浏览器的地址栏有大小限制；get安全性较低get 一般会走缓存，为了防止走缓存，给url后面每次拼的参数不同；放在?后面，一般用个时间戳post 一般用于发送数据post传递参数，需要把参数放进请求体中，发送给服务器；post请求参数放进了请求体中，对大小没有要求；post安全性比较高；post请求不会走缓存； 17.ajax的状态码?2开头（成功）
200 : 代表请求成功;3开头（重定向）
301 : 永久重定向；302: 临时转移304 : 读取缓存 [表示浏览器端有缓存，并且服务端未更新，不再向服务端请求资源]307:临时重定向4开头（客户端）
400 :数据/格式错误401: 权限不够；（身份不合格，访问网站的时候，登录和不登录是不一样的）404 : 路径错误，找不到文件5开头（服务器）
500 : 服务器的问题503: 超负荷 18.?常见的异步任务 定时器ajax事件绑定回调函数async awaitpromise 19.?作用域 全局作用域私有作用域块级作用域上级作用域 20.?Promise处理异步他是ES6中新增加的一个类（new Promise）,目的是为了管理JS中的异步编程的，所以把他称为“Promise设计模式” new Promise 经历三个状态：padding(准备状态：初始化成功、开始执行异步的任务)、fullfilled(成功状态)、rejected(失败状态)== Promise本身是同步编程的，他可以管理异步操作的（重点），new Promise的时候，会把传递的函数立即执行 Promise函数天生有两个参数，resolve(当异步操作执行成功，执行resolve方法),rejected(当异步操作失败，执行reject方法) then()方法中有两个函数，第一个传递的函数是resolve,第二个传递的函数是reject ajax中false代表同步，true代表异步，如果使用异步，不等ajax彻底完成
21.?map和forEach的区别相同点
都是循环遍历数组中的每一项 forEach和map方法里每次执行匿名函数都支持3个参数，参数分别是item（当前每一项）、index（索引值）、arr（原数组），需要用哪个的时候就写哪个 匿名函数中的this都是指向window 只能遍历数组不同点
map方法返回一个新的数组，数组中的元素为原始数组调用函数处理后的值。(原数组进行处理之后对应的一个新的数组。)map()方法不会改变原始数组 map()方法不会对空数组进行检测forEach()方法用于调用数组的每个元素，将元素传给回调函数.(没有return，返回值是undefined） 22.async await函数 ?异步代码的新方式基于promise实现的异步代码更像同步代码await 只能在async函数中使用，不能再普通函数中使用，要成对出现默认返回一个promise实例await下面的代码是异步，后面的代码是同步的 23.this指向 ?普通函数非严格模式下调用的时候指向于Window,严格模式指向为undefind构造函数调用this指向于实例对象对象方法调用this指向与该方法所属的对象事件绑定方法this指向于绑定事件对象定时器函数this指向于Window自执行函数中的this永远指向window箭头函数没有this，this是指向于外面的一层，如果没有则指向Window 24.?异步回调（如何解决回调地狱）promise、generator、async/await
promise： 1.是一个对象，用来传递异步操作的信息。代表着某个未来才会知道结果的时间，并未这个事件提供统一的api，供进异步处理 2.有了这个对象，就可以让异步操作以同步的操作的流程来表达出来，避免层层嵌套的回调地狱 3.promise代表一个异步状态，有三个状态pending（进行中），Resolve(以完成），Reject（失败） 4.一旦状态改变，就不会在变。任何时候都可以得到结果。从进行中变为以完成或者失败 promise.all() 里面状态都改变，那就会输出，得到一个数组 promise.race() 里面只有一个状态变为rejected或者fulfilled即输出 promis.finally()不管指定不管Promise对象最后状态如何，都会执行的操作（本质上还是then方法的特例）
25.前端事件流 事件捕获事件目标事件冒泡 26.事件如何先冒泡后捕获?在DOM标准事件模型中，是先捕获后冒泡。但是如果要实现先冒泡后捕获的效果， 对于同一个事件，监听捕获和冒泡，分别对应相应的处理函数，监听到捕获事件，先暂缓执行，直到冒泡事件被捕获后再执行捕获事件。
27.?如何判断一个变量是对象还是数组（prototype.toString.call()）千万不要使用typeof来判断对象和数组，因为这种类型都会返回object。
28.cookie、Session和token的区别Token就是令牌，比如你授权（登录）一个程序时，他就是个依据，判断你是否已经授权该软件，Token的状态是存储在客户端。
cookie就是写在客户端的一个txt文件，里面包括你登录信息之类的，这样你下次在登录某个网站，就会自动调用cookie自动登录用户名；
session和cookie差不多，只是Session是写在服务器端的文件，也需要在客户端写入cookie文件，但是文件里是你的浏览器编号。Session的状态是存储在服务器端，客户端只有Session id；
29.JS全局函数 escape( )eval_r( )isFinite( )isNaN( )parseFloat( )parseInt( )unescape( ) ?30.JS内置可迭代对象 ArrayMapSetStringTypedArray函数的 arguments 对象NodeList 对象 31.数组常用的方法常用的方法有14个，6个会改变原数组的方法，8个不会改变原数组的方法
改变原数组的方法：
push() ：尾增 返回新增元素后数组的长度pop() ：尾删 被删除的项shift() ：头删 被删除的项unshift() ：头增 删除元素后数组的长度reverse()：反转 反转后的新数组sort(fun(){}) ：排序 排序后的新数组 参数为一个函数，该函数有两个形参，对应为before和after，可以这个函数中书写排序的方法，返回值为负值时，升序，正值降序，也可以直接写return a＞b 或者return a＜b前者对应降序，后者对应升序不改变原数组的方法：
slice(a,b) ：查找 查找出的值组成的数组 （n,m） 查找下标：[n,m)（n） 查找下标：n到最后一个元素（0） 复制一遍原数组，可用于克隆（-m,-n）从后往前查，-1表示最后一项，-2表示表示倒数第二项 splice(n,x,m) ：增、删、改 对应操作后得到的新数组 （n,x,m）从下标为n的元素开始，删除x个元素，在此位置将m插入（n,0,m）从下标为n开始，不删除元素，直接插入m（n,x）从下标为n开始，删除x个元素 join('-')： 返回用指定分隔符拼接成的字符串concat(arr1, arr2, str3...) ：拼接 拼接后的新数组indexOf(item, star) ： 从star下标开始查找，第一次出现item元素的索引，未找到返回-1lastIndexOf(item, star) ： 最后一次出现的索引includes(item) ： 是否包含指定元素forEach(function(item, index, arr){}) ：遍历 item：遍历的每一项index：索引arr：当前数组 三、Vue ?1.V-model的原理vue数据双向绑定是通过数据劫持结合发布者-订阅者模式的方式来实现的。利用了 Object.defineProperty() 这个方法重新定义了对象获取属性值(get)和设置属性值(set)。
2.谈谈对生命周期的理解 beforeCreate阶段：vue实例的挂载元素el和数据对象data都是undefined，还没有初始化。created阶段：vue实例的数据对象data有了，可以访问里面的数据和方法，未挂载到DOM，el还没有beforeMount阶段：vue实例的el和data都初始化了，但是挂载之前为虚拟的dom节点mounted阶段：vue实例挂载到真实DOM上，就可以通过DOM获取DOM节点beforeUpdate阶段：响应式数据更新时调用，发生在虚拟DOM打补丁之前，适合在更新之前访问现有的DOM，比如手动移除已添加的事件监听器updated阶段：虚拟DOM重新渲染和打补丁之后调用，组成新的DOM已经更新，避免在这个钩子函数中操作数据，防止死循环beforeDestroy阶段：实例销毁前调用，实例还可以用，this能获取到实例，常用于销毁定时器，解绑事件destroyed阶段：实例销毁后调用，调用后所有事件监听器会被移除，所有的子实例都会被销毁 3.?vuex的流程页面通过mapAction异步提交事件到action。action通过commit把对应参数同步提交到mutation。 mutation会修改state中对于的值。 最后通过getter把对应值跑出去，在页面的计算属性中 通过mapGetter来动态获取state中的值
4.vuex有哪几种状态和属性 state中保存着共有数据，数据是响应式的getter可以对state进行计算操作，主要用来过滤一些数据，可以在多组件之间复用mutations定义的方法动态修改state中的数据，通过commit提交方法，方法必须是同步的actions将mutations里面处理数据的方法变成异步的，就是异步操作数据，通store.dispatch来分发actions，把异步的方法写在actions中，通过commit提交mutations，进行修改数据。modules：模块化vuex 5.vue路由的两种模式 hash ——即地址栏URL中的#符号（此hsah 不是密码学里的散列运算） hash 虽然出现URL中，但不会被包含在HTTP请求中，对后端完全没有影响，因此改变hash不会重新加载页面。history ——利用了HTML5 History Interface 中新增的pushState() 和replaceState() 方法这两个方法应用于浏览器的历史记录站，在当前已有的back、forward、go 的基础之上，它们提供了对历史记录进行修改的功能。只是当它们执行修改是，虽然改变了当前的URL，但你浏览器不会立即向后端发送请求。
6.vue中 key 值的作用key是vue中的 vnode标记的唯一id,通过这个key,我们的df算法操作可以更准确,更快速的算出那个dome元素需要修改。如果不加key,那么vue会选择复用节点vue的就地更新策略),导致之前节点的状态被保留下来,会产生一系列的bug
key的作用主要是为了高效的更新虚拟DOM。
7.?$route和$router的区别 $route是“路由信息对象”，包括path，params，hash，query，fullPath，matched，name等路由信息参数。$router是“路由实例”对象包括了路由的跳转方法，钩子函数等。 8.vue-router守卫全局守卫
router.beforeEach 全局前置守卫router.afterEach 全局后置守卫组件守卫
beforeRouteEnterbeforeRouteUpdatebeforeRouteLeave 9.?vue修饰符 stop：阻止事件的冒泡prevent：阻止事件的默认行为once：只触发一次self：只触发自己的事件行为时，才会执行 10.vue项目中的性能优化 不要在模板里面写过多表达式循环调用子组件时添加key频繁切换的使用v-show，不频繁切换的使用v-if尽量少用float，可以用flex按需加载，可以用require或者import()按需加载需要的组件路由懒加载 11.V-if和V-show区别v-if是”真正”的渲染,每次为ture的时候会渲染dome元素出来, v-show页面一初始化的时候就渲染出来,只是根据条件去改变 display的属性,实现显示和隐藏,如果是经常切换的条件不建议使用vⅱ进行条件判断,非常频繁的切换建议,使用 v-show进行判断比较好。?
秋招参考转载：
最新的前端大厂面经（详解答案） - 掘金 (juejin.cn)
转载：
2021年我的前端面试准备 (juejin.cn)
转载：
听说前端面试手写”节流防抖“你不会？用动画带你秒懂！ (juejin.cn)
转载：
前端常考的算法题 (juejin.cn)
[译] 送你 43 道 JavaScript 面试题 - 掘金 (juejin.cn)
 1.本站遵循行业规范，任何转载的稿件都会明确标注作者和来源；2.本站的原创文章，会注明原创字样,如未注明都非原创，如有侵权请联系删除！；3.作者投稿可能会经我们编辑修改或补充；4.本站不提供任何储存功能只提供收集或者投稿人的网盘链接。 |
标签： #前端实习面试题 #rowreverse #column
