/**
Improve you loop code
*/
var treasureChest = {
goldCoins: 10000,
magicalItem : "Crown of Speed",
necklaces: ["ruby", "pearl", "sapphire", "diamond"],
openLid: function(){
alert("openLid");
}
}; console.log("You found the following necklaces: ");
//
//**BAD**
//
for(var i = 0; i < treasureChest.necklaces.length; i++){
console.log(treasureChest.necklaces[i]);
}
//The code need to do many things:
//1. the value of i
//2. the treasureChest object
//3. necklaces property
//4. the array pointed to by the property
//5. the length property of the array
//Count steps:
//5 steps * (4 loops + 1 check to stop) = 25 steps /*
What step we can eliminate?
Use "cached values" to curtail lengthy, repetitive to the same data
*/
var x = treasureChest.necklaces.length;
for(var i = 0; i < x; i++){
console.log(treasureChest.necklaces[i]);
}
//Memory access during loop control now only needs to:
//1. retrieve the value of i
//2. retrieve the value of x
//----------- for creating x--------------
//1. ONE TIME COST, creating the variable x in memory
//2-5: the 4 steps finding the value of length
//Count steps:
//2 steps * (4 loops + 1 check to stop) + 5 create extra variable = 15 steps //So we got 25 - 15 = 10 steps less, imaging we have 10000 datas!
//The difference would be:
//5 steps * (10000 loops + 1 check to stop) = 50005 steps
//2 steps * (10000 loops + 1 check to stop) + 5 extra steps for x = 20007 steps
//The difference would be:
//50005 - 20007 = ~30000 !!!! /**
Place your extra control variables inside the loop
*/
for(var i = 0, x = treasureChest.necklaces.length; i < x; i++){
console.log(treasureChest.necklaces[i]);
} /**
Avoid repetitive access at depth
*/
var list = treasureChest.necklaces;
for(var i = 0, x = treasureChest.necklaces.length; i < x; i++){
console.log(list[i]);
} /**
Choose the best loop for arrays,
for-loop usually better than for-in loop
*/
Array.prototype.countType = function(type){
...
}
Array.prototype.removeAll = function(item){
...
}
var list = treasureChest.necklaces;
for(p in list){
console.log(list[i]);
}
//will console out:
//"ruby", "pearl", "sapphire", "diamond", "countType", "removeAll"
//"countType", "removeAll", those are not we want!
//The reason for this is because for-in loop is a property approach to access
//indices will also add in all methods that have been added to the Array prototype.
//prototype makes methods we add becomes Enumerable just like indices.

[Javascript]1. Improve you speed! Loop optimaztion的更多相关文章

  1. [Javascript]3. Improve you speed! Performance Tips

    /** Let inheritance help with memory efficiency */ function SignalFire(ID, startingLogs){ this.fireI ...

  2. [Javascript]2. Improve you speed! Script Execution

    Let's take a closer look at how a browser retrieves and acts on scripts.modern browser can parallel ...

  3. JavaScript Concurrency model and Event Loop 并发模型和事件循环机制

    原文地址:https://developer.mozilla.org/en-US/docs/Web/JavaScript/EventLoop JavaScript 有一个基于 event loop 的 ...

  4. 一篇文章图文并茂地带你轻松学完 JavaScript 事件循环机制(event loop)

    JavaScript 事件循环机制 (event loop) 本篇文章已经默认你有了基础的 ES6 和 javascript语法 知识. 本篇文章比较细致,如果已经对同步异步,单线程等概念比较熟悉的读 ...

  5. javascript基础修炼(5)—Event Loop(Node.js)

    开发者的javascript造诣取决于对[动态]和[异步]这两个词的理解水平. 一. 一道考察异步知识的面试题 题目是这样的,要求写出下面代码的输出: setTimeout(() => { co ...

  6. JavaScript并发模型与Event Loop (转载)

    并发模型可视化描述 model.svg 如上图所示,Javascript执行引擎的主线程运行的时候,产生堆(heap)和栈(stack),程序中代码依次进入栈中等待执行, 若执行时遇到异步方法,该异步 ...

  7. javascript的执行机制—Event Loop

    既然今天要谈的是javascript的事件循环机制,要理解事件循环,首先要知道事件循环是什么. 我们先从一个例子来看一下javascript的执行顺序. <script> setTimeo ...

  8. JavaScript 运行机制以及Event Loop(事件循环)

    一.JavaScript单线程 众所周知JavaScript是一门单线程语言,也就是说,在同一时间内JS只能做一件事.为什么JavaScript不能有多个线程呢?这样不是能够提高效率吗? JavaSc ...

  9. JavaScript 的核心机制——event loop(最易懂版)

    前言 javascript从诞生之日起就是一门单线程的非阻塞的脚本语言. 非阻塞就是当代码需要进行一项异步任务(无法立刻返回结果,需要花一定时间才能返回的任务,如ajax事件)时,主线程会挂起(pen ...

随机推荐

  1. PHP cURL中CURLOPT_CONNECTTIMEOUT和CURLOPT_TIMEOUT的区别

    CURLOPT_CONNECTTIMEOUT用来告诉PHP脚本在成功连接服务器前等待多久(连接成功之后就会开始缓冲输出),这个参数是为了应对目标服务器的过载,下线,或者崩溃等可能状况: CURLOPT ...

  2. Hibernate与Mybatis对比

    Hibernate与Mybatis对比 两者相同点 Hibernate与MyBatis都可以是通过SessionFactoryBuider由XML配置文件生成SessionFactory,然后由Ses ...

  3. PHP中CGI,FastCGI,PHP-CGI与PHP-FPM对比

    CGI CGI全称是“公共网关接口”(Common Gateway Interface),HTTP服务器与你的或其它机器上的程序进行“交谈”的一种工具,其程序须运行在网络服务器上. CGI可以用任何一 ...

  4. Codeforces Round #361 (Div. 2) E. Mike and Geometry Problem 离散化 排列组合

    E. Mike and Geometry Problem 题目连接: http://www.codeforces.com/contest/689/problem/E Description Mike ...

  5. ROS知识(20)----使用Master_API查询Master管理的节点话题服务内容

    在一些应用中会需要获取master的uri地址,发布的话题,订阅的话题,发布的服务,节点的信息等等.这些功能我们通常可一通过rosnode list, rosnode info, rostopic l ...

  6. Git_分支管理

    分支就是科幻电影里面的平行宇宙,当你正在电脑前努力学习Git的时候,另一个你正在另一个平行宇宙里努力学习SVN. 如果两个平行宇宙互不干扰,那对现在的你也没啥影响.不过,在某个时间点,两个平行宇宙合并 ...

  7. ESB的几个基本概念

    京-星之泪:  请教一个问题:esb中路由和管道对的概念应该怎么理解,各自有什么用途,他们之间的关系 北京-kimmking: transport  endpoint inbound  outboun ...

  8. OllyDbg 使用笔记 (十二)

    OllyDbg 使用笔记 (十二) 參考 书:<加密与解密> 视频:小甲鱼 解密系列 视频 演示样例程序下载地址:http://pan.baidu.com/s/1eQiV6aI 安装好程序 ...

  9. js判断手机端和pc端

    var browser = { versions: function() { var u = navigator.userAgent, app = navigator.appVersion; retu ...

  10. jQuery异步获取json数据的2种方式

    jQuery异步获取json数据有2种方式,一个是$.getJSON方法,一个是$.ajax方法.本篇体验使用这2种方式异步获取json数据,然后追加到页面. 在根目录下创建data.json文件: ...