高性能javascript学习笔记系列(4) -算法和流程控制
参考高性能javascript
for in 循环 使用它可以遍历对象的属性名,但是每次的操作都会搜索实例或者原型的属性 导致使用for in 进行遍历会产生更多的开销
书中提到不要使用for in 遍历数组
1 首先for in 会查找原型链上的属性
var arr = [1,2,3];
Array.prototype.a = "test"; for(var i in arr) {
console.log(i);
console.log(typeof i);
}//在这里例子中会发现属性的字段是string 并且a也会作为结果输出 (可以通过hasOwnProperty()进行过滤原型的属性)
var arr = [1,2,3];
Array.prototype.a = "test";
for(var i = 0,len = arr.length;i < len;i+=1) {
console.log(i);
console.log(typeof i);
}//在这个例子中每个i都是number 并且a不会作为结果输出
如何提高循环的整体性能
(1)减少或者优化每次迭代处理的事务 缓存循环中不变的值(不一定是数组的长度 就是不要在循环中不断的去查找一个固定的值 ) 如果数组项的顺序与执行的任务无关,可以使用从后往前处理这种方案,这样就减少了每次跟迭代次数进行比较的这次操作,也优化了性能
(2)减少迭代的次数
在一次迭代中执行多次迭代 能从整体上减少循环迭代的次数
var iterations = Math.floor(items.length/8),
startAt = items.length%8,
i = 0;
console.time("a");
do {
switch(startAt) {
case 0: process(items[i++]);
case 7: process(items[i++]);
case 6: process(items[i++]);
case 5: process(items[i++]);
case 4: process(items[i++]);
case 3: process(items[i++]);
case 2: process(items[i++]);
case 1: process(items[i++]);
}
startAt = 0;
} while(--iterations);
在使用这种模式的情况下 在次数不够高的时候(比如10000) 我发现这种模式的速度并没有比传统的循环处理快 反而慢 当数量级上来(100000)的时候 的确提升了性能
优化条件语句
根据情景选择合适的条件语句
(1)通常来说if else更适合两个离散值或者几个不同的值域的情况 当条件多于两个离散值的时候,switch语句是更加的选择
(2)优化if else 确保最可能出现的分支放在首位 在if else 的分支中在进行if else的判断 思路都是尽快到达条件的分支
使用Memoization
思路就是缓存之前一次计算的结果供下一次计算使用,在递归算法中常用的技术
function factorial(n) {
if(n == 0) {
return 1;
} else {
return n*factorial(n-1);
}
}
console.time("a");
factorial(16);
factorial(11);
factorial(10);
memfactorial(10);
memfactorial(10);
memfactorial(10);
memfactorial(10);
console.timeEnd("a");
function memfactorial(n) {
if(!memfactorial.cache) {
memfactorial.cache = {
"0":1,
"1":1
};
}
if(!memfactorial.cache.hasOwnProperty(n)) {
memfactorial.cache[n] = n*memfactorial(n-1);
}
return memfactorial.cache[n];
}
console.time("b");
memfactorial(16);
memfactorial(11);
memfactorial(10);
memfactorial(10);
memfactorial(10);
memfactorial(10);
console.timeEnd("b");

由于我们缓存了之前计算的结果 在后面多次需要这个结果的时候 会很大程度的提高性能(我发现当不是多次需要之前的计算的结果的时候 性能反而没有提升 js引擎性能的提高 和属性的查找也需要耗费一些性能)
高性能javascript学习笔记系列(4) -算法和流程控制的更多相关文章
- 高性能javascript学习笔记系列(2)-数据存取
参考 高性能javascript Tom大叔深入理解javascript系列 相关概念 1.执行上下文 当控制器转到ecmascript可执行代码的时候,就会进入一个执行上下文,执行上下文是以堆栈 ...
- 高性能javascript学习笔记系列(1) -js的加载和执行
这篇笔记的内容主要涉及js的脚本位置,如何加载js脚本和脚本文件执行的问题,按照自己的理解结合高性能JavaScript整理出来的 javascript是解释性代码,解释性代码需要经历转化成计算机指令 ...
- 高性能javascript学习笔记系列(6) -ajax
参考 高性能javascript javascript高级程序设计 ajax基础 ajax技术的核心是XMLHttpRequest对象(XHR),通过XHR我们就可以实现无需刷新页面就能从服务器端读 ...
- 高性能javascript学习笔记系列(5) -快速响应的用户界面和编程实践
参考高性能javascript 理解浏览器UI线程 用于执行javascript和更新用户界面的进程通常被称为浏览器UI线程 UI线程的工作机制可以理解为一个简单的队列系统,队列中的任务按顺序执行 ...
- 高性能javascript学习笔记系列(3) -DOM编程
参考 高性能javascript 文档对象模型(DOM)是独立于语言的,用于操作XML和HTML文档的程序接口API,在浏览器中主要通过DOM提供的API与HTML进行交互,浏览器通常会把DOM和ja ...
- 高性能JavaScript笔记二(算法和流程控制、快速响应用户界面、Ajax)
循环 在javaScript中的四种循环中(for.for-in.while.do-while),只有for-in循环比其它几种明显要慢,另外三种速度区别不大 有一点需要注意的是,javascript ...
- golang学习笔记(二):流程控制
欢迎访问我的博客和github! 今天咱们把烦人的事情丢一丢,继续来学习go的基础知识. 这篇文章记录go语言的流程控制和更多类型. 流程控制 for Go 只有一种循环结构:for 循环. 基本的 ...
- JavaScript学习笔记系列2:Dom操作(一)
一.什么是Dom? DOM------>Document Object Model 直接翻译就是文档对象模型. DOM------>定义了表示和修改文档所需的对象.这些对象的行为和属性以及 ...
- 高性能javascript 学习笔记(1)
加载和运行 管理浏览器中的javascript代码是个棘手的问题,因为代码运行阻塞了其他浏览器处理过程,诸如用户绘制,每次遇到<script>标签,页面必须停下来等待代码下载(如果是外部的 ...
随机推荐
- javase基础复习攻略《四》
本篇内容重点介绍JAVA中的异常处理机制,什么是JAVA异常?JAVA异常是JAVA提供的用于处理程序中错误的一种机制.所谓错误就是指在程序的运行过程中出现的一些异常事件(如:0溢出,数组下表越界,所 ...
- PHP的学习--PHP的闭包
php的闭包(Closure)也就是匿名函数,是PHP5.3引入的. 闭包的语法很简单,需要注意的关键字就只有use,use是连接闭包和外界变量. $a = function() use($b) {} ...
- js让程序暂停一段时间再执行
function sleep(d){ for(var t = Date.now();Date.now() - t <= d;); } sleep(5000); //当前方法暂停5秒
- GIF录制神器GifCam
前几天偶然看到一款神器:GifCam! GifCam是什么? 一款录制gif动画图片的小软件,小到不足一兆. 使用方法(简单到不可思议) 百度 GifCam 下载: 不用安装,直接打开gifcam: ...
- 【Java基础】类和接口
Num1:使类和成员的可访问性最小化 要区别设计良好的模块与设计不好的模块,最重要的因素在于,这个模块对于外部的其他模块而言,是否隐藏其内部数据和其他实现细节.设计良好的模块会隐藏所有的实现细节,把它 ...
- 基于HTML5的WebGL呈现A星算法的3D可视化
http://www.hightopo.com/demo/astar/astar.html 最近搞个游戏遇到最短路径的常规游戏问题,一时起兴基于HT for Web写了个A*算法的WebGL 3D呈现 ...
- MVC之前的那点事儿系列(6):动态注册HttpModule
文章内容 通过前面的章节,我们知道HttpApplication在初始化的时候会初始化所有配置文件里注册的HttpModules,那么有一个疑问,能否初始化之前动态加载HttpModule,而不是只从 ...
- 选择排序---堆排序算法(Javascript版)
堆排序分为两个过程: 1.建堆. 堆实质上是完全二叉树,必须满足:树中任一非叶子结点的关键字均不大于(或不小于)其左右孩子(若存在)结点的关键字. 堆分为:大根堆和小根堆,升序排序采用大根堆,降序排序 ...
- Ajax学习笔记1之第一个Ajax应用程序
代码 <head> <title>An Ajax demo</title> <script src="../js/jquery-1.4.1.js&q ...
- Win10怎么输入法切换
按 windows 键+空格键,或者CTRL+Shift,或者只按 Shift,或者CTRL+空格 试试 方法/步骤1在桌面上点击[控制面板],进入控制面板后使用分类显示控制面板内的选项.然后在语言下 ...