要说js的赋值方式时首先要说明js的数值类型:基本类型和引用类型。

1、基本类型

基本的数据类型有:undefined,boolean,number,string,null。 基本类型存放在栈区,访问是按值访问的,就是说你可以操作保存在变量中的实际的值。

当基本类型的数据赋值时,赋得是实际的值,a和b是没有关联关系的,b由a复制得到,相互独立。(字面量的才是基本类型)

var a=10;

var b=a;

console.log(a+','+b);    // 10,10
a++;
console.log(a+','+b)  // 11,10
 

2、引用类型

引用类型指的是对象。可以拥有属性和方法,并且我们可以修改其属性和方法。引用对象存放的方式是:在栈中存放对象变量标示名称和该对象在堆中的存放地址,在堆中存放数据。

对象使用的是引用赋值。当我们把一个对象赋值给一个新的变量时,赋的其实是该对象的在堆中的地址,而不是堆中的数据。也就是两个对象指向的是同一个存储空间,无论哪个对象发生改变,其实都是改变的存储空间的内容,因此,两个对象是联动的。

3、数组是引用类型

我们先来看一个例子:

var a = [1,2,3];

var b = a;

a = [4,5,6];

alert(b); //[1,2,3]

好像数组是基本类型一样。。,但是:

var a = [1,2,3];

var b = a;

a.pop();

alert(b); //[1,2]

这是怎么回事?因为:(知乎解释)

a = [4,5,6];//改变的是a引用本身,没有改变数组对象,a和b没有了关系。
a.pop();//改变的是数组对象,a引用没有改变。
b = a;//该操作后,b直接指向数组对象,不是b指向a,a再指向数组。
//所以改变a引用并不会对b引用造成影响,改变数组对象可以。

作者:Intopass
链接:https://www.zhihu.com/question/26042362/answer/31903017
来源:知乎

这个问题就跟我之前在React todo-list 一篇中提到的问题一样:

var tasks=this.state.data;
  tasks=tasks.filter(function(i){
     return i.index!=taskId;  
 });

由于filter函数是返回一个新的数组,虽然仍然用tasks去接收,但这时候tasks的指向已经是新数组啦,所以tasks和data已经不在有关系。(concat也是返回新数组)

而push和splice函数是在原数组上操作,所谓在原数组操作,指的是指向不变,所以tasks和data是相关联的。

4、参数传递

js的函数参数传递为值传递。

当传入的是 基本类型的参数时:就是复制了份内容给i而已,i与age之间没有关系。

function setAge(i)

{

    alert(i);//24

    i = 18;

    alert(i);//18,i的改变不会影响外面的age

};

var age = 24;

setAge(age);

alert(age);//24

当传入的参数为引用类型时:

function setName(obj)

{

    obj.name = 'haha';

};

var obj2 = new Object();

setName(obj2);

alert(obj2.name);    //  haha

这看起来很像是传递的是引用,因为obj.name受到改变了,但其实不是,其实还是值,因为obj2本身的值就是新对象的地址,所以传进去的就是这个地址。

这是阿里2014年的笔试题: 

var a = 1;

var obj = {

    b: 2

};

var fn = function () {};

fn.c = 3;

function test(x, y, z) {

    x = 4;

    y.b = 5;

    z.c = 6;

    return z;

}

test(a, obj, fn);

alert(a + obj.b + fn.c);

答案:12

首先test传递进去的实参中,a是基本类型(,复制了一份值),obj是object(指向地址,你动我也动),fn也当然不是基本类型啦。在执行test的时候,x被赋值为4(跟a没关系,各玩各的,a仍然为1),y的b被赋值为5,那obj的b也变为5,z的c变为6,那fn的c当然也会是6. 所以alert的结果应该是1+5+6 =12. (其实test不返回z也一样,z仍然改变的)。

————————————

参考:http://www.2cto.com/kf/201401/273413.html    , https://segmentfault.com/a/1190000002789651#articleHeader0

Js的引用赋值与传值赋值的更多相关文章

  1. JS 的引用赋值与传值赋值

    这个问题说大不大说小不小,如果你有幸踩了这个坑,一定会找这篇文章,哈哈~ 现说一下JS数字的类型:基本类型和引用类型 先看下下面两个栗子: var a = 30; var b = a; a = 20; ...

  2. PHP变量传值赋值和引用赋值,变量销毁

    <?php $a = 100; $b = 200; var_dump($a,$b); //int(100) int(200) ?> php中,上面的代码,变量是怎么存放的呢? 上面的代码变 ...

  3. PHP变量引用赋值与变量赋值变量的区别

    变量默认总是传值赋值.那也就是说,当将一个表达式的值赋予一个变量时,整个原始表达式的值被赋值到目标变量.这意味着,例如,当一个变量的值赋予另外一个变量时,改变其中一个变量的值,将不会影响到另外一个变量 ...

  4. js和jquery给iframe src赋值的3种方法

    js和jquery给iframe src赋值的3种方法   网页使用iframe嵌入网页时,有时候需要动态处理src的值,而不是写死的,所以我们需要知道如何给iframe src赋值,通常是使用js或 ...

  5. php地址赋值值和传值赋值

    下面这是php的赋值的两种方式: <?phpheader("Content-Type: text/html;charset=utf-8");$a="我是原始数据a& ...

  6. js对div取值与赋值

    js对div取值与赋值 因为JavaScript运行时,id="test1" 的那个div元素可能还没解析和加载,js加载是有顺序的.只需把 js 整个搬到 后面即可. 还有一个特 ...

  7. JS变量作用域与解构赋值

    用var变量是有作用域的 变量在函数内部声明时,那么该变量只属于整个函数体,函数外不可调用 当两个不同的函数里,使用了用一个相同的变量名,二者不互相影响,相互独立 遇到嵌套函数时,外部函数不可调用内部 ...

  8. jquery根据选择器进行页面赋值,封装赋值方法

    可以进行文本框赋值,文本域赋值,下拉列表赋值,单选框赋值,多选框赋值, 传入对象,可以根据元素name进行比对赋值,不用每个进行单独赋值 <!DOCTYPE html> <html ...

  9. JS调用OC方法并传值,OC调用JS方法并传值////////////////////////zz

     iOS开发-基于原生JS与OC方法互相调用并传值(附HTML代码)     最近项目里面有有个商品活动界面,要与web端传值,将用户在网页点击的商品id 传给客户端,也就是js交互,其实再说明白一点 ...

随机推荐

  1. ZOJ 3329 One Person Game 概率DP 期望 难度:2

    http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=3754 本题分数为0的概率不确定,所以不能从0这端出发. 设E[i]为到达成功所 ...

  2. UVa 11375 - Matches

    http://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem&p ...

  3. Mac OS X 卸载MySQL

    sudo rm /usr/local/mysqlsudo rm -rf /usr/local/mysql*sudo rm -rf /Library/StartupItems/MySQLCOMsudo ...

  4. 戴文的Linux内核专题:07内核配置(3)

    转自Linux中国 OK,我们还继续配置内核.还有更多功能等待着去配置. 下一个问题(Enable ELF core dumps (ELF_CORE))询问的是内核是否可以生成内核转储文件.这会使内核 ...

  5. poj 2536 GopherII(二分图匹配)

    Description The gopher family, having averted the canine threat, must face a new predator. The are n ...

  6. https需要的类

    import java.io.IOException; import java.net.InetAddress; import java.net.InetSocketAddress; import j ...

  7. Android 导入jar包 so模块--导入放置的目录

    Android视图下 app目录下的jniLibs 对应Project 视图app下的libs目录 把jar包或者带so文件的文件夹(一般以处理器型号命名如:arbeabi  arm64-v8a)复制 ...

  8. SharePoint 2016 的新特性概览(二)(What's New for IT Professionals in SharePoint Server 2016)

    博客地址:http://blog.csdn.net/FoxDave SharePoint 2016 的新特性 三. 监测和数据(Insights and Data) 实时数据监测,包括对使用情况.存储 ...

  9. vc设置窗口透明

    ::SetWindowLong(GetSafeHwnd(), GWL_EXSTYLE, ::GetWindowLongPtr(GetSafeHwnd(), GWL_EXSTYLE) | WS_EX_L ...

  10. Swift编程规范

    文档编号: 应用开发Swift编码规范 (版本v1.0.0)       成文信息 主题词: Swift开发编码规范 作  者: 周少停 文档类别: 开发规范 审  核: 批  准: 文档性质: 初稿 ...