这篇文章主要为大家介绍了 JavaScript 对象参数的引用传递的相关资料,感兴趣的小伙伴们可以参考一下
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
今天碰到一个问题,怎样把参数变更影响到函数外部,如:
- <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() 中递归调用来实现。
来源: http://www.phperz.com/article/17/0216/267573.html