先看一个特别不符合直觉的代码

         <script type="text/javascript">
var a = [1,2,3,4];
var b = [1,2,3,4];
console.log(a==b); //出现false,按照常规理解,a和b应该是一样的,都是[1,2,3,4],同时也说明,js中不能这么判断数组时候相同
</script>

再看代码

        <script type="text/javascript">
var a = 3;
var b = 3;
console.log(a==b); //true
</script>

第二段代码为true很好理解,都是3,那第一段代码为何为false,都是[1,2,3,4]呀

----------

在js中,基本类型的变量(有数字,字符串,布尔值)赋值的时候,就是值复制过去,以后相互之间就没有关系了。

比如说:

        <script type="text/javascript">
var a = 5;
var b = a; //a是基本类型数据,赋值给b,那么在内存中,b就存了a的值5,以后各走各的路,a,b没有关系了。
b += 5;
console.log(a,b); // 5,10
</script>
         <script type="text/javascript">
var a = [1,2,3,4];
var b = a;
var c = [1,2,3,4];
console.log(a==b); //true;
console.log(a==c); //false; //b是a赋值过去的,现在更改b的内容,再看看a
b.push(5);
console.log(a); // [1, 2, 3, 4, 5 ] 很奇怪吧,a也变了啊,这里对a没有操作呀???
</script>

上面的代码,a不是基本类型,是个数组对象,赋给b的时候,改动b也改动了a,真是奇怪。这就是在js中,当a不是基本类型数据时,内存中a存的是一个内存地址,a赋值给b时候,ab共同指向一个内存地址,改动了a,也就改动了b,改动了b,也就改动了a,如下

         <script type="text/javascript">
var a = [1,2,3,4];
var b = a;
var c = [1,2,3,4];
console.log(a==b); //true;
console.log(a==c); //false; //b是a赋值过去的,现在更改b的内容,再看看a
b.push(5);
a.push(6);
console.log(a); // [1, 2, 3, 4, 5 ,6 ] 很奇怪吧,a也变了啊,这里对a没有操作呀???
console.log(b); // [1, 2, 3, 4, 5 ,6 ]
console.log(a==b); //true;
</script>

再看一段代码

         <script type="text/javascript">
var a = [1,2,3,4];
var b = a; //b是a赋值过去的,现在更改b的内容,再看看a
b = [1,2,3,4,5]; //这里不用b.push(5);看看什么变化
console.log(a); // [1, 2, 3, 4 ] a不变
console.log(b); // [1, 2, 3, 4, 5 ]
console.log(a==b); //false;
</script>

是不是很困惑,不是说了改动b,a也跟着动吗?

第6行代码,不是b对象改动,而是又重新赋值一个对象给了b,b是数组对象的另一个对象实例(只要程序中出现赋值,那就是重新生成),他俩也就没关系了,如果用b的某个方法,改动的b的值,那a和b仍然指向同一个地址!

---------------------------

所有的一切,总结出来一句话:

在js中,基本类型数据,在内存中存的就是个数据

a | 5

b | 5

a,b值相同,就是a==b

但是对象不一样

在内存中,对象存的是个地址,a和b这两个对象相同的话,需要值和地址都相同才可以。

a | 内存指针1

b | 内存指针1

这样ab才相同。

--------------------------

在面向对象程序中,如果用这种方式创建对象,如下

         <script type="text/javascript">
function CreatePerson(name){
this.name = name;
this.test = function(){
console.log(this.name);
}
} var my_obj1 = new CreatePerson('张三');
var my_obj2 = new CreatePerson('李四'); alert(my_obj1.test == my_obj2.test); //false //虽然代码上是一样的,但是my_obj1和my_obj2是两个对象实例,他们各自在内存中开辟一个地方,放置test方法,如果对象实例很多,就比较占内存了。 </script>

所以,要更改下,用prototype,在对象中,不同的地方,如属性,写在构造函数里,相同的地方,如方法,用原型来写。如下:

         <script type="text/javascript">
function CreatePerson(name){
this.name = name;
} CreatePerson.prototype.test = function(){
console.log(this.name);
} var my_obj1 = new CreatePerson('张三');
var my_obj2 = new CreatePerson('李四'); alert(my_obj1.test == my_obj2.test); //true
my_obj1.test(); // 张三
my_obj2.test(); // 李四 </script>

js中对象引用出现的问题的更多相关文章

  1. 别再为了this发愁了------JS中的this机制

    别再为了this发愁了------JS中的this机制 题记:JavaScript中有很多令人困惑的地方,或者叫做机制.但是,就是这些东西让JavaScript显得那么美好而与众不同.比方说函数也是对 ...

  2. JS中的this用法详解

    随着对js的深入学习和使用,你会发现它里面包含了很多令人困惑的机制,比如对象.闭包.原型链继承等等,而这其中肯定包含令你现在或者曾经费解的this,如果你不把心一横,花点时间还真不明白这个this的用 ...

  3. js中的数据类型及其转换

    Js中的数据类型 Js中的数据类型一共有六种,即number,string,boolean,underfine,null,object. 一,number Number数据类型指的是数字,可以为整型, ...

  4. Javascript基础 - js中曾经忽略的知识点

    深入那些曾经忽略的Javascript知识 1. parseInt(string, [radix]),parseFloat(string) 一般我们省略第二个参数,parseInt(‘100’) == ...

  5. JS中如何进行对象的深拷贝

    在JS中,一般的=号传递的都是对象/数组的引用,并没有真正地拷贝一个对象,那如何进行对象的深度拷贝呢?如果你对此也有疑问,这篇文章或许能够帮助到你 一.对象引用.浅层拷贝与深层拷贝的区别 js的对象引 ...

  6. JS中让新手倍感震惊、违反直觉、出乎意料、的一些知识点汇总记录

    本文记录在自己学习js过程中,违反直觉,出乎意料,倍感震惊的知识点.当然,不了解这个知识点,很容易出错,因为毕竟违反直觉,出乎意料,倍感震惊嘛! 1. 两个内容一样的数组竟然不相等? var a = ...

  7. JS中的六大数据类型

    js中有六种数据类型,包括五种基本数据类型(Number,String,Boolean,Undefined,Null),和一种复杂数据类型(Object). typeof 操作符 由于js中的变量是松 ...

  8. JS中变量的存储

    JS中的变量是保存在栈内存中的 基本数据类型的值直接在栈内存中存储: 值与值之间是独立存在的,修改一个变量不会影响其他变量: var a=20; var b=a; a++; 对象(引用数据类型)是保存 ...

  9. 别再为了this发愁了:JS中的this机制

    题记:JavaScript中有很多令人困惑的地方,或者叫做机制.但是,就是这些东西让JavaScript显得那么美好而与众不同.比方说函数也是对象.闭包.原型链继承等等,而这其中就包括颇让人费解的th ...

随机推荐

  1. DeviceUuidFactory【获取设备唯一标识码的UUID(加密)】【需要运行时权限的处理的配合】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 有时需要对用户设备进行标识,所以希望能够得到一个稳定可靠并且唯一的识别码.虽然Android系统中提供了这样设备识别码,但是由于An ...

  2. springcloud情操陶冶-初识springcloud

    许久之前便听到了springcloud如雷贯耳的大名,但是不曾谋面,其主要应用于微服务的相关架构.笔者对微服务并不是很了解,但其既然比较出众,遂也稍微接触研究下 springcloud特性 sprin ...

  3. Linux环境变量配置全攻略

    Linux环境变量配置 在自定义安装软件的时候,经常需要配置环境变量,下面列举出各种对环境变量的配置方法. 下面所有例子的环境说明如下: 系统:Ubuntu 14.0 用户名:uusama 需要配置M ...

  4. 命令模式 Command 行为型 设计模式(十八)

    命令模式(Command) 请分析上图中这条命令的涉及到的角色以及执行过程,一种可能的理解方式是这样子的: 涉及角色为:大狗子和大狗子他妈 过程为:大狗子他妈角色 调用 大狗子的“回家吃饭”方法 引子 ...

  5. pycharm中Django的安装和简单使用

    一.安装: 1.点击File,找到setting选项 2.点击+号,进入下面界面 结束后,安装完成 二.创建Django项目 创建成功后,新项目左侧: templates:用于存储HTML文件 set ...

  6. 禁止微信内的H5页面上下拖动

    客户需求:禁止微信内的H5页面上下拖动: 解决方案: 网上的答案几乎都是阻止默认事件,即: document.body.addEventListener('touchmove' , function( ...

  7. 三、Snapman多人协作电子表格之——软件的基本功能

    Snapman多人协作电子表格是一个即时工作系统. 一.SnapmanServer服务端 SnapmanServer服务端在安装Snapman软件一起自带,是一个小巧的控制台程序SnapmanServ ...

  8. 链表倒数第k个节点

    1.一种较笨的办法是先将链表元素入栈,然后出栈找到倒数第k个节点值,再拿着值遍历链表去找到对于节点. 时间复杂度:O(n) (3n 遍历-出栈-遍历) 空间复杂度:O(n) (一个栈) 2.快慢指针, ...

  9. Scrapy 框架流程详解

    框架流程图 Scrapy 使用了 Twisted 异步非阻塞网络库来处理网络通讯,整体架构大致如下(绿线是数据流向): 简单叙述一下每层图的含义吧: Spiders(爬虫):它负责处理所有Respon ...

  10. VUE新版扫码下单必选分类设置FAQ

    使用场景:商家想要设置某些分类下的商品设置必选,否则不能下单.如某火锅店,商家想要设置汤底这个分类下的商品,顾客扫码下单的时候必须选择一份才能下单,此时 就可以使用这个功能 配置步骤和注意事项如下: ...