实现JavaScript高性能的数据存储


Posted in Javascript onDecember 11, 2016

1.JavaScript中四种基本数据存取位置:字面量,本地变量,数组元素,对象成员。

一般来说:[字面量,局部变量]运行速度>[数组,对象成员]

2.内部属性包含了一个函数被创建的作用域中对象的集合。这个集合被称为作用域链。

3.执行函数->创建执行环境->创建活动对象(即函数运行时变量对象)。

所以多次调用同一个函数会导致创建多个执行环境。

4.函数执行过程

每遇到一个变量都会经历一次标识符解析过程,从哪里获取或存储数据。该过程搜索执行环境的作用域链。正是这种搜索过程影响了性能。

5.标识符解析的性能

全局变量总是存在于执行环境作用域的最末端。局部变量是第一顺位解析。

经验法则:如果某个跨作用域的值在函数中被引用一次以上,那么就把他存储到局部变量中。

如:

function initUI(){
 var bd=document.body;
 //后面有多次doucument这个全局对象的调用
}
//->优化后
function initUI(){
 var doc=document;
  bd=doc.body;
 //把doucument这个全局对象的引用存储到局部变量doc中
 
}

6.改变作用域链

一般来说,一个执行环境的作用域链不会改变的。

<1>with可以临时改变作用域链

width用来给对象的所有属性创建一个变量

function initUI(){
 with(document){
 var bd=body; 
 }
}

当代码执行到with时,执行环境的作用域链被临时改变了。一个新的变量对象呗创建,它包含了参数指定对象的所有属性。这个对象呗推入作用域链的首位,所以这时候所有的局部变量处于的哥第二个作用域链对象中,因此访问代价更高了。

<2>try-catch

try语句发生错误的时候,执行过程会自动跳转到catch中。然后把异常对象推入一个变量对象并置于作用域的首位

注意:一旦catch子语句执行完毕,作用域链就会返回到之前的状态。

7.闭包引发的性能问题

闭包是JavaScript最强大的特性之一。

由于闭包包含了执行了与环境作用域链相同对象的引用,函数的活动对象不会被销毁,造成更多的内存开销。

关注的性能点:频繁访问跨作用域的标识符时,每次访问都会带来性能损失。

Start:19:41:45 2015-11-21 引用自by Aaron:http://www.cnblogs.com/aaronjs/p/3370176.html

8.内存泄露

内存泄露是指一块被分配的内存既不能使用,又不能回收,直到浏览器进程结束。在C++中,因为是手动管理内存,内存泄露是经常出现的事情。而现在流行的C#和Java等语言采用了自动垃圾回收方法管理内存,正常使用的情况下几乎不会发生内存泄露。浏览器中也是采用自动垃圾回收方法管理内存,但由于浏览器垃圾回收方法有bug,会产生内存泄露。

内存泄露的几种情况

  • 循环引用
  • Javascript闭包
  • DOM插入顺序

一个DOM对象被一个Javascript对象引用,与此同时又引用同一个或其它的Javascript对象,这个DOM对象可能会引发内存泄漏。这个DOM对象的引用将不会在脚本停止的时候被垃圾回收器回收。要想破坏循环引用,引用DOM元素的对象或DOM对象的引用需要被赋值为null。

具体的就深入讨论了,这里的总结

  • JS的内存泄露,无怪乎就是从DOM中remove了元素,但是依然有变量或者对象引用了该DOM对象。然后内存中无法删除。使得浏览器的内存占用居高不下。这种内存占用,随着浏览器的刷新,会自动释放。
  • 而另外一种情况,就是循环引用,一个DOM对象和JS对象之间互相引用,这样造成的情况更严重一些,即使刷新,内存也不会减少。这就是严格意义上说的内存泄露了。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
很酷的javascript loading效果代码
Jun 18 Javascript
jquery中$each()方法的使用指南
Apr 30 Javascript
jQuery结合CSS制作漂亮的select下拉菜单
May 03 Javascript
javascript实现五星评价代码(源码下载)
Aug 11 Javascript
jQuery获取某天的农历日期并判断是否除夕或新年的方法
Mar 01 Javascript
js基于myFocus实现轮播图效果
Feb 14 Javascript
js正则表达式验证表单【完整版】
Mar 06 Javascript
JS实现二叉查找树的建立以及一些遍历方法实现
Apr 17 Javascript
详解vue-cli 接口代理配置
Dec 13 Javascript
vue中手机号,邮箱正则验证以及60s发送验证码的实例
Mar 16 Javascript
JavaScript实现数组全排列、去重及求最大值算法示例
Jul 30 Javascript
vue里的data要用return返回的原因浅析
May 28 Javascript
探索Javascript中this的奥秘
Dec 11 #Javascript
实例浅析js的this
Dec 11 #Javascript
解析js如何获取css样式
Dec 11 #Javascript
BootStrap轮播HTML代码(推荐)
Dec 10 #Javascript
JQuery.validationEngine表单验证插件(推荐)
Dec 10 #Javascript
JS产生随机数的用法小结
Dec 10 #Javascript
基于JavaScript实现随机颜色输入框
Dec 10 #Javascript
You might like
神族 Protoss 历史背景
2020/03/14 星际争霸
如何限制访问者的ip(PHPBB的代码)
2006/10/09 PHP
让CodeIgniter数据库缓存自动过期的处理的方法
2014/06/12 PHP
PHP+Apache实现二级域名之间共享cookie的方法
2019/07/24 PHP
php更新cookie内容的详细方法
2019/09/30 PHP
用php实现分页效果的示例代码
2020/12/10 PHP
JS获取页面input控件中所有text控件并追加样式属性
2013/02/25 Javascript
javascript:;与javascript:void(0)使用介绍
2013/06/05 Javascript
Jquery实现图片左右自动滚动示例
2013/09/25 Javascript
js对象转json数组的简单实现案例
2014/02/28 Javascript
Jquery Easyui表单组件Form使用详解(30)
2016/12/19 Javascript
jQuery扩展_动力节点Java学院整理
2017/07/05 jQuery
原生js 封装get ,post, delete 请求的实例
2017/08/11 Javascript
详解VUE前端按钮权限控制
2019/04/26 Javascript
利用vue-i18n实现多语言切换效果的方法
2019/06/19 Javascript
jQuery中DOM常见操作实例小结
2019/08/01 jQuery
微信小程序学习总结(一)项目创建与目录结构分析
2020/06/04 Javascript
解决vue动态路由异步加载import组件,加载不到module的问题
2020/07/26 Javascript
vue设置全局访问接口API地址操作
2020/08/14 Javascript
python+opencv识别图片中的圆形
2020/03/25 Python
Python中函数参数调用方式分析
2018/08/09 Python
mac PyCharm添加Python解释器及添加package路径的方法
2018/10/29 Python
Python rstrip()方法实例详解
2018/11/11 Python
python的pstuil模块使用方法总结
2019/07/26 Python
获取Pytorch中间某一层权重或者特征的例子
2019/08/17 Python
Pycharm如何运行.py文件的方法步骤
2020/03/03 Python
详解Scrapy Redis入门实战
2020/11/18 Python
俄罗斯电子产品在线商店:UltraTrade
2020/01/30 全球购物
如何用Java判断一个文件或目录是否存在
2012/11/19 面试题
UNIX命令速查表
2012/03/10 面试题
通信工程专业女生个人求职信
2013/09/21 职场文书
初中数学教学反思
2014/01/16 职场文书
室内趣味活动方案
2014/08/24 职场文书
会计求职信怎么写
2015/03/20 职场文书
财务出纳岗位职责
2015/03/31 职场文书
python爬取某网站原图作为壁纸
2021/06/02 Python