JavaScript 的面向对象
1. JS 模块包装格式都用过哪些，CommonJS、AMD、CMD。定义一个JS 模块代码，最精简的格式是怎样。
CommonJS
2. JS 怎么实现一个类。怎么实例化这个类。
var Clazz = function(){
this.name = 'javascript';
this.type = 'computer';
}
var clazz = new Clazz;
clazz.name;
clazz.type;
3. 理解闭包吗?请讲一讲闭包在实际开发中的作用;闭包建议频繁使用吗?
闭包的优点：保护函数内的变量安全,加强了封装性，变量可以一直存储在内存中。
4. 说一下了解的js 设计模式，解释一下单例、工厂、观察者。
单例：任意对象都会单例，不需要特别处理；（单例模式中的单件确保类有且仅有一个）；
工厂：同样形式参数返回不同的实例；
代理：新建类调用老类的接口，包一下；
观察者：就是事件模式比如按钮事件；
发布者，订阅者：发布一个对象/字符串到所有订阅者；
5. ajax 跨域有哪些方法，jsonp 的原理是什么，如果页面编码和被请求的资源编码不一致如何处理?
在请求响应头增加指定字段，告诉浏览器允许调用
jsonp 同源策略
「 开源工具 」
1)是否了解开源的架构工具 bower、npm、yeoman、gulp、webpack，有无用过，有无写过，一个 npm 的包里的 package.json 具备的必要的字段都有哪些(名称、版本号，依赖)
{
"name": "",
"description": "",
"version": "4.17.1",
"license": "MIT",
"repository": "",
"keywords": [],
"dependencies": {
}
}
2)github常用不常用，关注过哪些项目
3)会不会用 ps 扣图，png、jpg、gif 这些图片格式解释一下，分别什么时候用。如何优化图像、图像格式的区别
a.gif图形交换格式，索引颜色格式，颜色少的情况下，产生的文件极小，支持背景透明，动画，图形渐进，无损压缩（适合线条，图标等），缺点只有256种颜色
b.jpg支持上百万种颜色，有损压缩，压缩比可达180：1，而且质量受损不明显，不支持图形渐进与背景透明，不支持动画
c.png为替代gif产生的，位图文件，支持透明，半透明，不透明。不支持动画，无损图像格式。Png8简单说是静态gif，也只有256色，png24不透明，但不止256色。
4)说一下你常用的命令行工具
git
5)会不会用git，说上来几个命令，说一下git和svn的区别，有没有用git解决过冲突
git branch
「 计算机网络基础 」
1)说一下HTTP 协议头字段说上来几个，是否尽可能详细的掌握HTTP协议。一次完整的HTTP事务是怎样的一个过程?
Cache-control、Cookie （Response Headers：Content-type）
域名解析 --> 发起TCP的3次握手 --> 建立TCP连接后发起http请求 --> 服务器响应http请求，浏览器得到html代码 --> 浏览器解析html代码，并请求html代码中的资源（如js、css、图片等） --> 浏览器对页面进行渲染呈现给用户
2)cookies 是干嘛的，服务器和浏览器之间的 cookies 是怎么传的，httponly 的 cookies 和可读写的 cookie 有什么区别，有无长度限制
请描述一下cookies，sessionStorage和localStorage的区别
a、它是一个数据包，每次访问网站的时候浏览器都会将该网站的Cookie发回给网站服务器，同时网站也可以随意更改你机器上对应的Cookie。Cookie不是只有一个，而是一个网站一个，所以把它比喻成网络身份证的说法是不准确的。它不是你在网络中的唯一标识，只是你在某个网站的唯一标识。
b、cookie在网站建设中是比较常用的，你知道它是怎么实现自动登录，记录使用过的模板，记录用户上次操作状态的吗？持久cookie将内容保存在你的电脑硬盘中，下次访问，浏览器查找cookie，把cookie通过HTTP Request 中的“Cookie: header”发送给web服务器，Web服务器通过HTTP Response中的"Set-Cookie: header"把cookie发送给浏览器，从而实现了自动登录。
3)从敲入 URL 到渲染完成的整个过程，包括 DOM 构建的过程，说的约详细越好。
整个过程大致如下：
1. 输入URL，浏览器根据域名寻找IP地址
2. 浏览器发送一个HTTP请求给服务器，如果服务器返回以301之类的重定向，浏览器根据相应头中的location再次发送请求
3. 服务器接受请求，处理请求生成html代码，返回给浏览器，这时的html页面代码可能是经过压缩的
4. 浏览器接收服务器响应结果，如果有压缩则首先进行解压处理
5. 浏览器开始显示HTML
6. 浏览器发送请求，以获取嵌入在HTML中的对象。在浏览器显示HTML时，它会注意到需要获取其他地址内容的标签。这时，浏览器会发送一个获取请求来重新获得这些文件——包括CSS/JS/图片等资源，这些资源的地址都要经历一个和HTML读取类似的过程。所以浏览器会在DNS中查找这些域名，发送请求，重定向等
浏览器渲染引擎在获取到内容后的基本流程：
1. 解析HTML
2. 构建DOM树
3. DOM树与CSS样式进行附着构造呈现树
4. 布局
5. 绘制
4)是否了解Web注入攻击，说下原理，最常见的两种攻击(XSS 和 CSRF)了解到什么程度。
CSRF（Cross-site request forgery）：跨站请求伪造。
（1）登录受信任网站A，并在本地生成Cookie。（如果用户没有登录网站A，那么网站B在诱导的时候，请求网站A的api接口时，会提示你登录）
（2）在不登出A的情况下，访问危险网站B（其实是利用了网站A的漏洞）。
方法一、Token 验证：（用的最多）
（1）服务器发送给客户端一个token；
（2）客户端提交的表单中带着这个token。
（3）如果这个 token 不合法，那么服务器拒绝这个请求。
方法二：隐藏令牌：
把 token 隐藏在 http 的 head头中。
方法二和方法一有点像，本质上没有太大区别，只是使用方式上有区别。
方法三、Referer 验证：
Referer 指的是页面请求来源。意思是，只接受本站的请求，服务器才做响应；如果不是，就拦截
XSS（Cross Site Scripting）：跨域脚本攻击
XSS的攻击方式
1、反射型
发出请求时，XSS代码出现在url中，作为输入提交到服务器端，服务器端解析后响应，XSS代码随响应内容一起传回给浏览器，最后浏览器解析执行XSS代码。这个过程像一次反射，所以叫反射型XSS。
2、存储型存
储型XSS和反射型XSS的差别在于，提交的代码会存储在服务器端（数据库、内存、文件系统等），下次请求时目标页面时不用再提交XSS代码。
XSS的防范措施（encode + 过滤）
XSS的防范措施主要有三个：
1、编码：
对用户输入的数据进行
HTML Entity 编码。
如上图所示，把字符转换成 转义字符。
Encode的作用是将
$var
等一些字符进行转化，使得浏览器在最终输出结果上是一样的。
比如说这段代码：
若不进行任何处理，则浏览器会执行alert的js操作，实现XSS注入。
进行编码处理之后，L在浏览器中的显示结果就是
，实现了将$var作为纯文本进行输出，且不引起JavaScript的执行。
2、过滤：
移除用户输入的和事件相关的属性。如onerror可以自动触发攻击，还有onclick等。（总而言是，过滤掉一些不安全的内容）移除用户输入的Style节点、Script节点、Iframe节点。（尤其是Script节点，它可是支持跨域的呀，一定要移除）。
3、校正
避免直接对HTML Entity进行解码。使用DOM Parse转换，校正不配对的DOM标签。备注：我们应该去了解一下
DOM Parse
这个概念，它的作用是把文本解析成DOM结构。
比较常用的做法是，通过第一步的编码转成文本，然后第三步转成DOM对象，然后经过第二步的过滤。
还有一种简洁的答案：
首先是encode，如果是富文本，就白名单。
CSRF 和 XSS 的区别
区别一：
CSRF：需要用户先登录网站A，获取 cookie。XSS：不需要登录。
区别二：（原理的区别）
CSRF：是利用网站A本身的漏洞，去请求网站A的api。XSS：是向网站 A 注入 JS代码，然后执行 JS 里的代码，篡改网站A的内容。
5)是否了解公钥加密和私钥加密。如何确保表单提交里的密码字段不被泄露。验证码是干嘛的，是为了解决什么安全问题。
1. 一般情况下，私钥用于对数据进行签名
2. 一般情况下，公钥用于对签名进行验证
3. HTTP网站在浏览器端使用公钥加密敏感数据，然后再服务器端使用私钥解密
验证码是干嘛的?
1. 区分用户是计算机还是人的公共全自动程序。可以防止恶意破解密码、刷票、论坛灌水
2. 有效防止黑客对某一个特定注册用户用特定程序暴力破解方式进行不断的登陆尝试
6)编码常识：文件编码、URL 编码、Unicode编码 什么含义。一个gbk编码的页面如何正确引
url编码:url编码是一种浏览器用来打包表单输入的格式 escape()，encodeURI() 和encodeURIComponent() 编码函数
Unicode 编码共有三种具体实现，分别为utf-8,utf-16,utf-32，其中utf-8占用一到四个字节，utf-16占用二或四个字节，utf-32占用四个字节
「 前端框架 」
-
对 MVC、MVVM的理解
-
vue、angularjs等 相对于 jQuery在开发上有什么优点?
3)前后分离的思想了解吗?
4)你上一个项目都用到了那些方法优化js的性能?
避免全局查找
不应该使用setTimeout，而应该是用setInterval
5)angular 、 vue 的生命周期?
6)说一下你对vue和vuex的使用方法，vue的组件复用机制
考察学习能力和方法
1)你每天必须登录的网站(前端技术相关)是什么?
vue、csdn
2)前端技术方面看过哪些书，有无笔记，都有哪些收获。
3)收藏了哪些代码片段?有想过开源自己的代码嘛?
4)怎么理解前端技术的大趋势?自己再做哪方面的知识储备?
5)是否了解或精通其他(后端)的编程语言?
6)做项目有没有遇到哪些印象深刻的技术攻关，具体遇到什么问题，怎么找答案的，最后怎么解的。
7)对以后自己的前端职业路线，怎么规划？
开放性问题(重要)
这些问题往往决定你是否最终被录用或者等到终轮面试，技术点回答错了不要紧，人脑不是机器，是可以恶补的。
但如果你没有思想和独到的思路，基础挖的再深，可能也打动不了面试官，因为比你基础好的一大堆，但每个人的个性思想却是不同的。
1. 如果需要你加班，你会加吗，抵触吗?
其实你肯定抵触，但你肯定要回答如果项目需要肯定会加。
2. 一个小项目让你自己负责搭建底层一些架构，你能胜任吗?
回答例如：我肯定愿意尝试，并做到最优的选择方案出来。
3. 如果项目拖太久，你情绪低落或者厌烦了怎么调节?
回答就是， 你结合自身挑着好听的说就行，就像聊天。
4. 你建议自己造轮子，还是利用开源的轮子?
回答：根据实际情况而定，如果开源完全满足 可以自己二次开发就好，大大缩短开发周期，
如果实在没有契合度很高的，可以花费几个工作日尝试造轮。
