JavaScript中四种基本的数据存取位置

  字面量:只代表自身 字符串、数字、布尔值、对象、函数、数组、正则,以及null和undefined    快

  本地变量:var定义的    快

  数组元素:以数字作为索引   慢

  对象成员:以字符串作为索引    慢

  大多数情况下,从字面量和一个局部变量中存取数据的性能差异不大,而访问数组元素和对象成员的代价略高(根据地址查找堆)

一、作用域链和标识符解析

  函数内部属性[[scope]]包含了被创建时所在作用域中的对象的集合,称为函数的作用域链

function add(num1, num2){
var sum = num1 + num2;
return sum;
}

  若add是在全局环境下创建,那它的作用域链,就只有一个全局对象(this:window, window:object, document:object, add:function)

var total = add(5, 10);

  当add执行时,其执行环境的作用域链为 活动对象(this:window, arguments:[5, 10], num1:5, num2: 10, sum:undefined) +  上面的全局对象

  标识符解析时,查找执行环境作用域链,找到即停。标识符所在的位置越深,读写速度就越慢。全局变量总是在执行环境作用域链的最末端,因此它也是最远的

  如果每个某个跨作用域的值在函数中被引用了一次以上,建议把它存储到局部变量。如下:

var bd = document.body,
links = document.getElementsByTagName('a'),
goBtn = document.getElementById('go-btn');

  document是个全局变量,仅仅声明变量就被访问了这么多次,但每一次访问document都要遍历整个作用域链,直到最后在全局变量对象中找到,开销很大,建议用局部变量存储:

var doc = document,
bd = doc.body,
links = doc.getElementsByTagName('a'),
goBtn = doc.getElementById('go-btn');

二、对象成员和原型链

对象中有两种成员类型:实例成员 和 原型成员。实例成员直接存在于对象实例中,原型成员则从对象原型中继承而来。

var obj = {},
var arr = [];
function fun(){
//do something
}

  obj的原型链:obj ---> Object.prototype

  arr的原型链:arr ---> Array.prototype --->Object.prototype

  fun的原型链:fun ---> Function.prototype ---> Object.prototype

所有对象都是Object的实例,所以都会继承Object.prototype中的方法,如:hasOwnProperty、isPropertyOf、toString

arr调用toString时,要一级一级搜索原型链,直到Object.prototype。可见存在的位置越深,寻找就越慢。

搜索对象成员本身就比 从字面量或局部变量中读取数据 代价高,再加上遍历原型链,更慢。

若要多次读取同一个对象属性,最佳做法是将属性值保存到局部变量中,避免多次查找带来的性能开销

JavaScript数据存取的性能问题的更多相关文章

  1. 高性能JavaScript(数据存取)

    数据存取分为4各部分 存取位置 作用域及改变作用域 原型以及原型链 缓存对象成员值 存取位置 JavaScript 有4中基本的数据存取位置 字面量:字面量代表自身,不存于特定的位置.比如这个的匿名函 ...

  2. JS性能优化——数据存取

    首先,了解几个概念: 字面量:它只代表自身,不存储在特定的位置.JavaScript中的字面量有:字符串.数字.布尔值.对象.数组.函数.正则,以及特殊的null和undefined值 本地变量:使用 ...

  3. 高性能JS笔记2——数据存取

    数据存取性能而言: 字面量>本地变量>数组元素>对象成员 一.标识符解析的性能 标识符解析是有代价的,一个标识符的位置越深,它的读写速度也就越慢. 局部变量的读写速度是最快的,全局变 ...

  4. 高性能Js—数据存取

    数据存取 JavaScript中四中基本的数据存取位置 字面量:不存于某个变量内 本地变量:var定义的 数组元素 对象成员 字面量.全局变量读取速度 > 数组项.对象成员 .因为局部变量存在于 ...

  5. Laxcus大数据管理系统2.0(5)- 第三章 数据存取

    第三章 数据存取 当前的很多大数据处理工作,一次计算产生几十个GB.或者几十个TB的数据已是正常现象,驱动数百.数千.甚至上万个计算机节点并行运行也已经不足为奇.但是在数据处理的后面,对于这种在网络间 ...

  6. 【HANA系列】SAP HANA XS使用JavaScript数据交互详解

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[HANA系列]SAP HANA XS使用Jav ...

  7. JavaScript 数据访问(通译自High Performance Javascript 第二章) [转]

    JavaScript 数据访问(通译自High Performance Javascript 第二章)   JavaScript 数据访问(翻译自High Performance Javascript ...

  8. 【HANA系列】【第一篇】SAP HANA XS使用JavaScript数据交互详解

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[HANA系列][第一篇]SAP HANA XS ...

  9. 13 个最佳 JavaScript 数据网格库

    13 个最佳 JavaScript 数据网格库   转自:开源中国 www.oschina.net/translate/best-javascript-data-grid-libraries Java ...

随机推荐

  1. Android游戏开发实践(1)之NDK与JNI开发01

    Android游戏开发实践(1)之NDK与JNI开发01 NDK是Native Developement Kit的缩写,顾名思义,NDK是Google提供的一套原生Java代码与本地C/C++代码&q ...

  2. ERR_CONTENT_DECODING_FAILED错误的原因和解决办法

    1. ERR_CONTENT_DECODING_FAILED错误的原因 这种错误通常发生于Http请求中的头部信息标识内容是gzip编码的,但实际上不是. 2. ERR_CONTENT_DECODIN ...

  3. 萌新笔记——C++里创建 Trie字典树(中文词典)(二)(插入、查找、导入、导出)

    萌新做词典第二篇,做得不好,还请指正,谢谢大佬! 做好了插入与遍历功能之后,我发现最基本的查找功能没有实现,同时还希望能够把内存的数据存入文件保存下来,并可以从文件中导入词典.此外,数据的路径是存在配 ...

  4. 解决ubuntu eclipse中 Android SDK Manager 图标不见的方法

    在eclipse中选择的步骤如下:   Window ---> Custom Perspective  --> command Group Availability ----> an ...

  5. 项目自动化建构工具gradle 入门3——生一个exe的helloWorld

    前两次呢,我们能够用一个外部的jar 来实现输出helloWorld.但问题是我每次都要用java -jar 来执行,这样我们自己玩还可以,让用户玩就不好了.所以我们生成一个exe给他们吧.这次我们仍 ...

  6. 给Eclipse提速的7个技巧

    这篇文章只是关注如何让Eclipse运行得更快.每个技巧都针对Windows.Linux和MacOS用户详细说明.在使用所有优化技巧之后,Eclipse应该能在10秒内启动,并且比以前运行得更流畅. ...

  7. BZOJ 1691: [Usaco2007 Dec]挑剔的美食家 [treap 贪心]

    1691: [Usaco2007 Dec]挑剔的美食家 Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 786  Solved: 391[Submit][S ...

  8. java程序设计之循环链表

    照例来说点废话,愿自己生一颗温柔细腻的心,这样女朋友也许一个眼神,一个微笑,我就知道如何做,可惜内心与外表一样粗糙,这一生有幸认识她,愿天下有情人终成眷属. 循环链表,顾名思义循环就好了,所以建一个线 ...

  9. Salesforce Apex 使用JSON数据的示例程序

    本文介绍了一个在Salesforce Apex中使用JSON数据的示例程序, 该示例程序由以下几部分组成: 1) Album.cls, 定了了封装相关字段的数据Model类 2) RestClient ...

  10. [LeetCode] Reverse Linked List 倒置链表

    Reverse a singly linked list. click to show more hints. Hint: A linked list can be reversed either i ...