前端面试问题汇总
1、js闭包
闭包是一种特殊的对象。
它有两部分组成--执行上下文，以及在该执行上下文中创建的函数。当函数执行时，如果访问了执行上下文中变量对象的值，那么闭包就会产生。
function foo(){
var a = 20;
var b = 30;
function(){
return a+b;
}
bar();
}
foo();2、JSON
什么是JSON
- JSON：JavaScript 对象表示法（JavaScript Object Notation）。
- JSON 是存储和交换文本信息的语法。类似 XML。
- JSON 比 XML 更小、更快，更易解析。
JSON - 转换为 JavaScript 对象
JavaScript 程序能够使用内建的 eval() 函数，用 JSON 数据来生成原生的 JavaScript 对象。
SRE实战 互联网时代守护先锋，助力企业售后服务体系运筹帷幄！一键直达领取阿里云限量特价优惠。实例
<html>
<body>
<h2>在 JavaScript 中创建 JSON 对象</h2>
<p>
Name: <span id="jname"></span><br />
Age: <span id="jage"></span><br />
Address: <span id="jstreet"></span><br />
Phone: <span id="jphone"></span><br />
</p>
<script type="text/javascript">
var JSONObject= {
"name":"Bill Gates",
"street":"Fifth Avenue New York 666",
"age":56,
"phone":"555 1234567"};
document.getElementById("jname").innerHTML=JSONObject.name
document.getElementById("jage").innerHTML=JSONObject.age
document.getElementById("jstreet").innerHTML=JSONObject.street
document.getElementById("jphone").innerHTML=JSONObject.phone
</script>
</body>
</html>3、浅克隆和深克隆
- 浅克隆：原始类型为值传递，对象类型仍为引用传递。
- 深克隆：所有元素或属性均完全复制，与原对象完全脱离，也就是说所有对于新对象的修改都不会反映到原对象中。
4、CSS3、svg、canvas
什么是svg
SVG 意为可缩放矢量图形（Scalable Vector Graphics）。
SVG 使用 XML 格式定义图像。
svg、CSS3、canvas
- svg可以当作xml，可以放大缩小，像html一样操作
- CSS3在DOM节点多的情况下效率严重下降。
- CSS3的旋转比canvas（2d）要好。
- CSS3的文字渲染比canvas好。
- canvas可以在更底层操作。
- canvas支持webgl，可秒杀一切。
- canvas（2d）兼容性还不错。
- webgl（3D绘图协议）兼容性坑爹，移动平台支持不好。
- 网页效果请用CSS3；应用、游戏、图表用canvas；如果你觉得展示数据的时候css3不够自由，canvas太麻烦可以用svg。
5、位图（标量图）和矢量图
- 矢量图使用线段和曲线描述图像,所以称为矢量,同时图形也包含了色彩和位置信息。 色彩不丰富。SVG。占用的空间会很小。
- 位图 即标量图，使用像素点来描述图像，也称为点阵图像。色彩比较丰富。.bmp、.pcx、.gif、.jpg、.tif、.png、photoshop的 .psd等。图像越清晰，占用空间越大。
6、浏览器内核及其在CSS中的写法
- IE浏览器内核: Trident内核
- Firefox（火狐）浏览器内核： Gecko内核
- Chrome（谷歌）浏览器内核： 2013年前是Webkit内核，后面使用Blink内核;
- Safari（苹果）浏览器内核：Webkit内核；
Opera浏览器：先是Presto内核，后来是Webkit内核，后面使用Blink内核
- -moz-：代表FireFox浏览器私有属性
- -ms-：代表IE浏览器私有属性
- -webkit-：代表safari、chrome浏览器私有属性
- -o-：代表opera浏览器私有属性
7、列和栈有什么区别
栈
- 栈是一种重要的线性结构，其特殊性在于限定插入和删除数据元素的操作只能在线性表的一端进行。（后进先出）
- 栈的元素必须“后进先出”。
- 栈的操作只能在这个线性表的表尾进行。
- 注：对于栈来说，这个表尾称为栈的栈顶（top），相应的表头称为栈底（bottom）。
- 因为栈的本质是一个线性表，线性表有两种存储形式，那么栈也有分为栈的顺序存储结构（顺序栈）和栈的链式存储结构（链式栈）。
列
- 队列也是一种线性表。它允许在表的一端插入数据，在另一端删除元素。插入元素的这一端称之为队尾。删除元素的这一端我们称之为队首。
队列的特性： - 在队尾插入元素，在队首删除元素。
FIFO（先进先出），就向排队取票一样。
8、数组和链表有什么区别
数组特点
优点- 随机读取效率很高。
查找速度快
缺点
- 内存空间要求高，必须有足够的连续内存空间。（在内存中，数组是一块连续的区域。知道每一个数据的内存地址，可以直接找到给地址的数据。）
- 浪费内存空间。（数组需要预留空间，在使用前要先申请占内存的大小，可能会）
- 插入数据和删除数据效率低（插入数据时，这个位置后面的数据在内存中都要向后移。删除数据时，这个数据后面的数据都要往前移动。 ）
- 数组大小固定，不能动态拓展
链表特点
优点
- 内存利用率高，不会浪费内存。（在内存中可以存在任何地方，不要求连续。）
- 每一个数据都保存了下一个数据的内存地址，通过这个地址找到下一个数据。
- 插入删除速度快
- 不指定大小，扩展方便。（链表大小不用定义，数据随意增删。）
缺点
- 不能随机查找，必须从第一个开始遍历，查找效率低
9、MVP和MVC模型
MVC（Module View controller）模型
它是一种设计模式。所谓的设计模式其实是一种框架结构的体呈现,目的分离应用程序的页面展示，网络数据交互，数据呈现
- Module，模型层，用户数据管理，通常是一些 javaBean, db,sharePreference,network,图片处理等耗时操作均应该放在该层。
- View，视图层，展现给用户的视图，是应用程序最外层的壳，比如 xml 布局，drawable 显示
- controller 控制层，也叫中间层。一般指的是在四大组，接收 View 层的指令，处理相关指令，并对处理后的指令进去进一步操作，下发指令到Module层。
MVC模型逻辑
以点击某个按钮为例，当用户在 View 布局上发生事件交互的时候，View 层会下发指令到 control 层，control监听到事件交互，并进行处理，接着 control 下发指令到 Module 层，Module 层进行数据更新后，把数据直接显示在View上面。
优点
- 可维护性高，结构清晰明了，利于后期维护
- 重用性高，比如多个 View 视图可以共同依赖同一个Module 层
- 利于项目工程化管理 由于每个层各司其职，每一个层具有鲜明的特征
缺点
- View 层与Module 层相互耦合，不利于后期的维护
- View 对 Module 访问低效率
MVP（Module View Presenter ）模型
- Module，模型层，用户数据管理，通常是一些 javaBean, db,sharePreference,network,图片处理等耗时操作均应该放在该层。
- View，视图层,一般指的是四大组件，四大组件对作为View，来完成应用程序界面的展示
- Presenter 控制层，也叫中间层。相当于一个中间桥梁的作用，用于解决View 层与 Module 层的耦合，一般一个 Presenter 可以对应多个 View，一个Presenter 也可以对应多个Module
MVP模型逻辑
从图中我们可以了解到 View 与 Module 已经完全没有联系了，所有的操作均是在 Presenter 中操作的，Presenter 成了中间桥梁。于操作view层发出的事件传递到presenter层中，presenter 层去操作model 层，并且将数据返回给 view 层，整个过程中 view 层和 model 层完全没有联系。一般在设计View 与 Presenter 的时候会采用接口的形式，来降低 Presenter 与 View 的耦合。
优点
- 降低View 与 Module 的耦合
- 使View 层更加的饱满
- 一个Presenter 可以对应多个 View
- 便与测试，可以脱离用户接口来测试某些逻辑。
缺点
- Presenter 层会存在引用View 层的东西出现空指针的问题
更多精彩
