JavaScript对象参数的引用传递
作者:bea
今天碰到一个问题,怎样把参数变更影响到函数外部,如: <script> var myname = "wood"; A(myname); document.write(myname); function A(n) { n = "Yao"; }</script> 输出结果还是wood,说明当myname传入A函数后,在函数体内,相当于有一个myname的副本,这个副本的值等于myname,之后在函数体内对其做的操作是在这个副本上进行的
今天碰到一个问题,怎样把参数变更影响到函数外部,如:
<script>
var myname = "wood";
A(myname);
document.write(myname);
function A(n) {
n = "Yao";
}
</script>
输出结果还是wood,说明当myname传入A函数后,在函数体内,相当于有一个myname的副本,这个副本的值等于myname,之后在函数体内对其做的操作是在这个副本上进行的。
但情况有所不同,当传入的参数是 数组 、 对象 时,在函数体内对参数所做的更改会反映到原变量上。
<script>
var myname = ["wood"];
A(myname);
document.write(myname[0]);
function A(n) {
n[0] = "Yao";
}
</script>
可以看出,上面代码中已经把friut数组的第一个元素更改了。
下面是关于对象的例子:
<script>
var myname = {name1:"wood"};
A(myname);
document.write(myname.name1);
function A(n) {
n.name1 = "Yao";
}
</script>
可以很明显地看到函数体内对参数的改动影响到了原来的变量,这与通常情况下的传参有质的区别了。需要特别注意。
But,当在函数体内对传入的数组或对象赋值时,这个更改不会反映到函数体外的原变量身上!
请看:
<script>
var myname = {name1:"wood"};
A(myname);
document.write(myname.name1);
function A(n) {
n = {name1:"Yao"};
}
</script>
按照上面函数内部的更改会反映到原变量的理论,你肯定觉得执行完A()后myname变量的name1属性的值已经变成'Yao'了吧。但结果让人有点难以接受。
原因在于,当在函数体内使用赋值操作时,系统就创建了一个变量名为p的变量。这个p是函数内部的变量,对它进行赋值当然只在函数体内起作用,外面的myname还是原来的myname。
这一步与原来代码的操作差别仅在于在 函数体内是对参数赋新值呢还是对参数的属性或数组的元素进行更改 。
下面我们用传递对象的方式,重新实现一个时钟数字格式化输出的例子:
<script>
var mytime = self.setInterval(function() {
getTime();
}, 1000);
//alert("ok");
function getTime() {
var timer = new Date();
var t = {
h: timer.getHours(),
m: timer.getMinutes(),
s: timer.getSeconds()
}
//将时间对象t,传入函数checkTime(),直接在checkTime()中改变对象中的值。
//而无需再去接收返回值再赋值
checkTime(t);
document.getElementById("timer").innerHTML = t.h + ":" + t.m + ":" + t.s;
}
function checkTime(i) {
if (i.h < 10) {
i.h = "0" + i.h;
}
if (i.m < 10) {
i.m = "0" + i.m;
}
if (i.s < 10) {
i.s = "0" + i.s;
}
}
</script>
例子使用setInterval()函数定时调用刷新事件,也可以用setTimeout()在getTime()中递归调用来实现。
以上就是本文的全部内容,希望对大家学习javascript程序设计有所帮助。
有用 | 无用
<script>
var myname = "wood";
A(myname);
document.write(myname);
function A(n) {
n = "Yao";
}
</script>
输出结果还是wood,说明当myname传入A函数后,在函数体内,相当于有一个myname的副本,这个副本的值等于myname,之后在函数体内对其做的操作是在这个副本上进行的。
但情况有所不同,当传入的参数是 数组 、 对象 时,在函数体内对参数所做的更改会反映到原变量上。
<script>
var myname = ["wood"];
A(myname);
document.write(myname[0]);
function A(n) {
n[0] = "Yao";
}
</script>
可以看出,上面代码中已经把friut数组的第一个元素更改了。
下面是关于对象的例子:
<script>
var myname = {name1:"wood"};
A(myname);
document.write(myname.name1);
function A(n) {
n.name1 = "Yao";
}
</script>
可以很明显地看到函数体内对参数的改动影响到了原来的变量,这与通常情况下的传参有质的区别了。需要特别注意。
But,当在函数体内对传入的数组或对象赋值时,这个更改不会反映到函数体外的原变量身上!
请看:
<script>
var myname = {name1:"wood"};
A(myname);
document.write(myname.name1);
function A(n) {
n = {name1:"Yao"};
}
</script>
按照上面函数内部的更改会反映到原变量的理论,你肯定觉得执行完A()后myname变量的name1属性的值已经变成'Yao'了吧。但结果让人有点难以接受。
原因在于,当在函数体内使用赋值操作时,系统就创建了一个变量名为p的变量。这个p是函数内部的变量,对它进行赋值当然只在函数体内起作用,外面的myname还是原来的myname。
这一步与原来代码的操作差别仅在于在 函数体内是对参数赋新值呢还是对参数的属性或数组的元素进行更改 。
下面我们用传递对象的方式,重新实现一个时钟数字格式化输出的例子:
<script>
var mytime = self.setInterval(function() {
getTime();
}, 1000);
//alert("ok");
function getTime() {
var timer = new Date();
var t = {
h: timer.getHours(),
m: timer.getMinutes(),
s: timer.getSeconds()
}
//将时间对象t,传入函数checkTime(),直接在checkTime()中改变对象中的值。
//而无需再去接收返回值再赋值
checkTime(t);
document.getElementById("timer").innerHTML = t.h + ":" + t.m + ":" + t.s;
}
function checkTime(i) {
if (i.h < 10) {
i.h = "0" + i.h;
}
if (i.m < 10) {
i.m = "0" + i.m;
}
if (i.s < 10) {
i.s = "0" + i.s;
}
}
</script>
例子使用setInterval()函数定时调用刷新事件,也可以用setTimeout()在getTime()中递归调用来实现。
以上就是本文的全部内容,希望对大家学习javascript程序设计有所帮助。
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- 轻松实现jquery手风琴效果
- jQuery取得iframe中元素的常用方法详解
- js实现prototype扩展的方法(字符串,日期,数组扩展)
- 分享网页检测摇一摇实例代码
- jquery淡入淡出效果简单实例
- jQuery实现的左右移动焦点图效果
- 详解JavaScript中的构造器Constructor模式
- 实例详解Nodejs 保存 payload 发送过来的文件
- jquery+json实现动态商品内容展示的方法
- jQuery遮罩层效果实例分析
- JavaScript面向对象之私有静态变量实例分析
- 浏览器环境下JavaScript脚本加载与执行探析之defer与async特性
- js实现input密码框提示信息的方法(附html5实现方法)
- jQuery div拖拽用法实例
- javascript检测flash插件是否被禁用的方法
- 分享jQuery插件的学习笔记
- jQuery时间插件jquery.clock.js用法实例(5个示例)
- Jquery easyui开启行编辑模式增删改操作
- JavaScript基本语法学习教程