web面试题大全 - wangwen896(4)_H5之家 - 中国HTML5教程资源分享第一站

HTML5新增应用程序缓存，允许web应用将应用程序自身保存到用户浏览器中，用户离线状态也能访问。 1.为html元素设置manifest属性:<html manifest="myapp.appcache">，其中后缀名只是一个约定，真正识别方式是通过text/cache-manifest作为MIME类型。所以需要配置服务器保证设置正确 2.manifest文件首行为CACHE MANIFEST，其余就是要缓存的URL列表，每个一行，相对路径都相对于manifest文件的url。注释以#开头 3.url分为三种类型：CACHE:为默认类型。NETWORK：表示资源从不缓存。 FALLBACK:每行包含两个url，第二个URL是指需要加载和存储在缓存中的资源，第一个URL是一个前缀。任何匹配该前缀的URL都不会缓存，如果从网络中载入这样的URL失败的话，就会用第二个URL指定的缓存资源来替代。以下是一个文件例子：

CACHE MANIFEST CACHE: myapp.html myapp.css myapp.js FALLBACK: videos/ offline_help.html NETWORK: cgi/ 客户端存储localStorage和sessionStorage localStorage.setItem('x', 1); // storge x->1 localStorage.getItem('x); // return value of x // 枚举所有存储的键值对 for (var i = 0, len = localStorage.length; i < len; ++i ) { var name = localStorage.key(i); var value = localStorage.getItem(name); } localStorage.removeItem('x'); // remove x localStorage.clear(); // remove all data cookie及其操作 document.cookie = 'name=qiu; max-age=9999; path=/; domain=domain; secure'; document.cookie = 'name=aaa; path=/; domain=domain; secure'; // 要改变cookie的值，需要使用相同的名字、路径和域，新的值 // 来设置cookie，同样的方法可以用来改变有效期 // 设置max-age为0可以删除指定cookie //读取cookie，访问document.cookie返回键值对组成的字符串， //不同键值对之间用'; '分隔。通过解析获得需要的值

cookieUtil.js：自己写的cookie操作工具

javascript有哪些方法定义对象 ===运算符判断相等的流程是怎样的 ==运算符判断相等的流程是怎样的

如果两个值类型相同，按照===比较方法进行比较

如果类型不同，使用如下规则进行比较

对象到字符串的转换步骤对象到数字的转换步骤 1. 如果对象有valueOf()方法并且返回元素值，javascript将返回值转换为数字作为结果 2. 否则，如果对象有toString()并且返回原始值，javascript将返回结果转换为数字作为结果 3. 否则，throws a TypeError <,>,<=,>=的比较规则

所有比较运算符都支持任意类型，但是比较只支持数字和字符串，所以需要执行必要的转换然后进行比较，转换规则如下: 1. 如果操作数是对象，转换为原始值：如果valueOf方法返回原始值，则使用这个值，否则使用toString方法的结果，如果转换失败则报错 2. 经过必要的对象到原始值的转换后，如果两个操作数都是字符串，按照字母顺序进行比较（他们的16位unicode值的大小） 3. 否则，如果有一个操作数不是字符串，将两个操作数转换为数字进行比较

+运算符工作流程函数内部arguments变量有哪些特性,有哪些属性,如何将它转换为数组 DOM事件模型是如何的,编写一个EventUtil工具类实现事件管理兼容 /** * 跨浏览器事件处理工具。只支持冒泡。不支持捕获 * @author (qiu_deqing@126.com) */ var EventUtil = { getEvent: function (event) { return event || window.event; }, getTarget: function (event) { return event.target || event.srcElement; }, // 返回注册成功的监听器，IE中需要使用返回值来移除监听器 on: function (elem, type, handler) { if (elem.addEventListener) { elem.addEventListener(type, handler, false); return handler; } else if (elem.attachEvent) { var wrapper = function () { var event = window.event; event.target = event.srcElement; handler.call(elem, event); }; elem.attachEvent('on' + type, wrapper); return wrapper; } }, off: function (elem, type, handler) { if (elem.removeEventListener) { elem.removeEventListener(type, handler, false); } else if (elem.detachEvent) { elem.detachEvent('on' + type, handler); } }, preventDefault: function (event) { if (event.preventDefault) { event.preventDefault(); } else if ('returnValue' in event) { event.returnValue = false; } }, stopPropagation: function (event) { if (event.stopPropagation) { event.stopPropagation(); } else if ('cancelBubble' in event) { event.cancelBubble = true; } }, /** * keypress事件跨浏览器获取输入字符 * 某些浏览器在一些特殊键上也触发keypress，此时返回null **/ getChar: function (event) { if (event.which == null) { return String.fromCharCode(event.keyCode); // IE } else if (event.which != 0 && event.charCode != 0) { return String.fromCharCode(event.which); // the rest } else { return null; // special key } } }; 评价一下三种方法实现继承的优缺点,并改进 function Shape() {} function Rect() {} // 方法1 Rect.prototype = new Shape(); // 方法2 Rect.prototype = Shape.prototype; // 方法3 Rect.prototype = Object.create(Shape.prototype); Rect.prototype.area = function () { // do something };

方法1：

方法2：

优点：正确设置原型链实现继承

缺点：父类构造函数原型与子类相同。修改子类原型添加方法会修改父类

方法3：

优点：正确设置原型链且避免方法1.2中的缺点

缺点：ES5方法需要注意兼容性