前言:

JavaScript 的变量与其他语言的变量有很大区别。JavaScript 变量松散类型的本质,决定了它只是在特定时间用于保存特定值的一个名字而已。由于不存在定义某个变量必须要保存何种数据类型值的规则,变量的值及其数据类型可以在脚本的生命周期内改变。尽管从某种角度看,这可能是一个既有趣又强大,同时又容易出问题的特性,但 JavaScript 变量实际的复杂程度还远不止如此

目录

基本类型和引用类型的值

ECMAScript 变量可能包含两种不同数据类型的值:基本类型值引用类型值。基本类型值指的是简单的数据段,而引用类型值指那些可能由多个值构成的对象。

在将一个值赋给变量时,解析器必须确定这个值是基本类型值还是引用类型值。目前有 7 种基本数据类型:Undefined、Null、Boolean、Number 、 String、symbol和bigint。这 7 种基本数据类型是按值访问的,因为可以操作保存在变量中的实际的值。

引用类型的值是保存在内存中的对象。与其他语言不同,JavaScript 不允许直接访问内存中的位置,也就是说不能直接操作对象的内存空间。在操作对象时,实际上是在操作对象的引用而不是实际的对象。为此,引用类型的值是按引用访问的

(这种说法不严密,当复制保存着对象的某个变量时,操作的是对象的引用。但在为对象添加属性时,操作的是实际的对象。——图灵社区“壮壮的前端之路”注)。

复制变量值

在从一个变量向另一个变量复制基本类型值引用类型值时,也存在不同。如果从一个变量向另一个变量复制基本类型的值,会在变量对象上创建一个新值,然后把该值复制到为新变量分配的位置上。来看一个例子:

var num1 = 5;
var num2 = num1;

当从一个变量向另一个变量复制引用类型的值时,同样也会将存储在变量对象中的值复制一份放到为新变量分配的空间中。不同的是,这个值的副本实际上是一个指针,而这个指针指向存储在堆中的一个对象。复制操作结束后,两个变量实际上将引用同一个对象。因此,改变其中一个变量,就会影响另一个变量,如下面的例子所示:

var obj1 = new Object();
var obj2 = obj1;
obj1.name = "Nicholas";
alert(obj2.name); //"Nicholas"

传递参数

ECMAScript 中所有函数的参数都是按值传递的也就是说,把函数外部的值复制给函数内部的参数,就和把值从一个变量复制到另一个变量一样。基本类型值的传递如同基本类型变量的复制一样,而引用类型值的传递,则如同引用类型变量的复制一样。有不少开发人员在这一点上可能会感到困惑,因为访问变量有按值和按引用两种方式,而参数只能按值传递。

在向参数传递基本类型的值时,被传递的值会被复制给一个局部变量(即命名参数,或者用ECMAScript 的概念来说,就是 arguments 对象中的一个元素)。在向参数传递引用类型的值时,会把这个值在内存中的地址复制给一个局部变量,因此这个局部变量的变化会反映在函数的外部。

//例子1 基本数据类型作为参数

function addTen(num) {
num += 10;
return num;
}
var count = 20;
var result = addTen(count);
alert(count); //20,没有变化
alert(result); //30 //例子2 引用类型作为参数
function setName(obj) {
obj.name = "Nicholas";
}
var person = new Object();
setName(person);
alert(person.name); //"Nicholas"

可能有人错误地认为:在局部作用域中修改的对象会在全局作用域中反映出来,就说明参数是按引用传递的。为了证明对象是按值传递的,我们再看一看下面这个经过修改的例子:

//例子1 参数按值传递
function setName(obj) {
obj.name = "Nicholas";
obj = new Object();
obj.name = "Greg";
}
var person = new Object();
setName(person);
alert(person.name); //"Nicholas"

这说明即使在函数内部修改了参数的值,但原始的引用仍然保持未变。实际上,当在函数内部重写 obj 时,这个变量引用的就是一个局部对象了。而这个局部对象会在函数执行完毕后立即被销毁。

检测类型

要检测一个变量是不是基本数据类型?第 3 章介绍的 typeof 操作符是最佳的工具。说得更具体一点,typeof 操作符是确定一个变量是字符串、数值、布尔值,还是 undefined 的最佳工具。如果变量的值是一个对象或 null,则 typeof 操作符会像下面例子中所示的那样返回"object":

var s = "Nicholas";
var b = true;
var i = 22;
var u;
var n = null;
var o = new Object();
alert(typeof s); //string
alert(typeof i); //number
alert(typeof b); //boolean
alert(typeof u); //undefined
alert(typeof n); //object
alert(typeof o); //object

通常,我们并不是想知道某个值是对象,而是想知道它是什么类型的对象(包含普通对象Object,数组对象Array,正则对象RegExp,日期对象Date,数学函数Math,函数对象Function)。为此,ECMAScript提供了instanceof 操作符,其语法如下所示:

result = variable instanceof constructor

alert(person instanceof Object); // 变量 person 是 Object 吗?
alert(colors instanceof Array); // 变量 colors 是 Array 吗?
alert(pattern instanceof RegExp); // 变量 pattern 是 RegExp 吗?

根据规定,所有引用类型的值都是 Object 的实例。因此,在检测一个引用类型值和 Object 构造函数时,instanceof 操作符始终会返回 true。当然,如果使用 instanceof 操作符检测基本类型的值,则该操作符始终会返回 false,因为基本类型不是对象。

参考书籍 JavaScript高级程序设计

重温JavaScript基础(一) 基本类型和引用类型的值

重温JavaScript基础(二) 执行环境以及作用域链

重温JavaScript基础(三) 执行环境以及作用域链

基本类型和引用类型的值 [重温JavaScript基础(一)]的更多相关文章

  1. 4.1 基本类型和引用类型的值【JavaScript高级程序设计第三版】

    ECMAScript 变量可能包含两种不同数据类型的值:基本类型值和引用类型值.基本类型值指的是简单的数据段,而引用类型值指那些可能由多个值构成的对象. 在将一个值赋给变量时,解析器必须确定这个值是基 ...

  2. 《JavaScript高级程序设计》读书笔记 ---基本类型和引用类型的值

    变量.作用域和内存问题 基本类型和引用类型的值ECMAScript 变量可能包含两种不同数据类型的值:基本类型值和引用类型值.基本类型值指的是简单的数据段,而引用类型值指那些可能由多个值构成的对象.在 ...

  3. JS基本类型和引用类型的值

    JS中可以把变量分成两部分,基本类型和引用类型. 基本类型比较简单,包括:Undefined.Null.Boolean.Number和String,基本类型值就是简单的数据段:引用类型值可能由多个值构 ...

  4. 【Java】基本类型和引用类型(值传递)

    [关键词] [问题] · 加深对基本类型和引用类型的理解: [效果图] [分析] 參见最后的[參考资料] [解决方式] [代码] public void test() throws Exception ...

  5. JavaScript 深入了解基本类型和引用类型的值

    转载:https://segmentfault.com/a/1190000006752076 一个变量可以存放两种类型的值,基本类型的值(primitive values)和引用类型的值(refere ...

  6. Javascript高级程序设计——基本类型和引用类型的值

    ECMAScript中的变量有两种不同的数据类型的值: 基本类型:基本类型的值是简单的数据段.包括:Undefined.Null.Number.Boolean.String五种 引用类型:引用类型的值 ...

  7. 《JS高程》基本类型和引用类型的值学习笔记

    ECMAScript 变量可能包含两种不同数据类型的值:基本类型值和引用类型值. 创建方式类似:创建一个变量并为其赋值. (1)基本类型值和引用类型值比较 基本类型值 引用类型值 简单的数据段 可能由 ...

  8. 【JavaScript】基本类型和引用类型的值、引用类型

    一.前言        接着上一篇继续记笔记 二.内容         动态的属性 var person = new Object(); person.name = "Nicholas&qu ...

  9. javascript变量中基本类型和引用类型的详解解读

    前言: Javascript语言中的变量和其他语言的变量有很大区别,javascript松散类型的本质,决定了它只是在特定时间时间保存特定值得名字而已.由于不存在定义某个变量必须保存何种数据类型值的规 ...

随机推荐

  1. G. Petya and Graph(经典项目与项目消耗问题)(网络流)

    题:https://codeforces.com/contest/1082/problem/G 题意:给定有边权和点权的图,问你选一些边,然sum边-sum点最大(点权被多次用为公共点只会减一次) 分 ...

  2. 一篇文章带你了解axios网络交互-Vue

    来源:滁州SEO 1 **什么是axios呢?**了解,并去使用它,对于axios发送请求的两种方式有何了解,以及涉及axios跨域问题如何解决. 对于axios网络交互,去使用axios的同时,首先 ...

  3. Opencv笔记(十三)——图像的梯度

    目标 认识图像梯度.边界 学习函数cv2.Sobel(),cv2.Schar(),cv2.Laplacian() 原理 图像梯度可以把图像看成二维离散函数,图像梯度其实就是这个二维离散函数的求导.Op ...

  4. VS IDE调试下将打印日志输出到输出窗口

    int aBeginTime = GetTickCount(); TRACE("Current time begin:%d \n", aBeginTime); 查看输出窗口:

  5. [CTS2019]珍珠(NTT+生成函数+组合计数+容斥)

    这题72分做法挺显然的(也是我VP的分): 对于n,D<=5000的数据,可以记录f[i][j]表示到第i次随机有j个数字未匹配的方案,直接O(nD)的DP转移即可. 对于D<=300的数 ...

  6. idea 为模块添加Tomcat依赖 解决: Intelij IDEA 创建WEB项目时没有Servlet的jar包

    解决: Intelij IDEA 创建WEB项目时没有Servlet的jar包 今天创建SpringMVC项目时 用到HttpServletRequest时, 发现项目中根本没有Servlet这个包, ...

  7. 吴裕雄--天生自然 JAVA开发学习:Applet 基础

    import java.applet.*; import java.awt.*; public class HelloWorldApplet extends Applet { public void ...

  8. jQuery性能优化与技巧

    1.使用最新版本的jQuery类库 jQuery的每一个新的版本都会较上一版进行Bug修复和一些优化,同时也会包含一些创新,所以建议使用最新版本的jQuery来提高性能,需要注意的是在更换版本之后,要 ...

  9. WEB-文件包含漏洞详解

    title date tags layout 文件包含漏洞(File Include) 2018-10-12 post 产生原因: 由于在编写代码时避免麻烦就需要把公用的一段代码写到一个单独的文件里面 ...

  10. ef codefirst VS里修改数据表结构后更新到数据库

    2.根据已建立table的数据库建立ADO.NET数据模型在修改表后进入 工具->nuget包管理器->程序包管理器控制台 输入  enable-migrations   后vs会添加一个 ...