js有两种类型的值：
栈：原始数据类型（undefinen,null,boolead,number,string）
堆：引用数据类型（对象，函数和数组）
两种类型的区别是：储存位置不同，
原始数据类型直接存储在栈（stack）中的简单数据段，占据空间小，大小固定，属于被频繁使用的数据，所以放入栈中存储；
引用数据类型存储在堆（heap）中的对象，占据空间大，大小不固定，如果存储在栈中，将会影响程序运行的性能，引用数据类型在栈中存储了指针，该指针指向堆中该尸体的起始地址。当解释器寻找引用值，会首先检索其在栈中的地址，取得地址后从堆中获取实体；

举个例子：

基本类型：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<script>

/*var a = 5;

var b = a;

b += 3;

alert(b);  //8

alert(a);  //5

*/

//对象和函数和数组都是引用的关系

/*var a = [1,2,3];

var b = a;

b.push(4);

alert(b); //1,2,3,4

alert(a); //1,2,3,4*/

var a = [1,2,3];

var b = a;

b = [1,2,3,4];

alert(b);  //1,2,3,4

alert(a);  //1,2,3
var obj={};
var objcopy=obj;
objcopy.fun=function(){
console.trace();
console.log('obi.fun');
};
obj.fun();//obi.fun同样会执行objcopy添加的fun方法，证明俩人是引用的同样的东东
</script>

</head>

<body>

</body>

</html>

浅层拷贝：

function simpleClone(initalObj) {

      var obj = {};

      for ( var i in initalObj) {

        obj[i] = initalObj[i];

      }

      return obj;

    }

 var obj = {

      a: "hello",

      b:{

          a: "world",

          b: 21

        },

      c:["Bob", "Tom", "Jenny"],

      d:function() {

          alert("hello world");

        }

    }

var cloneObj = simpleClone(obj);

    console.log(cloneObj.b);

    console.log(cloneObj.c);

    console.log(cloneObj.d);

    cloneObj.b.a = "changed";

    cloneObj.c = [1, 2, 3];

    cloneObj.d = function() { alert("changed"); };

    console.log(obj.b);//浅拷贝 改动一个对象的值，另一个还是会受到影响   浅拷贝其实就是简单的复制第一层，深层的改变依然会受影响

    console.log(obj.c);

    console.log(obj.d);
 

深拷贝：直接上个比较完善的方法，不会出问题的：（递归拷贝）

function deepClone(initalObj, finalObj) {
　　var obj = finalObj || {};
　　for (var i in initalObj) {
　　　　var prop = initalObj[i]; // 避免相互引用对象导致死循环，如initalObj.a = initalObj的情况
　　　　if(prop === obj) {
　　　　　　continue;
　　　　}
　　　　if (typeof prop === 'object') {
　　　　　　obj[i] = (prop.constructor === Array) ? [] : {};
　　　　　　deepClone(prop, obj[i]);
　　　　} else {
　　　　　　obj[i] = prop;
　　　　}
　　}
　　return obj;
}
var str = {};
var obj = { a: {a: "hello", b: 21} };
deepClone(obj, str);
obj.a=1;
console.log(str.a);//{a: "hello", b: 21} 互不影响
console.log(str.a.a)//hello
console.log(obj);//{a: 1}

使用Object.create()方法，也可以达到深层拷贝

直接使用var newObj = Object.create(oldObj)，可以达到深拷贝的效果。

function deepClone(initalObj, finalObj) {

  var obj = finalObj || {};

  for (var i in initalObj) {

    var prop = initalObj[i];        // 避免相互引用对象导致死循环，如initalObj.a = initalObj的情况

    if(prop === obj) {

      continue;

    }

    if (typeof prop === 'object') {

      obj[i] = (prop.constructor === Array) ? [] : Object.create(prop);

    } else {

      obj[i] = prop;

    }

  }

  return obj;

}

js中值的基本类型与引用类型，以及对象引用，对象的浅拷贝与深拷贝的更多相关文章

  1. JS中String类型转换Date类型 并 计算时间差

    JS中String类型转换Date类型 1.比较常用的方法,但繁琐,参考如下:主要使用Date的构造方法:Date(int year , int month , int day)<script& ...

  2. JS中值类型和引用类型

    一.值类型 例子: var a=10; var b=a; a=20; console.log(b); 例子中,将a的值赋给了b,b=10,然后改变a的值不会影响b的值,a和b是独立的两份,互不影响. ...

  3. 判断js中各种数据的类型方法之typeof与0bject.prototype.toString讲解

    提醒大家,Object.prototype.toString().call(param)返回的[object class]中class首字母是大写,像JSON这种甚至都是大写,所以,大家判断的时候可以 ...

  4. js中获取当前浏览器类型

    本文为博主原创,转载请注明出处: 在应用POI进行导出时,先应用POI进行数据封装,将数据封装到Excel中,然后在进行download下载操作,从而完成 POI导出操作.由于在download操作时 ...

  5. JS中的 ES6新类型iterable

    1.1 iterable字面意思:可迭代的,可重复的 iterable是ES6标准引入的新的类型.而Array.Map和Set都属于iterable类型 1.2 为什么加入iterable类型? 遍历 ...

  6. js中判断一个对象的类型的种种方法

    javascript中检测对象的类型的运算符有:typeof.constructor.instanceof. typeof:typeof是一个一元运算符,返回结果是一个说明运算数类型的字符串.如:&q ...

  7. C#中??和？分别是什么意思？ 在ASP.NET开发中一些单词的标准缩写 C#SESSION丢失问题的解决办法 在C#中INTERFACE与ABSTRACT CLASS的区别 SQL命令语句小技巧 JQUERY判断CHECKBOX是否选中三种方法 JS中!=、==、!==、===的用法和区别 在对象比较中，对象相等和对象一致分别指的是什么？

    C#中??和?分别是什么意思? 在C#中??和?分别是什么意思? 1. 可空类型修饰符(?):引用类型可以使用空引用表示一个不存在的值,而值类型通常不能表示为空.例如:string str=null; ...

  8. js对象的浅拷贝与深拷贝

    浅拷贝和深拷贝都是对于JS中的引用类型而言的,浅拷贝就只是复制对象的引用(堆和栈的关系,原始(基本)类型Undefined,Null,Boolean,Number和String是存入堆,直接引用,ob ...

  9. Java对象的浅拷贝和深拷贝&&String类型的赋值

    Java中的数据类型分为基本数据类型和引用数据类型.对于这两种数据类型,在进行赋值操作.方法传参或返回值时,会有值传递和引用(地址)传递的差别. 浅拷贝(Shallow Copy): ①对于数据类型是 ...

随机推荐

  1. 《深入理解Java虚拟机》读书笔记：垃圾收集器与内存分配策略

    请移步至:http://zhanjindong.info/2014/05/18/java-gc/

  2. WebView与 JS 交互方式

    前言 现在很多App里都内置了Web网页(Hybrid App),比如说很多电商平台,淘宝.京东.聚划算等等,如下图 上述功能是由Android的WebView实现的,其中涉及到Android客户端与 ...

  3. 用NextResult方法取得多个Result Set

    http://dotnet.chinaitlab.com/ADONET/757364.html 从 ADO.NET 1.x 开始,DataReader 就可以在单一次的查询动作中,「批次 (batch ...

  4. Photo Sphere Viewer 全景图

    Photo Sphere Viewer  一款基于 three.js 的简易3D插件,方便,实用,友好,看到网上有些API有错误,所以自己写一个修正版的 该js插件可以360度旋转查看全景图,也可以上 ...

  5. 【黑金原创教程】【FPGA那些事儿-驱动篇I 】实验四：按键模块③ — 单击与双击

    实验四:按键模块③ - 单击与双击 实验三我们创建了"点击"还有"长点击"等有效按键的多功能按键模块.在此,实验四同样也是创建多功能按键模块,不过却有不同的有效 ...

  6. Oracle数据库入门——目录结构

    一.Oracle_Home目录 Oracle_Home主目录位于D:\dev\oracle\product\10.2.0(oracle安装路径)下,它包含Oracle软件运行有关的子目录和网络文件以及 ...

  7. python string.py 源码分析 一

    # Some strings for ctype-style character classification c风格字符串 whitespace = ' \t\n\r\v\f' #空白字符 \t 制 ...

  8. Flask web开发之路八

    今天写Flask_SQLAlchemy的外键及其关系 ### Flask-SQLAlchemy外键及其关系: 主app文件代码: from flask import Flask from flask_ ...

  9. Android超精准计步器开发-Dylan计步（申明：来源于网路）

    Android超精准计步器开发-Dylan计步(申明:来源于网路) 拿来借鉴学习,向原创者... 地址:http://blog.csdn.net/linglongxin24/article/detai ...

  10. datagrid--新增

    先在datagrid中添加toolbar配置项,增删改差的按钮,有3个属性,按钮名称,图标,回调函数,点击按钮会弹出一个对话框dialog,dialog是关闭的,closed=true, toolba ...