h5面试题

一.匿名函数实现阶乘
第一种写法：

43 > F = fun(Func, 1) -> 1;
43 > (Func, N) -> N * Func(Func, N - 1) end.
#Fun < erl_eval.12.99386804 >
44 > F(F, 1).
1
45 > F(F, 2).
2
46 > F(F, 5).
120

第二种写法：

52 > F = fun
52 > Fac(1) -> 1;
52 > Fac(N) -> N * Fac(N - 1) end.
#Fun < erl_eval.30.99386804 >
53 > F(5).
120
//--------------------------
function n(x) {
if (x < 2) {
return 1;
} else {
return x * n(x - 1);
}
}
//调用函数
alert(n(10))

二.js类与初始化
var Animate = function (dom) {
this.dom = dom;
this.startTime = 0;
this.startPos = 0;
this.endPos = 0;
this.propertyName = null;
this.easing = null;
this.duration = null;
}
三. let和const的区别
let与const都是只在声明所在的块级作用域内有效。
let声明的变量可以改变,值和类型都可以改变,没有限制.
const声明的变量不得改变值,这意味着,const一旦声明,就必须立即初始化,不能留到以后赋值.

四.优化图片加载的方法
1.懒加载
2.在页面载入的时候将页面上的img标签的src指向一个小图片,把真实地址存放在一个自定义属性中,可以data-src
如果为幻灯片、相册等，可以使用图片预加载技术，将当前展示图片的前一张和后一张优先下载。
预加载，见下一章节
3.　如果图片为css图片，可以使用CSSsprite，SVGsprite，Iconfont、Base64等技术。

4.　如果图片过大，可以使用特殊编码的图片，加载时会先加载一张压缩的特别厉害的缩略图，以提高用户体验。

5.　如果图片展示区域小于图片的真实大小，则因在服务器端根据业务需要先行进行图片压缩，图片压缩后大小与展示一致。

五.html5新特性
1.标签语义化 如:hrader,footer nav section article aside detailes summary dialog
2.增强型表单 如:color date datetime datetime-local email month number range search tel time url week
3.视频和音屏 如:audio video
4.Canvas绘图 如:Canvas - 图形 Canvas - 路径 Canvas - 文本 Canvas - 渐变 Canvas - 图像 SVG 与 Canvas两者间的区别:
SVG 是一种使用 XML 描述 2D 图形的语言。Canvas 通过 JavaScript 来绘制 2D 图形。SVG 基于 XML，这意味着 SVG DOM 中的每个元素都是可用的。您可以为某个元素附加 JavaScript 事件处理器。
在 SVG 中，每个被绘制的图形均被视为对象。如果 SVG 对象的属性发生变化，那么浏览器能够自动重现图形。Canvas 是逐像素进行渲染的。在 canvas 中，一旦图形被绘制完成，它就不会继续得到浏览器的关注。
如果其位置发生变化，那么整个场景也需要重新绘制，包括任何或许已被图形覆盖的对象.

六.浏览器缓存

一、http缓存
1.http缓存是基于HTTP协议的浏览器文件级缓存机制。
即针对文件的重复请求情况下，浏览器可以根据协议头判断从服务器端请求文件还是从本地读取文件，
chrome控制台下的Frames即展示的是浏览器的http文件级缓存
2.websql
websql这种方式只有较新的chrome浏览器支持，并以一个独立规范形式出现，主要有以下特点
Web Sql 数据库API 实际上不是HTML5规范的组成部分；
在HTML5之前就已经存在了，是单独的规范；
它是将数据以数据库的形式存储在客户端，根据需求去读取；
跟Storage的区别是： Storage和Cookie都是以键值对的形式存在的；
3.openDatabase方法可以打开已经存在的数据库，不存在则创建
var db = openDatabase('mydatabase', '2.0', my db', 2 * 1024);
openDatabasek中五个参数分别为：数据库名、版本号、描述、数据库大小
创建回调。创建回调没有也可以创建数据库。
4.indexDB
IndexedDB 是一个为了能够在客户端存储可观数量的结构化数据，
并且在这些数据上使用索引进行高性能检索的 API。
虽然 DOM 存储 对于存储少量数据是非常有用的，
但是它对大量结构化数据的存储就显得力不从心了。
IndexedDB 则提供了这样的一个解决方案。
IndexedDB 分别为同步和异步访问提供了单独的 API 。
同步 API 本来是要用于仅供 Web Workers 内部使用，
但是还没有被任何浏览器所实现。异步 API 在 Web Workers 内部和外部都可以使用，
另外浏览器可能对indexDB有50M大小的限制，
一般用户保存大量用户数据并要求数据之间有搜索需要的场景。
5.cookie
Cookie（或者Cookies），指一般网站为了辨别用户身份、
进行session跟踪而储存在用户本地终端上的数据（通常经过加密）。
cookie一般通过http请求中在头部一起发送到服务器端。
一条cookie记录主要由键、值、域、过期时间、大小组成，一般用户保存用户的认证信息。
支持域名个数:
IE7以上
50个
4095B

Firefox
50个
4097B

Opera
30个
4096B

Safari/WebKit
无限制
4097B

6.localstorage
localStorage是html5的一种新的本地缓存方案，
目前用的比较多，一般用来存储ajax返回的数据，加快下次页面打开时的渲染速度。

7.sessionstorage
sessionStorage和localstorage类似，
但是浏览器关闭则会全部删除，api和localstorage相同，实际项目中使用较少。

8.application cache
application cahce是将大部分图片资源、js、css等静态资源放在manifest文件配置中。
当页面打开时通过manifest文件来读取本地文件或是请求服务器文件。
离线访问对基于网络的应用而言越来越重要。
虽然所有浏览器都有缓存机制，但它们并不可靠，
也不一定总能起到预期的作用。HTML5 使用ApplicationCache
接口可以解决由离线带来的部分难题。前提是你需要访问的web页面至少被在线访问过一次。
使用缓存接口可为您的应用带来以下三个优势：
离线浏览 – 用户可在离线时浏览您的完整网站
速度 – 缓存资源为本地资源，因此加载速度较快。
服务器负载更少 – 浏览器只会从发生了更改的服务器下载资源。

9. flash缓存
这种方式基本不用，
这一方法主要基于flash有读写浏览器端本地目录的功能，
同时也可以向js提供调用的api，
则页面可以通过js调用flash去读写特定的磁盘目录，达到本地数据缓存的目的。

七.服务器主动推送信息到客户端方式
1.Ajax轮询所谓的Ajax轮询，其实就是定时的通过Ajax查询服务端，
客户端按规定时间定时像服务端发送ajax请求，
服务器接到请求后马上返回响应信息并关闭连接。
这种技术方式实现起来非常简单，
但是这种方式会有非常严重的问题，
就是需要不断的向服务器发送消息询问，
这种方式会对服务器造成极大的性能浪费。

2.Comet Comet，基于 HTTP 长连接的 "服务器推" 技术，
能使服务器端主动以异步的方式向客户端程序推送数据，
而不需要客户端显式的发出请求，目前有两种实现方式：

1. 基于 AJAX 的长轮询（long-polling）方式
2.基于 Iframe 及 htmlfile 的流（streaming）方式
iframe 是很早就存在的一种 HTML 标记， 通过在 HTML 页面里嵌入一个隐蔵帧，
然后将这个隐蔵帧的 SRC 属性设为对一个长连接的请求，
服务器端就能源源不断地往客户端输入数据。
Comet实现框架:
CometD 目前实现 Comet 比较成熟， DWR 弱一些。
ICEfaces 更商业化，实现得很成熟。
Grizzly 是基于GlassFish ，也很成熟。CometD, DWR 开源性好。

3.websocket方式
WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。
WebSocket通讯协议于2011年被IETF定为标准RFC 6455，WebSocketAPI被W3C定为标准。
在WebSocket API中，浏览器和服务器只需要做一个握手的动作，
然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。

八.git工作流程

1.分布式工作流程
同传统的集中式版本控制系统（CVCS）不同，
Git 的分布式特性使得开发者间的协作变得更加灵活多样。
在集中式系统中，每个开发者就像是连接在集线器上的节点，
彼此的工作方式大体相像。
而在 Git 中，每个开发者同时扮演着节点和集线器的角色——也就是说，
每个开发者既可以将自己的代码贡献到其他的仓库中，同时也能维护自己的公开仓库，
让其他人可以在其基础上工作并贡献代码。
由此，Git 的分布式协作可以为你的项目和团队衍生出种种不同的工作流程，
接下来的章节会介绍几种利用了 Git 的这种灵活性的常见应用方式。
我们将讨论每种方式的优点以及可能的缺点；你可以选择使用其中的某一种，
或者将它们的特性混合搭配使用。

2.集中式工作流
集中式系统中通常使用的是单点协作模型——集中式工作流。
一个中心集线器，或者说仓库，可以接受代码，
所有人将自己的工作与之同步。 若干个开发者则作为节点——也就是中心仓库的消费者——并且与其进行同步。
集成管理者工作流:
(1).项目维护者推送到主仓库。

(2).贡献者克隆此仓库，做出修改。

(3).贡献者将数据推送到自己的公开仓库。

(4).贡献者给维护者发送邮件，请求拉取自己的更新。

(5).维护者在自己本地的仓库中，将贡献者的仓库加为远程仓库并合并修改。

(6).维护者将合并后的修改推送到主仓库。

3.司令官与副官工作流
这其实是多仓库工作流程的变种。
一般拥有数百位协作开发者的超大型项目才会用到这样的工作方式，例如著名的 Linux 内核项目。
被称为副官（lieutenant）的各个集成管理者分别负责集成项目中的特定部分。
所有这些副官头上还有一位称为司令官（dictator）的总集成管理者负责统筹。 司令官维护的仓库作为参考仓库，
为所有协作者提供他们需要拉取的项目代码。 整个流程看起来是这样的(见 司令官与副官工作流。):
(1).普通开发者在自己的特性分支上工作，并根据 master 分支进行变基。 这里是司令官的`master`分支。

(2).副官将普通开发者的特性分支合并到自己的 master 分支中。

(3).司令官将所有副官的 master 分支并入自己的 master 分支中。

(4).司令官将集成后的 master 分支推送到参考仓库中，以便所有其他开发者以此为基础进行变基。
Figure 56. 司令官与副官工作流。
这种工作流程并不常用，只有当项目极为庞杂，或者需要多级别管理时，
才会体现出优势。 利用这种方式，项目总负责人（即司令官）可以把大量分散的集成工作委托给不同的小组负责人分别处理，
然后在不同时刻将大块的代码子集统筹起来，用于之后的整合