关闭

JavaScript深入之参数按值传递

时间: 2018-07-16阅读: 1051标签: 参数

在《JavaScript高级程序设计》第三版 4.1.3,讲到传递参数:ECMAscript中所有函数的参数都是按值传递


按值传递

也就是,把函数外部的值复制给函数内部的参数,就和把值从一个变量复制到另一个变量一样

var value = 1;
function foo(v) {
    v = 2;
    console.log(v); //2
}
foo(value);
console.log(value) // 1

当传递value给函数foo的时候,相当于拷贝一份value给foo假设拷贝的那份叫v,函数中修改的都是v,不会一项原来的value值


引用传递

按值传递里面的拷贝虽然好理解 但是当值是一个复杂的数据结构的时候,拷贝就会产生性能问题

所以还有另外的传递方式叫做按引用传递

所谓按引用传递,就是传递对象的引用,函数内部对参数的任何改变都会影响该对象的值,因为两者引用的是同一个对象

var obj = {
      value : 1
    };
    let foo = (o)=> {
      o.value = 2;
      console.log(o.value);
    }
    foo(obj)
    console.log(obj.value);

这里产生了一个疑问?红宝书都说了 ECMAScript 中所有函数的参数都是按值传递的,这怎么能按"引用传递"成功呢?


我们看第三个例子

var obj = {
    value: 1
};
function foo(o) {
    o = 2;
    console.log(o); //2
}
foo(obj);
console.log(obj.value) // 1

如果 JavaScript 采用的是引用传递,外层的值也会被修改呐,这怎么又没被改呢?所以真的不是引用传递吗?

这就要讲到其实还有第三种传递方式,叫按共享传递。而共享传递是指,在传递对象的时候,传递对象的引用的副本。

关键点:

运算符=就是创建或修改变量在内存中的指向.
初始化变量时为创建,重新赋值即为修改.

为了解释上面的共享传递 这里在看一个例子摸清楚内存中的分布

var a = {b: 1};// a = {b: 1}
var c = a;// c = {b: 1}
a = 2;// 重新赋值a
console.log(c);// {b: 1}
  1. 创建变量a指向对象{b:1}
  2. 创建变量c指向对象{b:1}
  3. a又重新指向常量2

但是这时候c依旧指向对象{b:1}

这样我们回头看第一个例子

var value = 1;
function foo() {
    var v = value; // 创建变量v指向value所指向的值
    v = 2;// v重新指向另外的值
    console.log(v); //2
}
foo(value);
console.log(value) // 1,value从始至终都未改变指向.

现在吧第一个例子修改成对象

var a = {b: 1};// a = {b: 1}
var c = a;// c = {b: 1}
a.b = 2;// 重新赋值对象a中的属性b
console.log(c);// {b: 2}
常量区
a,c[object]
b1

执行完a.b = 2后:

常量区
a,c[]object
b2

a,c从始至终都没有改变指向,变的是b而已

现在再看第二个例子

var obj = {
   value: 1
};
function foo() {
   var o = obj;
   o.value = 2;// 变量value改变了指向,而o并未改变
   console.log(o.value); //2
}
foo(obj);
console.log(obj.value) // 2

所以 js始终是按值传递,在这里称他为共享传递。


站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

链接: http://www.fly63.com/article/detial/927

Less参数混合

* 参数可以使用逗号或分号分隔。 (建议使用分号,因为逗号具有双重含义:可以将其解释为mixin参数分隔符或者是css列表分隔符);使用逗号作为mixin分隔符使不可能创建逗号分隔的列表作为参数。

JS的形参与实参

参数是指由外部传入到函数中的变量,仅作为变量使用,但是该变量可以是任何内容,包括函数。被传入的参数作为私有变量使用,可以被覆盖掉。参数排列是严格按照参数的顺序填入的。JavaScript中函数的参数分为形参和实参。

vue-router动态路由设置参数可选

在日常工作中,我们需要将匹配到的所有路由,映射到一个组件上。如下代码想要达到的效果:不传page和id,则映射到user默认list页面,传page和id,根据page不同,显示不同的页面

JavaScript 中的默认参数

在 ES6 中,JS引入了默认函数参数。如果未向函数调用提供实参,则允许开发人员用默认值初始化函数。以这种方式初始化函数参数将使函数更容易阅读,更不易出错,并为函数提供默认行为

用正则表达式获取URL中的查询参数

url中的所有查询参数可以通过 window.location.search 字段获取,以字符串的形式返回。并有固定的格式 ?param1=value1&param2=value2···,所以可以正则表达式匹配。分析下需要匹配的格式:

JavaScript参数传递中值和引用的一种理解

值(value)和引用(reference)是各种编程语言老生常谈的话题,js也不例外。我将剖析一个例子的实际运行过程,跟大家分享我对js参数传递中的值和引用的理解。

目前为止全网最全的 SpringBoot 参数传递方案

开发这么多年,肯定还有不少小伙伴搞不清各种类型的参数是如何传递的,很多同学都是拿来即用,复制粘贴一把撸,遇到问题还是一脸懵逼。学习参数传递的正确姿势,先说怎么做,再说为什么

用js获取url地址协议,参数,端口号,锚点等方法总汇

在前端开发中,经常会遇到获取URL的相关数据,下面将总结下使用JavaScript来获取url地址的协议,参数,端口号,锚点等方法。

URLSearchParams_js中快速构造和获取URL查询参数的方法

URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串。URLSearchParams()是个构造函数,将返回一个可以操作查询字符串的对象。

Vue页面传参方式Query和Params

query需要和配合 path 属性使用,携带参数会拼接在请求路径后,效果同 Get 请求方式;params需要配合 name 属性使用,参数不会携带在访问路径后

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!