前端面试，肯定是少不了笔试题，果然，今天去面试就遇到的笔试题，慌了一批。回来赶紧整理了一下
一、 css3的常用的新特性？flex布局和传统布局有什么区别？
css3的新特性那就多啦，简单的列举了几个：
- 过渡 transition: CSS属性，花费时间，效果曲线(默认ease)，延迟时间(默认0)
- 动画 animation：动画名称，一个周期花费时间，运动曲线（默认ease），动画延迟（默认0），播放次数（默认1），是否反向播放动画（默认normal），是否暂停动画（默认running）
- transform:适用于2D或3D转换的元素
+ transform-origin：转换元素的位置（围绕那个点进行转换）。默认(x,y,z)：(50%,50%,0)
+ transform:rotate(30deg);
+ transform:translate(30px,30px);
+ transform:scale(.8);
+ transform: skew(10deg,10deg); - 选择器
- 元素选择器，属性选择器， - 阴影
- box-shadow 盒子阴影
- text-shadow 文字阴影 - 边框圆角 border-radius
- 弹性布局 flex
- 盒子模型 box-sizing
- 媒体查询 @media
- 超出省略号
- 单行
- overflow:hidden;
- white-space:nowrap;
- text-overflow:ellipsis;
- 多行
- overflow:hidden;
- text-overflow:ellipsis;
- display:-webkit-box;
- -webkit-line-clamp:2;
- -webkit-box-orient: vertical
- 单行
Flex布局跟传统布局的区别：
传统的布局方案，基于css盒子模型，float+display+position，TA对于很多特殊布局方案就非常不方便，必须垂直居中
Flex 是 Flexible Box 的缩写，意为”弹性布局”，用来为盒状模型提供最大的灵活性。任何元素都可以设置为flex
说说你所知道的UI框架和js框架；你比较熟悉使用哪些框架
UI框架的那就很多啦
- MUI
- AUI
- Mint-UI
- layui
- VUX – VUE移动端UI组件库
- Vant – Vue UI组件库
- Element-Ui VueUI组件库
- iview - vueUI组件库
js框架也很多，不过我就写了前端三大流行框架
- vue.js
- react.js
- angular.js
比较熟悉的话，因为我之前都是在使用vue.js，所以对它周边的UI框架还算熟悉，其实也没啥，开发看着官方文档，杠杠的 - 比较熟悉 vue.js MUI Mint-Ui Element-Ui iview
ES6有哪些常用的新特性
es6的话，在用vue开发中，经常用到，不过我还没来得及去深入了解，懂得的大概都是皮毛
- let const 变量声明
- 模板字面量 ${}
- 解构赋值 从数组和对象提取并赋值给独特的变量
- 展开运算符 …
- 箭头函数
- Iterable类型 (map() Array() Set() )
- 函数的参数默认值
- promise
- modules模块 ( import export )
说真的，es6真是好东西，所以你懂的，赶紧去学，面试必问
什么是跨域？跨域请求资源的方法有哪些？
其实我就纳闷了，每次面试，都会问到跨域的问题....
跨域：由于浏览器同源策略，凡是发送请求url的协议、域名、端口三者之间任意一个与当前页面路径不同即为跨域
方法：
- Proxy代理
用法： proxy 代理用于将请求发给后台服务器，通过服务器来发送请求，然后将请求的结果传递前端 - CORS [ Cross-Origin Resource Sharing ]
需要后端人员在处理请求数据的时候，添加允许跨域的相关操作 - Jsonp
通过动态插入一个script标签。浏览器对script的资源引用没有同源限制，同时资源加载到页面后悔立即执行
我就简单写了三种，后来技术面我的时候，直接问我怎么解决。。。
什么是闭包？闭包有什么作用？可举例说明
闭包就是能够读取其他函数内部变量的函数。由于在`javascript`语言中，只有函数内部的子函数才能读取局部变量，因此可以吧闭包简单理解为“定义在一个函数内部的函数”。所以本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。
用处：
- 可以读取函数内部的变量；
- 让这些变量的值始终保持在内存中。
注意点： - 由于闭包会使得函数中的变量都被保存在内存中，内存消耗很大，所以不能滥用闭包，否则会造成网页性能问题，在IE中可能导致内存泄漏。解决方法，在退出函数之前，将不使用的局部变量全部删除
- 闭包会在父函数外部，改变父函数内部变量的值。所以，如果你把父函数当作对象使用，把闭包当作公用方法，把内部变量当作私有属性，这是一定要小心，不要随便改变父函数内部的变量的值。
例子
Function outerFun () {
var a = 0
function innerFun () {
a++
alert(a)
}
}
innerFun ()
function outerFun () {
var a = 0
alert(a)
}
var a = 4
outerFun ()
alert(a)
谈谈性能优化问题？
代码层面的优化
- 少用全局变量
- 用innerHTML代替DOM操作，减少DOM操作次数，优化javascript性能
- 多个变量声明合并
- 尽量避免写在HTML标签中写style属性
移动端性能优化
- 尽量使用css3动画，开启硬件加速、
- 适当使用touch事件代替click事件
- 避免使用css3渐变阴影效果
- 不要滥用float。Float在渲染时计算量比较大，尽量减少使用
- 不要滥用web字体。Web字体需要下载，解析，重绘当前页面，尽量减少使用
- CSS中的属性（css3 transition transform opacity canvas video）会触发GPU渲染，请合理使用。过渡使用会引起手机耗电增加
Web前端开发性能优化 - 减少HTTP请求
- 减少Dom元素数量
- 使得Ajax可缓存
针对HTML
- 语义化HTML
- 减少DOM节点；加速页面渲染
- 给图片加上正确的宽高值，可减少页面重绘，同时防止图片缩放
- 防止src属性和link的href属性为空。当值为空时，浏览器很可能会把当前页面当成其属性值加载
- 正确的闭合标签
- 链接为目录或首页地址后面加 / 如 http://5icool.org/
- 用link而不用@import方式导入样式
- 样式放页头，js放在页尾
- 缩小favicon.ico并缓存
针对CSS
- 把CSS放在代码页上端
- 从页面剥离javascript与CSS
- 精简javascript与CSS，能简写就简写
- 避免CSS表达式
- 通过CSSSprite把同类图片合成一张，减少图片请求
- 减少查询层级如.header .logo要好过.header .top .logo
- 减少查询范围如.header>li要好过.header li；
- 避免TAG标签与CLASS或ID并存 如a.top、button#submit；
- 删除重复的CSS
针对javascript
- 脚本放到HTML代码页底部
- 尽量少用全局变量
- 使用事件代理绑定事件
- 避免频繁操作DOM节点
针对服务器
- 尽量合并CSS、JS文件，或将其直接写在页面上，减少HTTP请求
- 压缩CSS、JS文件，所短文件传输时间
- 避免404错误
- 使用CDN加速，使用户从离自己最近的服务器下载文件
- 减少cookie的大小，使用·无cookie的域，客户端请求静态文件的时候，减少cookie的反复传输对主域名的影响
- 为无文件头指定Expires，使内容具体缓存性
- 使用gzip压缩内容
针对图片
- 不用图片，尽量用css3代替
- 使用矢量图SVG替代位图
- 使用字体图标
Cookie和session的区别；登录信息保存在哪里？
Session的中文翻译是“回话”，当用户打开某个web应用时，便与web服务器产生一次session。服务器使用session把用户的信息临时保存在服务器上，用户离开网站后session会销毁。这种用户信息存储方式相对cookie来说更安全，可是session的缺陷：如果web服务器做了负载均衡，那么下一个操作请求到另一台服务器的时候session会丢失。
Cookie是保存在本地终端的数据。Cookie有服务器生成，发送到浏览器，浏览器把cookie以kv形式保存到某一个目录下的文本文件内，下一次请求同一网站时会把该cookie发送给服务器。由于从cookie是存在客户端上的，所以浏览器加入了一些限制确保cookie不会被恶意使用，同时不会占据太多磁盘空间，所以每一个域的cookie数量是有限的。
Session和cookie的区别
1.Cookie数据存放在用户的浏览器上，session数据放在服务器上
2.Cookie不是很安全，别人可以分析存放在本地的cookie并进行cookie欺骗，考虑到安全应当使用session
3.Session会在一定时间内保存在服务器上。当访问增多，会比较占用服务器的性能，考虑到减轻服务器性能当面，应当使用cookie
4.单个cookie保存的数据不能超过4k，很多浏览器都限制一个站点最多保存20个cookie
所以将登录信息等重要的信息存放在session，将其他信息如果需要保留，可以放在cookie中。
好了，就这么多了，不知道写啥了，就这样吧。
第一次写，见谅，哈哈哈哈哈哈哈哈哈哈哈哈。