【JavaScript 高级技巧】防篡改对象+高级定时器
2016-06-01 20:57
423 查看
因为任何对象都可以被在同一环境中运行的代码修改,开发人员很可能会意外的修改别人的代码,甚至会用不兼容的功能重写原生对象。而防篡改对象就是一个可以解决这个问题的方法。
Object.isExtensible( ):确定对象是否可扩展
虽然不能给对象加新成员,但是已有的成员不受影响,仍然可以修改和删除已有的成员。
Object.isSealed( ):确定对象是否被密封了。
Object.isFrozen( ):去顶对象是否被冻结了。
先说一下setTimeout( )和setInterval( ):
使用SetInterval和设定延时函数setTimeout 很类似。setTimeout 运用在延迟一段时间,再进行某项操作;setInterval可以使一段代码每过指定时间就运行一次。
setTimeout(“function”,time) :返回一个ID,可以用作清除此计时器。
setInterval(“function”,time) :返回一个ID,作为clearInterval()的参数。
SetInterval为自动重复,setTimeout不会重复。
(1)某些间隔会被跳过;
(2)多个定时器的代码执行之间的间隔可能会比预期的小。
解决办法:
链式调用setTimeout(),每次函数执行的时候都创建一个新的定时器,这样在前一个定时器代码执行完之前,不会向队列插入新的定时器代码,确保不会有任何确实的间隔。
(1)过长的/过深嵌套的函数调用
(2)进行大量处理的循环
如果 处理不需要同步完成,而数据也不需要顺序完成,那么就可以使用数组分块的方法,用计时器来分隔循环。
数组分块的基本思路:
为要处理的项目创建一个队列,然后使用定时器取出下一个要处理的项目进行处理,接着再设置另一个定时器。
这样每隔200ms 就会打印出一个单词。
一、防篡改对象
1、不可扩展对象
Object.preventExtensions( ):不能给对象添加新属性和方法了;Object.isExtensible( ):确定对象是否可扩展
虽然不能给对象加新成员,但是已有的成员不受影响,仍然可以修改和删除已有的成员。
2、密封的对象
Object.seal( ):将对象设置为密封对象,密封对象不可扩展,也不能删除已有属性和方法,但属性可修改Object.isSealed( ):确定对象是否被密封了。
3、冻结的对象
Object.freeze( ):将对象设置为冻结对象,冻结对象不可扩展,也是密封的,而且对象属性不可修改Object.isFrozen( ):去顶对象是否被冻结了。
二、高级定时器
关于定时器,一个很重要的问题是:指定的时间间隔表示何时将定时器的代码添加到队列,而不是何时执行代码。先说一下setTimeout( )和setInterval( ):
使用SetInterval和设定延时函数setTimeout 很类似。setTimeout 运用在延迟一段时间,再进行某项操作;setInterval可以使一段代码每过指定时间就运行一次。
setTimeout(“function”,time) :返回一个ID,可以用作清除此计时器。
setInterval(“function”,time) :返回一个ID,作为clearInterval()的参数。
SetInterval为自动重复,setTimeout不会重复。
1、重复的定时器
setInterval()有两个问题:(1)某些间隔会被跳过;
(2)多个定时器的代码执行之间的间隔可能会比预期的小。
解决办法:
链式调用setTimeout(),每次函数执行的时候都创建一个新的定时器,这样在前一个定时器代码执行完之前,不会向队列插入新的定时器代码,确保不会有任何确实的间隔。
setTimeout(function(){ //code setTimeout(arguments.callee,interval) },interval)
2、数组分块
脚本长时间运行的问题通常是由以下原因造成:(1)过长的/过深嵌套的函数调用
(2)进行大量处理的循环
如果 处理不需要同步完成,而数据也不需要顺序完成,那么就可以使用数组分块的方法,用计时器来分隔循环。
数组分块的基本思路:
为要处理的项目创建一个队列,然后使用定时器取出下一个要处理的项目进行处理,接着再设置另一个定时器。
function arrayChunk (array,process,context,delay) { if(delay) { interval = delay; } else { interval = 100; } setTimeout(function () { var item = array.shift();//取出下一个条目 process.call(context,item);//处理下一个条目 if (array.length > 0) {//若还有条目,则设置另一个定时器 setTimeout(arguments.callee,interval); } },interval); }
var data = ["Hello","I","am","vickygu",",","I","am","so","glad","today"]; function printValue (item) { var arrayDiv = document.getElementById("arrayDiv"); arrayDiv.innerHTML += item + " "; } arrayChunk(data,printValue,null,200);
这样每隔200ms 就会打印出一个单词。
3、函数节流
见上一篇博客。相关文章推荐
- JSON与XML的区别比较
- 同时加载执行多个js函数addLoadEvent()
- jsp 实现文本文件上传
- javascript部分细节(持续更新)
- Json串(没用)
- CityMaker学习教程10 示例代码的使用Javascript
- JSP 实用程序之简易图片验证码
- 网页打印表单js代码
- javascript的 Source Map
- javascript:算法之斐波那契数列
- 解析json图片
- javascript基础语法——变量和标识符
- JS小数运算出现多位小数的问题
- js函数(类)的继承机制的设计与实现(四)
- Web前端学习第十六天·fighting_JavaScript(DOM编程艺术5-6章)
- JavaScript学习--Item31 值得你挑战的JavaScript面试题(45题)
- D3.js在svg地图上标点
- javascript:算法之数组去重
- JavaScript设计模式之接口
- js将long日期格式转换为标准日期格式