认识JavaScript中的变量

JavaScript中的变量有两种类型,一种是基本类型、一种是引用类型。

  • 基本数据类型:Defined,Null,Boolean,Number,String。注意String是属于基本数据类型,这不同于其他高级语言。
  • 引用类型即对象,包括内置对象和自定义对象。

需理解的差异

关于复制

对于基本类型的变量,就是我们印象中对于变量的理解。

var a = "TabWeng";
var b = a;
console.log("a:"+a+", b:"+b);
a = "Weng";
console.log("a:"+a+", b:"+b);

运行结果:

a:TabWeng, b:TabWeng
a:Weng, b:TabWeng

我们来看另一个例子:

var a = new Object();
a.name = "TabWeng";
var b = a;
console.log("a'name:"+a.name+", b'name:"+b.name);
a.name = "Weng";
console.log("a'name:"+a.name+", b'name:"+b.name);

运行结果:

a'name:TabWeng, b'name:TabWeng
a'name:Weng, b'name:Weng

这个结果就不同了,我只修改了 a.name 的值,b.name 的值也跟着发生变化,答案只能是它们的值都指向同一个地方,即它们都指向同一块内存,只要内存的值发生变化,因为另一个也指向这个内存,自然就获取了变化后的值。而对于基本类型的变量,也就是我们大家所理解的,在复制后就开辟新的内存进行数据存储,所以两个变量互不干扰。

关于传参

JavaScript的参数传递都是按值传递

基本类型变量很好理解,但是对于引用类型的变量也许存在疑惑,不要紧,你只要理解下面这句话即可:

引用类型变量的传参是按值传递,但是访问引用变量的值时依然是按引用访问同一个对象。

下面举三个例子,对于引用类型,读者需理解透彻。

第一个例子是基本类型变量的传参,第二、三是引用类型变量的传参:

var name = "TabWeng";

function sayFunction(name){
name = "Hi,"+name;
console.log(name);
} sayFunction(name);
console.log(name);

运行结果:

Hi,TabWeng
TabWeng
var Person = new Object();
Person.name = "TabWeng"; function sayFunction(obj){
obj.name = "Hi," + obj.name;
console.log(obj.name);
} sayFunction(Person);
console.log(Person.name);

运行结果:

Hi,TabWeng
Hi,TabWeng

虽然是按值传递,但是在访问的时候是按引用访问同一个对象,所以Person.name也改变了。

var Person = new Object();
Person.name = "TabWeng"; function sayFunction(obj){
obj.name = "Hi," + obj.name;
console.log(obj.name);
obj = new Object();
obj.name = "My name is Tom, I am go to another memory";
console.log(obj.name);
} sayFunction(Person);
console.log(Person.name);

运行结果:

Hi,TabWeng
My name is Tom, I am go to another memory
Hi,TabWeng

这个例子说明了不是按引用传递,否则第三行的结果应该是My name is Tom, I am go to another memory

作用域

作用域链

作用域链很好理解,一句话概括变量在作用域中的访问权限:

外面不能访问里面,里面可以访问外面,在搜索变量时,从里向外搜索。

作用域链是在创建函数的时候产生的,在创建函数的时候,会创建它的执行环境和作用域链,一开始的时候,会创建一个包含全局环境(全局对象)的作用域链,然后把该函数的活动对象推入到作用域链的前端(也就是里面,最下面),如果函数里面还有函数,那么再依次推入,这样就形成一条作用域链。

假设作用域链(实际上是一张列表)里面有三个指针指向三个对象,列表最上面的指针指向全局对象(假设称为obj_1),中间的指针指向活动对象(假设称为obj_2),下面的指针指向最前端的活动对象(假设称为obj_3)。那么,当前的活动对象的变量是无法访问下面指针的活动对象的,即obj_2无法访问obj_3的变量,反之就可以。

延长作用域链

  • try catch
  • with

    以上两者可延长作用域链,把变量放在作用域前端(即当前环境)。

没有块级作用域

for(var i = 0; i < 3; i++){
console.log("in i: "+i);
} console.log("out i:"+i);

运行结果:

in i: 0
in i: 1
in i: 2
out i:3

这与其他高级语言不同。

参考

  • 《JavaScript高级程序设计》

JavaScript变量和作用域的更多相关文章

  1. javascript变量的作用域

    javascript变量的作用域 基本类型和引用类型 基本类型值指的是简单的数据段,而引用类型值指的是那个可能由多个值组成的对象  讲一个值赋值给变量时,javascript解析器首先要确定是基本类型 ...

  2. javascript 函数初探 (三)--- javascript 变量的作用域

    javascript 变量的作用域: 这是一个至关重要的问题.特别是当我们从别的语言转向javascript时,必须要明白一点,即在javascript中,变量的定义并不是以代码块作为作用域的,而是以 ...

  3. 深入理解 JavaScript 变量的作用域和作用域链

    一个变量的作用域(scope)是程序源代码中定义这个变量的区域.简单的说,作用域就是变量与函数的可访问范围.全局变量拥有全局作用域,在JavaScript代码中的任何地方都有定义.局部变量是在函数体内 ...

  4. JavaScript变量的作用域和函数的作用域的区别

    变量作用域和函数作用域都涉及到变量值的变化,本文旨在让大家明白他们之间的区别 变量的作用域: 变量的作用域无非就是两种:全局变量和局部变量. Javascript语言的特殊之处,就在于函数内部可以直接 ...

  5. JavaScript - 变量,作用域,内存

    JavaScript 变量可以用来保存两种类型的值:基本类型值和应用类型值.基本类型的值源自以下5种基本数据类型:Undefined.Null.Bollean.Number和String. 所有变量都 ...

  6. 深入浅出 JavaScript 变量、作用域和内存 v 0.5

    本文主要从原理入手分享变量和作用域的相关知识,最后结合本文所分享知识,再次深入了解下闭包的运行原理. 主要参考<JS高级程序设计> <JS权威指南> <高性能 JS> ...

  7. 【javascript 变量和作用域】

    今天学习了javascript 的变量和作用域的基本知识,对于以前在开发中遇到的一些不懂的小问题也有了系统的认识,收获还是比较多的. [基本类型和引用类型] ECMAScript 变量可能包含两种不同 ...

  8. [从jQuery看JavaScript]-变量与作用域链

    jQuery片段: var // Will speed up references to window, and allows munging its name. window = this, //  ...

  9. [label][JavaScript][The Defined Guide of JavaScript] 变量的作用域

    变量的作用域 一个变量的作用域(scope)是程序中定义这个变量的区域. 全局(global)变量的作用域(scope)是全局性的,即在JavaScript代码中,它处处都有定义.    而在函数之内 ...

随机推荐

  1. 数据存储_SQLite常用的函数

    一.简单说明 1.打开数据库 int sqlite3_open( const char *filename,   // 数据库的文件路径 sqlite3 **ppDb            // 数据 ...

  2. cURL函数

    PHP的cURL函数是通过libcurl库与服务器使用各种类型的协议进行连接和通信的,curl目前支持HTTP GET .HTTP POST .HTTPS认证.FTP上传.HTTP基于表单的上传.co ...

  3. Druid初步学习

    Druid是一个JDBC组件,它包括三部分:  DruidDriver 代理Driver,能够提供基于Filter-Chain模式的插件体系. DruidDataSource 高效可管理的数据库连接池 ...

  4. 脑筋急转弯——Google 面试

    1. 村子里有100对夫妻,其中每个丈夫都瞒着自己的妻子偷情...村里的每个妻子都能立即发现除自己丈夫之外的其他男人是否偷情,唯独不知道她自己的丈夫到底有没有偷情.村里的规矩不容忍通奸.任何一个妻子, ...

  5. JS高级群的日常!写一个从10到0的倒计时,用console.log打印,不可以用 setInterval!本来说好的研究avalonJS最后演变成了看着大神在那边互相比拼实力。。

      JS高级群的日常!写一个从10到0的倒计时,用console.log打印,不可以用 setInterval!本来说好的研究avalonJS最后演变成了看着大神在那边互相比拼实力..   小森执行一 ...

  6. JavaScript事件处理程序

    JavaScript中的事件处理程序主要分为3种: HTML事件处理程序: <script type="text/javascript"> // HTML事件处理程序 ...

  7. h5 hdf5 文件转 tif 流程

    由于需要对h5(hdf5)格式的dem数据进行拼接,但是arcgis不能识别h5的地理参考信息,所以先将h5文件转为带地理参考的tif文件,然后再进行拼接. 工具:arcgis+envi 1.用arc ...

  8. div内填内容

    <div contenteditable="true">可以编辑里面的内容</div> 这样就可以使div想textarea一样 可以加入自动换行与over ...

  9. jquery-创建弹出框原理

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. C# 文件/文件夹重命名

    C# 重命名的方法是MoveTo() 官方文档地址 (https://msdn.microsoft.com/zh-cn/library/system.io.fileinfo.moveto%28VS.8 ...