JavaScript 对于深度克隆的函数

最新推荐文章于 2023-02-16 21:38:38 发布

朝油

最新推荐文章于 2023-02-16 21:38:38 发布

阅读量253

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/qq_41910568/article/details/88377339

版权

JavaScript 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

JS的深度克隆函数

当项目需要用到一个已知对象内容，但是两个对象之间不能存在联系，
就是说不能是传统的把一个对象的引用赋值给另外一个对象。这样会造成
一个对象改变内容另一个对象也会随之改变。
这时候就需要克隆对象的技术了。

     克隆对象函数的步骤：
         1、遍历被克隆对象 for(var prop in obj)
         2、判断prop 是不是引用值 typeof() object
              是：直接克隆原始值
                       克隆变量 = 被克隆变量
              否：判断是否为数组或者对象 instanceof、toString、constructor
                   是数组：建立相应数组
                   是对象：建立相应对象
       	 3、递归函数
         4、return 克隆值

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>深度克隆函数</title>
</head>
<body>
    <script>

        //建立一个被克隆对象
        var obj = {
            name : "张三",
            age : 18,
            sex : "男",
            arr : [1, 2, 'a', 'b','abc'],
            stu : {
                name : "李四",
                age : 20,
                arr : [1, 2, 'a', 'b','abc'],
                sex : "人妖"
            },
            tea : {
                name : "王五",
                age : 33,
                son : {
                    name : "赵六",
                    age : 15,
                    arr : [1, 2, 'a', 'b','abc'],
                    sex : "女"
                }
            },
            sex : "男"
        }

        var obj02 = {

        }

        function deepClone(clone, isClone) {
            var clone = clone || {},
                toStr = Object.prototype.toString(),
                arrStr = "[object Array]";
            //遍历被克隆对象 for(var prop in isClone)
            for(var prop in isClone){
                //判断是不是自己的原型
                if(isClone.hasOwnProperty(prop)){
                    //判断prop 是不是原始值 typeof() object
                    if(isClone !== null && typeof(isClone[prop]) == "object"){
                        //判断是否为数组或者对象 instanceof、toString、constructor
                        if(isClone[prop] instanceof Array){
                            //是数组：建立相应数组
                            clone[prop] = [];
                        } else{
                            //是对象：建立相应对象
                            clone[prop] = {};
                        }
                        //递归函数
                        deepClone(clone[prop],isClone[prop]);
                    } else {
                        //直接克隆原始值
                        clone[prop] = isClone[prop];
                    }
                }
            }
            return clone;
        }



    </script>
</body>
</html>

这是本人在学习JavaScript 过程种学习到的知识，希望能帮到大家

朝油

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
JavaScript 对于深度克隆的函数

JS的深度克隆函数当项目需要用到一个已知对象内容，但是两个对象之间不能存在联系，就是说不能是传统的把一个对象的引用赋值给另外一个对象。这样会造成一个对象改变内容另一个对象也会随之改变。这时候就需要克隆对象的技术了。克隆对象函数的步骤： 1、遍历被克隆对象 for(var prop in obj) 2、判断prop 是不是引用值 typeof(...
复制链接

扫一扫