javascript的变量、传值、传址、参数之间关系


Posted in Javascript onJuly 26, 2015

先把收获晾一下:

1.javascrip变量包含两种类型的值,一种为引用类型的值,一种是基本类型的值。引用类型包括:Array,Object,Function(可以这么理解,非基本类型的都是引用类型);5种基本类型包括:undefined,null,string,boolean,number

2.函数的参数的传递的机制是复制变量值。

书上说:”把函数外部的值复制给函数内部的参数,就和把值从一个变量复制给另一个变量一样。基本类型的传递如同基本类型变量的复制一样,而引用类型的则如同引用类型变量的复制一样。“ 

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

【注意:复制引用类型的值,才是传址】

3.参数实际上是函数的局部变量。

----------------------------------------------------------------------------

基本概念的解释:

传值:把A的数值传到B,改变B,A不会跟着变,B存的是跟A一样的值;
传址:把A的地址传到B,改变B,A同时跟着变,B存的只是A的地址(类似电脑的快捷方式)。

一个具有值类型(value type)的数据存放在栈内的一个变量中。即是在栈中分配内存空间,直接存储所包含的值,其值就代表数据本身。值类型的数据具有较快的存取速度。

一个具有引用类型(reference type)的数据并不驻留在栈中,而是存储于堆中。即是在堆中分配内存空间,不直接存储所包含的值,而是指向所要存储的值,其值代表的是所指向的地址。当访问一个具有引用类型的数据时,需要到栈中检查变量的内容,该变量引用堆中的一个实际数据。引用类型的数据比值类型的数据具有更大的存储规模和较低的访问速度。

----------------------------------------------------------------------------

下面是三个问题。

【问题1】:为什么change(a)函数执行完之后,外面的a没有受干扰呢?

<script>
var a = [1, 2, 3];
function change(a) {
 console.log(a);//[1,2,3]
 a = 2;   //传值
 console.log(a);//2
}
change(a);
console.log(a);  //[1,2,3] 
</script>

问题1解答:因为change(a)的执行过程是这样的,首先将对象a(数组)传入到change以后,被复制给change的参数a。而后a=2是一个赋值语句,变成传值。此时a=2是值类型,并不涉及引用地址的问题。所以并没有影响外部的a。

【问题2】:为什么change(a)函数执行完之后,外面的a受到干扰呢?

<script>
 var a = [1, 2, 3];
 function change() { 
  a = 2;//传值
 }
 change();
 console.log(a);  //2 
</script>

 问题2解答:当执行change()的时候,函数在自己的执行环境中找寻作用域链,活动对象(activation object)并不包含变量a,于是沿着作用域链向上找,找到全局执行环境,发现变量a,于是此时函数内部的a和外部a在内存上是同一个地址,自然函数内部a变了,外部也会跟着变。

解析:问题2和问题1的区别在于,问题2并没有引入参数,所以不涉及复制变量的事情。

【问题3】:为什么change(a)函数执行完之后,外面的a受到干扰呢?

<script>
 var a = [1, 2, 3];
 function change(b) { 
  b[0] = 2;
 }
 change(a);
 console.log(a);  //[2,2,3]
</script>

问题3解答:这个和问题1非常类似,唯独不一样的就是a=2,换成了b[0]=2,我一开始也很疑惑,不说复制吗?参数b应该是个复制值,怎么会影响到外面的a呢?

的确,change函数执行时,参数b是a的复制值。因为a是引用类型,所以在函数内部是b和a按引用来访问的是一个地址的对象。b[0]=2的出现,并不影响在函数内部b和a引用的是同一个对象。

【问题4】:为什么change(a)函数执行完之后,外面的a没有受到干扰呢?

var a = [1, 2, 3];
 function change(b) { 
  console.log(b);//[1,2,3]
  b=2;
  b[0] = 2;
 }
 change(a);
 console.log(a);  //[1,2,3]

 问题4解答:change(b)执行过程是这样的,a对象传入change函数,将值和地址复制给b。b=2这句,此时b变成值类型了,并不涉及地址引用的问题,之后b[0]=2这句实际上毫无意义,因为此时b已经不是数组了,自然不具有b[0]这样的索引方式。所以b与a的地址引用关系其实在b=2之后就消失了。此时外界的a仍然是[1,2,3];

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
javascript中call和apply方法浅谈
Sep 27 Javascript
Javascript简单实现可拖动的div
Oct 22 Javascript
JavaScript中使用document.write向页面输出内容实例
Oct 16 Javascript
JS跨域交互(jQuery+php)之jsonp使用心得
Jul 01 Javascript
Vue.js之slot深度复制详解
Mar 10 Javascript
input file样式修改以及图片预览删除功能详细概括(推荐)
Aug 17 Javascript
vue-router 路由基础的详解
Oct 17 Javascript
javascript实现弹幕墙效果
Nov 28 Javascript
javascript实现计算器功能
Mar 30 Javascript
vue总线机制(bus)知识点详解
May 10 Javascript
electron踩坑之dialog中的callback解决
Oct 06 Javascript
vue router-link 默认a标签去除下划线的实现
Nov 06 Javascript
javascript实现动态导入js与css等静态资源文件的方法
Jul 25 #Javascript
javascript创建动态表单的方法
Jul 25 #Javascript
javascript文件加载管理简单实现方法
Jul 25 #Javascript
javascript页面倒计时实例
Jul 25 #Javascript
javascript解析xml实现省市县三级联动的方法
Jul 25 #Javascript
基于javascript实现单选及多选的向右和向左移动实例
Jul 25 #Javascript
javascript实现信息增删改查的方法
Jul 25 #Javascript
You might like
PHP实现今天是星期几的几种写法
2013/09/26 PHP
PHP 5.5 创建和验证哈希最简单的方法详解
2013/11/07 PHP
php阿拉伯数字转中文人民币大写
2015/12/21 PHP
Symfony2学习笔记之插件格式分析
2016/03/17 PHP
更换select下拉菜单背景样式的实现代码
2011/12/20 Javascript
js函数返回多个返回值的示例代码
2013/11/05 Javascript
js截取小数点后几位的写法
2013/11/14 Javascript
使用Meteor配合Node.js编写实时聊天应用的范例
2015/06/23 Javascript
JavaScript继承学习笔记【新手必看】
2016/05/10 Javascript
JS修改地址栏参数实例代码
2016/06/14 Javascript
JS简单判断函数是否存在的方法
2017/02/13 Javascript
通过 JS 判断页面是否有滚动条的实现方法
2018/04/05 Javascript
js数据类型检测总结
2018/08/05 Javascript
微信小程序如何实现在线客服功能
2019/10/16 Javascript
Electron实现应用打包、自动升级过程解析
2020/07/07 Javascript
[01:07:53]RNG vs VG 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
Python及PyCharm下载与安装教程
2017/11/18 Python
详解Django-restframework 之频率源码分析
2019/02/27 Python
python使用tomorrow实现多线程的例子
2019/07/20 Python
Python3标准库之threading进程中管理并发操作方法
2020/03/30 Python
在python中使用nohup命令说明
2020/04/16 Python
python如何绘制疫情图
2020/09/16 Python
python3实现简单飞机大战
2020/11/29 Python
详解CSS 3 中的 calc() 方法
2018/01/12 HTML / CSS
html5 svg 中元素点击事件添加方法
2013/01/16 HTML / CSS
中东奢侈品市场:Coveti
2019/05/12 全球购物
机械专业个人求职自荐信格式
2013/09/21 职场文书
英语道歉信范文
2014/01/09 职场文书
运动会广播稿200米
2014/01/27 职场文书
大学生暑期实践感言
2014/02/26 职场文书
农业局学习党的群众路线教育实践活动心得体会
2014/03/07 职场文书
保密工作责任书
2014/04/16 职场文书
卖车协议书
2014/04/21 职场文书
2015年度个人工作总结报告
2015/10/24 职场文书
优秀团员主要事迹材料
2015/11/05 职场文书
Mysql效率优化定位较低sql的两种方式
2021/05/26 MySQL