《JavaScript高级程序设计》笔记:变量、作用域和内存问题(四)
基本类型和引用类型的值
ECMAScript变量可能包含两种不同数据类型的值:基本类型值和引用类型值。基本类型值指的是简单的数据段,而引用类型的值指那些可能有多个值构成的对象。
动态的属性
var person = new Object();
person.name = "Nicholas";
alert(person.name); // Nicholas
var name = "Nicholas";
name.age = 27;
alert(name.age); // undefined
这说明只能给引用类型值动态添加属性。
复制变量值
var num1 = 5;
var num2 = num1;
num1中保存的值是5.当使用num1的值来初始化num2时,num2中也保存了值5.但num2中的5与num1中的5是完全独立的,该值只是num1中5的一个副本。
var obj1 = new Object();
var obj2 = obj1;
obj1.name = "Nicholas";
alert(obj2.name); // Nicholas
变量obj1保存了一个对象的新实例。然后,这个值被复制到了obj2中;换句话说,obj1和obj2都指向同一个对象。这样,当为obj1添加name属性后,可以通过obj2来访问这个属性。
传递参数
ECMAScript中所有函数的参数都是按值传递的。也就是说把函数外部的值复制给函数内部的参数,就和把值从一个变量复制到另一个变量一样。有不少开发人员会感到困惑,因为访问变量有按值和按引用两种方式。而参数只能按值传递。
function addTen(num){
num +=10;
return num;
}
var count = 20;
var result = addTen(count);
alert(count); // 20, 没有变化
alert(result); //
function setName(obj){
obj.name = "Nicholas";
}
var person = new Object();
setName(person);
alert(person.name); // "Nicholas"
function setName(obj){
obj.name = "Nicholas";
obj = new Object();
obj.name = "Greg";
}
var person = new Object();
setName(person);
alert(person.name); // "Nicholas"
如果person是按引用传递的,那么person就会自动被修改为指向其name属性值为"Greg"的新对象。
执行环境及作用域
var color = "blue";
function changeColor(){
if(color == 'blue'){
color = 'red';
}else{
color = 'blue';
}
}
changeColor();
alert('color is now' + color); //red
垃圾收集
垃圾回收
javascript具有垃圾回收的机制,也就是说,执行环境会负责管理代码执行过程中使用的内存。其余的不多说,我们来分析一下函数中局部变量的正常生命周期。局部变量只在函数执行过程中存在。而在这个过程中,会为局部变量在栈(或堆)内存上分配相应的空间,以便存储他们的值。然后在函数中使用这些变量,直到函数结束。此时,局部变量就没有存在的必要了,因此可以释放他们所占的内存以供他们使用。现在各大浏览器通常用采用的垃圾回收有两种方法:标记清除、引用计数。
标记清除
这是javascript中最常用的垃圾回收方式。当变量进入执行环境是,就标记这个变量为“进入环境”。从逻辑上讲,永远不能释放进入环境的变量所占用的内存,因为只要执行流进入相应的环境,就可能会用到他们。当变量离开环境时,则将其标记为“离开环境”。
垃圾收集器在运行的时候会给存储在内存中的所有变量都加上标记。然后,它会去掉环境中的变量以及被环境中的变量引用的标记。而在此之后再被加上标记的变量将被视为准备删除的变量,原因是环境中的变量已经无法访问到这些变量了。最后。垃圾收集器完成内存清除工作,销毁那些带标记的值,并回收他们所占用的内存空间。
引用计数
另一种不太常见的垃圾回收策略是引用计数。引用计数的含义是跟踪记录每个值被引用的次数。当声明了一个变量并将一个引用类型赋值给该变量时,则这个值的引用次数就是1。相反,如果包含对这个值引用的变量又取得了另外一个值,则这个值的引用次数就减1。当这个引用次数变成0时,则说明没有办法再访问这个值了,因而就可以将其所占的内存空间给收回来。这样,垃圾收集器下次再运行时,它就会释放那些引用次数为0的值所占的内存。
但是用这种方法存在着一个问题,下面来看看代码:
function problem(){
var objA = new Object();
var objB = new Object();
objA.someOtherObject = objB;
objB.anotherObject = objA;
}
在这个例子中,objA和objB通过各自的属性相互引用;也就是说这两个对象的引用次数都是2。在采用引用计数的策略中,由于函数执行之后,这两个对象都离开了作用域,函数执行完成之后,objA和objB还将会继续存在,因为他们的引用次数永远不会是0。这样的相互引用如果说很大量的存在就会导致大量的内存泄露。
我们知道,IE中有一部分对象并不是原生JavaScript对象。例如,其BOM和DOM中的对象就是使用C++以COM(Component Object Model,组件对象)对象的形式实现的,而COM对象的垃圾回收器就是采用的引用计数的策略。因此,即使IE的Javascript引擎使用标记清除的策略来实现的,但JavaScript访问的COM对象依然是基于引用计数的策略的。说白了,只要IE中涉及COM对象,就会存在循环引用的问题。看看下面的这个简单的例子:
var element = document.getElementById("some_element");
var myObj = new Object();
myObj.element = element;
element.someObject = myObj;
上面这个例子中,在一个DOM元素(element)与一个原生JavaScript对象(myObj)之间建立了循环引用。其中,变量myObj有一个名为element的属性指向element;而变量element有一个名为someObject的属性回指到myObj。由于循环引用,即使将例子中的DOM从页面中移除,内存也永远不会回收。
不过上面的问题也不是不能解决,我们可以手动切断他们的循环引用。
myObj.element = null;
element.someObject = null;
管理内存
使用JavaScript编程,我们一般都不需要管内存回收的问题,如果说想要写出高水平的代码还是有点问题值得注意。一个主要问题就是分配给WEB浏览器的可用内存通常比分配给桌面应用程序要少。这样做的目的主要是出自于安全方面的考虑,目的是防止运行JavaScript的网页耗尽全部系统内存导致系统崩溃。内存限制问题不仅会影响给变量分配内存,同时还会影响调用栈以及在一个线程中能够同时执行的语句的数量。
因此,确保占用最少的内存可以让页面获得更好的性能。而优化内存占用的最佳方式,就是执行中的代码只保存必要的数据。一旦数据不在有用,最好通过将其值设置为null来释放其引用——这个做法叫解除引用。这一做法适合于大多数全局变量和局部变量的属性。局部变量会在他们离开执行环境的时候自动被解除引用,下面来看看代码:
function createPerson(name){
var localPerson = new Object();
localPerson.name = name;
return localPerson;
}
var globalPerson = createPerson("Tracy");
globalPerson = null; //手工解除引用
在这个例子中,变量globalPerson取得了createPerson()函数的返回值。在createPerson()函数内部,我们创建了一个对象并将其值赋给局部变量localPerson,然后又为局部变量添加了一个名为name 的属性。最后,当调用这个函数的时候,localPerson以函数值的形式返回并赋值给globalPerson。由于localPerson在createPerson()函数执行完毕后就离开了执行环境,因此无需我们显示地去为他们解除引用。但是对于globalPerson而言,则需要我们不使用它的时候手动为他解除引用。
不过,解除一个值的引用并不意味着自动回收该值所占的内存。解除引用的真正作用是让值脱离执行环境,以便垃圾收集器下次运行时将其回收。
《JavaScript高级程序设计》笔记:变量、作用域和内存问题(四)的更多相关文章
- JavaScript高级程序设计(第三版)第四章 变量,作用域和内存问题
JavaScript变量可以用来保存两种类型的值:基本类型值和引用类型值.基本类型值和引用类型值具有以下特点: 基本类型值在内存中占据固定大小的空间,因此被保存在栈内存中: 从一个变量向另一个变量复制 ...
- 《JavaScript高级程序设计》 -- 变量、作用域和内存问题(二)
1.基本类型与引用类型 基本类型:值保存在变量中 (Number.String.Boolean.Undefined.Null).在内存中占据固定大小空间,被保存在栈内存中 引用类型:值是保存在内存中的 ...
- JavaScript高级程序设计(第3版) 第四章(变量、作用域和内存问题)
4.1 基本类型和引用类型的值 1.基本类型的值是(简单的数据段),引用类型的值是(保存在内存中的对象). 基本类型的值在内存中占据固定大小的空间,因此被保存在栈中.(lifo ...
- JavaScript高级程序设计-(3) 变量、作用域和内存问题
传递参数 ECMAScript所有函数参数都是按值传递的,即使对象在函数内部修改了参数的值,原始的引用任然不变,局部对象在函数执行完毕后被销毁
- 读javascript高级程序设计02-变量作用域
一. 延长作用域链 有些语句可以在作用域前端临时增加一个变量对象,该变量对象在代码执行完成后会被移除. ①with语句延长作用域. function buildUrl(){ var qs=" ...
- javascript高级程序设计--笔记01
概述 JavaScript的实现包含三个部分: 1 核心(ECMAScript) 提供核心语言功能 2 文档对象模型(DOM) 一套提供了访问以及操作网页内容的API 3 浏览器对象模型( ...
- JavaScript高级程序设计笔记(一)
---恢复内容开始--- 前三章为基础知识,为了方便以后查看,所以比较啰嗦.这里对函数的基本操作没有记录. 1.JavaScript的实现 虽然 JavaScript 和 ECMAScript 通常都 ...
- JavaScript高级程序设计笔记 事件冒泡和事件捕获
1.事件冒泡 要理解事件冒泡,就得先知道事件流.事件流描述的是从页面接收事件的顺序,比如如下的代码: <body> <div> click me! </div> & ...
- JavaScript高级程序设计笔记之面向对象
说起面向对象,大部分程序员首先会想到 类 .通过类可以创建许多具有共同属性以及方法的实例或者说对象.但是JavaScript并没有类的概念,而且在JavaScript中几乎一切皆对象,问题来了,Jav ...
- Javascript高级程序设计笔记(很重要尤其是对象的设计模式与继承)
var obj = {'a':'a'}; var fun = function (){} console.log(typeof obj);//object console.log(typeof fun ...
随机推荐
- Mycat入门
1. Mycat入门 官网 http://www.mycat.io/ 1.1. 什么是Mycat 一个彻底开源的,面向企业应用开发的大数据库集群 支持事务.ACID.可以替代MySQL的加强版数据库 ...
- Spring理解IOC,DI,AOP作用,概念,理解。
IOC控制反转:创建实例对象的控制权从代码转换到Spring容器.实际就是在xml中配置.配置对象 实例化对象时,进行强转为自定义类型.默认返回类型是Object强类型. ApplicationCon ...
- 埃航和737MAX坠毁:软件优先级问题
事件背景: 2019年3月10日,埃塞俄比亚航空公司一架波音737MAX8飞机发生坠机,机上157人全部遇难,包括8名中国公民.这是继去年10月29日印尼狮航空难事故之后,波音737MAX8飞机在五个 ...
- Web存储及文件拖拽
存储 实现内容的永久保存(localStorage) 保存: localStorage.自定义键名="123"; 获取: //判断是否有内容 if(localStorage.自定义 ...
- [原创]K8Cscan插件之端口扫描C#源码
[原创]K8 Cscan 大型内网渗透自定义扫描器 https://www.cnblogs.com/k8gege/p/10519321.html Cscan简介:何为自定义扫描器?其实也是插件化,但C ...
- ionic3项目 出现 No provider for ApplicationInitStatus!
出现No provider for ApplicationInitStatus!原因是在app.module.ts文件忘记导入BrowserModule导致的,打开app.module.ts文件添加以 ...
- ionic 热更新 cordova-hot-code-push
cordova-hot-code-push ,Cordova热代码推送插件提供了在应用程序中执行基于Web的内容的自动更新的功能.使用此插件可以更新存储在项目的www文件夹中的所有内容. cordov ...
- 深入理解Java Stream流水线
前面我们已经学会如何使用Stream API,用起来真的很爽,但简洁的方法下面似乎隐藏着无尽的秘密,如此强大的API是如何实现的呢?Pipeline是怎么执行的,每次方法调用都会导致一次迭代吗?自动并 ...
- 项目中使用sass,如何实现自动编译
本次React项目中用到了Sass,在一个主文件main.scss中引入了其余的scss文件,然后把main.scss文件编译为main.css文件,最后在项目的主文件入口index.html中引入m ...
- java与json,一篇就够了
本示例使用的json包为阿里的fastjson 首先写三个工具类(seter和geter方法省略,自行补上): /** * 屏幕实体类 */ public class Screen { private ...