有奖征文006期 | 前端 面试那些事儿？

面试那些事，到底有那些事？
俗话说得好，太阳底下无奇事。虽然没有啥新奇的事，但这里我还是想分享一下，我的面试经历，哈哈哈，不多说了，开始干货吧。

虽然前端市场竞争如此激励，但还是要相信自己可以找到工作

要开始技术了，在前端开发技术才是硬道理(不是吹逼才是硬道理吗？)

在 面试之前，建议整理一下自己的知识脉络，梳理自己的前端开发知识点。别紧张，放松心态，因为紧张是常态，比较我们每个人不是天天都在面试，相信自己可以的。

对于面试最常见的问题基本就是css和js，还有就是一些http协议 和框架 、性能问题了，我将我最常听到的问题总结出来。

css部分

• Q. css新特性

    新增各种css选择器;
    圆角 border-radius;
    多列布局;
    阴影和反射;
    文字特效text-shadow;
    线性渐变;
    旋转transform ;
    
    // 伪类
    :after 在元素之前添加内容,也可以用来做清除浮动;
    :before 在元素之后添加内容;
    :enabled;
    :disabled 控制表单控件的禁用状态;
    :checked 单选框或复选框被选中;

• Q. css盒模型

盒模型： 内容(content)、填充(padding)、边界(margin)、 边框(border)；

• Q. css在性能优化方面的实践

css压缩与合并、Gzip压缩;
css文件放在head里、不要用@import;
尽量用缩写、避免用滤镜、合理使用选择器;

• Q. stylus/sass/less区别

均具有“变量”、“混合”、“嵌套”、“继承”、“颜色混合”五大基本特性;
Scss和LESS语法较为严谨，LESS要求一定要使用大括号“{}”，Scss和Stylus可以通过缩进表示层次与嵌套关系;
Scss无全局变量的概念，LESS和Stylus有类似于其它语言的作用域概念;
Sass是基于Ruby语言的，而LESS和Stylus可以基于NodeJS NPM下载相应库后进行编;

• Q. css3动画（简单动画的实现，如旋转等）

依靠CSS3中提出的三个属性：transition、transform、animation
transition：定义了元素在变化过程中是怎么样的，包含transition-property、transition-duration、transition-timing-function、transition-delay。
transform：定义元素的变化结果，包含rotate、scale、skew、translate。
animation：动画定义了动作的每一帧（@keyframes）有什么效果，包括animation-name，animation-duration等；

javascript

• Q. 闭包

闭包的优点是可以避免全局变量的污染，缺点是闭包会常驻内存，
会增大内存使用量，使用不当很容易造成内存泄露。在js中，函数即闭包;
参考:

参考：
闭包

• Q. javascript原型，原型链 ? 有什么特点？
• Q. javascript如何实现继承？
  以上两个问题可以参考以下：
  javascript的继承
  js的原型和原型链
• Q js运行机制和事件循环
  参考：
  js运行机制和事件循环
• Q. Ajax原理

Ajax的原理简单来说是在用户和服务器之间加了—个中间层(AJAX引擎)，
通过XmlHttpRequest对象来向服务器发异步请求，从服务器获得数据，
然后用javascript来操作DOM而更新页面。使用户操作与服务器响应异步化。
这其中最关键的一步就是从服务器获得请求数据

参考:
Ajax请求

• Q. 谈谈你对webpack和gulp的看法

WebPack 是一个模块打包工具，你可以使用WebPack管理你的模块依赖，并编绎输出模块们所需的静态文件。
它能够很好地管理、打包Web开发中所用到的HTML、Javascript、CSS以及各种静态文件（图片、字体等），
让开发过程更加高效。对于不同类型的资源，webpack有对应的模块加载器。
webpack模块打包器会分析模块间的依赖关系，最后 生成了优化且合并后的静态资源
gulp是前端开发过程中一种基于流的代码构建工具，是自动化项目的构建利器；
它不仅能对网站资源进行优化，而且在开发过程中很多重复的任务能够使用正确的工具自动完成.
Gulp的核心概念：流

• Q. 同源策略

同源策略指的是：协议，域名，端口相同，同源策略是一种安全协议

• Q. 说说你对promise的了解
  参考:
  Promise 异步编程
• Q. 谈一谈let与var的区别？
  参考:
  let与var的区别
• Q. 如何解决跨域问题?

jsonp、 iframe、window.name、window.postMessage、服务器上设置代理页面

• Q. Vue的双向绑定数据的原理

vue.js 则是采用数据劫持结合发布者-订阅者模式的方式，
通过Object.defineProperty()来劫持各个属性的setter，getter，
在数据变动时发布消息给订阅者，触发相应的监听回调

对于前端的框架，要么问你源码，要么问你框架中的实际开发问题，和解决问题的方法。基础好，框架上手很快。上面的面试问题是最常见的。

更多前端面试问题， 点这里哦！！！