JS深拷贝的实现

栏目: JavaScript · 发布时间: 6年前

内容简介:学习js的深拷贝和浅拷贝首先要了解js的基本类型和引用类型。基本类型基本类型的数据存放在栈内存中,复制的时候是值传递,直接把5赋值给了number2

基本类型和引用类型

学习js的深拷贝和浅拷贝首先要了解js的基本类型和引用类型。

基本类型

基本类型的数据存放在栈内存中,复制的时候是值传递,直接把5赋值给了number2

var number1 = 5;
var number2 = number1;

JS深拷贝的实现

引用类型

引用类型的数据存放在堆内存中,栈内存中只存放具体的地址值,把object1赋值给object2的时候是把object1的地址值赋值给了object2,这个时候两个对象同时指向堆内存中的同一数据。

var object1 = new Object();
var object2 = object1;

JS深拷贝的实现

深拷贝和浅拷贝的区别

深拷贝在于引用类型的时候,浅拷贝只复制地址值,实际上还是指向同一堆内存中的数据,深拷贝则是重新创建了一个相同的数据,二者指向的堆内存的地址值是不同的。这个时候修改赋值前的变量数据不会影响赋值后的变量。

深拷贝的实现

通过递归方式实现深拷贝

function deepClone(obj) {
    var target = {};
    for(var key in obj) {
        if (Object.prototype.hasOwnProperty.call(obj, key)) {
            if (typeof obj[key] === 'object') {
                target[key] = deepClone(obj[key]); 
            } else {
                target[key] = obj[key];
            }
        }
    }
    return target;
}

通过json的方式实现

function (obj) {
    let tmp = JSON.stringify(obj); 
    let result = JSON.parse(tmp); 
    return result;
}

以上所述就是小编给大家介绍的《JS深拷贝的实现》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Responsive Web Design

Responsive Web Design

Ethan Marcotte / Happy Cog / 2011-6 / USD 18.00

From mobile browsers to netbooks and tablets, users are visiting your sites from an increasing array of devices and browsers. Are your designs ready? Learn how to think beyond the desktop and craft be......一起来看看 《Responsive Web Design》 这本书的介绍吧!

JSON 在线解析
JSON 在线解析

在线 JSON 格式化工具

随机密码生成器
随机密码生成器

多种字符组合密码

SHA 加密
SHA 加密

SHA 加密工具