JavaScript对象参数的引用传递_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程序设计有所帮助。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索javascript
, 引用传递
对象参数
javascript 引用传递、javascript 传递对象、javascript 对象引用、js对象引用传递、java对象引用传递,以便于您获取更多的相关知识。

时间: 2024-11-27 23:34:07

JavaScript对象参数的引用传递_javascript技巧的相关文章

浅谈JavaScript 函数参数传递到底是值传递还是引用传递_javascript技巧

在传统的观念里,都认为JavaScript函数传递的是引用传递(也称之为指针传递),也有人认为是值传递和引用传递都具备.那么JS的参数传递到底是怎么回事呢?事实上以下的演示也完全可以用于Java 首先来一个比较简单的,基本类型的传递: function add(num){ num+=10; return num; } num=10; alert(add(num)); aelrt(num); //输出20,10 对于这里的输出20,10,按照JS的官方解释就是在基本类型参数传递的时候,做了一件复制

JavaScript 对象深入学习总结(经典)_javascript技巧

一.概述 对象是一种复合值,它将很多值(原始值或其他对象)聚合在一起,可通过属性名访问这些值.而属性名可以是包含空字符串在内的任意字符串. JavaScript对象也可以称作一种数据结构,正如我们经常听说的"散列(hash)"."散列表(hashtable)"."字典 (dictionary)"."关联数组(associative array)". JavaScript中对象可以分为三类: ①内置对象,例如数组.函数.日期等:

JavaScript中的this引用(推荐)_javascript技巧

this this是javascript的一个关键字,随着函数使用场合不同,this的值会发生变化.但是总有一个原则,那就是this指的是调用函数的那个对象. 一.定义 1.this是函数内部的一个特殊对象(或this引用)--它引用的是函数据以执行的环境对象. 2.this引用是一种在JavaScript的代码中随时都可以使用的只读变量. this引用 引用(指向)的是一个对象,它有着会根据代码上下文语境自动改变其引用对象的特性.它的引用规则如下: • 在最外层代码中,this引用 引用的是全

JavaScript对象创建模式实例汇总_javascript技巧

本文实例总结了JavaScript对象创建模式.分享给大家供大家参考,具体如下: 在JavaScript中创建对象是很容易的,可以使用对象字面量或者构造函数.常用的创建对象的模式有以下几种: 一. 工厂模式 工厂模式抽象了具体对象的过程,用函数来封装以特ing接口创建对象的细节. 如下: function createAnimal(name, age) { var o = new Object(); o.name = name; o.age = age; o.sayName = function

javascript对象的创建和访问_javascript技巧

JavaScript,很少能让人想到它面向对象的特性,甚至有人说它不是面向对象的语言,因为它没有类.没错, JavaScript 真的没有类,但 JavaScript 是面向对象的语言. JavaScript 只有对象,对象就是对象,不是类的实例. 因为绝大多数面向对象语言中的对象都是基于类的,所以经常有人混淆类的实例与对象的概念.对象就是类的实例,这在大多数语言中都没错,但在 JavaScript 中却不适用.JavaScript 中的对象是基于原型的. 创建和访问 JavaScript 中的

JavaScript对象之深度克隆介绍_javascript技巧

也不知道从什么时候开始,前端圈冒出了个新词:对象深度克隆.看起来好像很高大上的样子,实际上并不新鲜,在我们的实际项目开发中,你可能早已用到,只不过由于汉字的博大精深,有些原本很简单的事物被一些看似专业的词汇稍加修饰,就变得神秘起来了. 首先为什么要将一个对象进行深克隆?请允许我进行一个猜测:你有时一定会认为js的内置对象document太长,那么你可能会这样做: 复制代码 代码如下: var d = document; d.by = function(id){     return d.getE

JavaScript—之对象参数的引用传递

变量   1.JavaScript hoisting   >>请看例子,我们拿Chrome的console作为JS的运行环境. 上面直接执行console.log(a), 不带一点悬念地抛出了not defined 错误.这是预料之中的. 看下面进化后的代码: 之前变量没有定义的错误没了,取而代之的是告诉我们a的值是 'undefined'.先不管a的值缘何为 'undefined' 了,至少可以知道现a这个变量是定义了,因为之前报的' a is not defined'的错误没有了. 这正是

JavaScript传递变量: 值传递?引用传递?_javascript技巧

当变量A赋值给变量B时,会将栈中的值复制一份到为新变量分配的空间中. 如何理解? 复制代码 代码如下: var x = y = 1; y = 2; alert(x); x的值为多少? 复制代码 代码如下: var obj = {}; var sub = {}; sub['id'] = 3; obj['sub'] = sub; sub['id'] = 4; alert(obj['sub']['id']); obj['sub']['id']的值又为多少?他们真的符合你的预期吗? 我们分别运行2段代码

深入浅析JavaScript中数据共享和数据传递_javascript技巧

数据共享和数据传递是相辅相成的,我们一起来讨论这个问题.首先要说的是共享和传递都是有作用域的.作用域就是起作用的区域,在同一个作用域数据可以共享,超过这个作用域就是跨作用域,就得用到数据传递了. 作用域 1.ui作用域 每一个ui文件缺省都有对应的ui.js.他们作为一个闭合的作用域.ui.js里根据ui文件里组件的id来获取ui对象;不同的ui文件可以定义相同id的组件.在ui.js里定义的变量只能在这个js里访问. 2.page作用域 每次调用openPage都会打开一个新的page,这个新