zoukankan      html  css  js  c++  java
  • js深浅拷贝

    Javascript深浅拷贝

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
        <body>
        </body>
            <!--Javascript有六种基本数据类型(也就是简单数据类型),
            它们分别是:Undefined,Null,Boolean,Symbol,Number和String。
            还含有一种复杂数据类型,就是对象-->
            
            <!--注意Undefined和Null的区别,Undefined类型只有一个值,
            就是undefined,Null类型也只有一个值,也就是null
            Undefined其实就是已声明未赋值的变量输出的结果
            null其实就是一个不存在的对象的结果-->
        <script type="text/javascript">
    //        浅拷贝
        var obj = {
                name:'wsscat',
                age:0
            }
            var obj2 = obj;
            obj2['c'] = 5;
            console.log(obj);//Object {name: "wsscat", age: 0, c: 5}
            console.log(obj2);////Object {name: "wsscat", age: 0, c: 5}
            
    //      深拷贝
    //对于数组我们可以使用slice()和concat()方法来解决上面的问题
    //slice方法
            var arr = ['wsscat', 'autumns', 'winds'];
            var arrCopy = arr.slice(0);
            arrCopy[0] = 'tacssw'
            console.log(arr)//['wsscat', 'autumns', 'winds']
            console.log(arrCopy)//['tacssw', 'autumns', 'winds']
            
    //      concat方法
            var arr = ['wsscat', 'autumns', 'winds'];
            var arrCopy = arr.concat();
            arrCopy[0] = 'tacssw'
            console.log(arr)//['wsscat', 'autumns', 'winds']
            console.log(arrCopy)//['tacssw', 'autumns', 'winds']
            
    //      对象我们可以定义一个新的对象并遍历新的属性上去实现深拷贝
            var obj = {
                name:'wsscat',
                age:0
            }
            var obj2 = new Object();
            obj2.name = obj.name;
            obj2.age = obj.age
            obj.name = 'autumns';
            console.log(obj);//Object {name: "autumns", age: 0}
            console.log(obj2);//Object {name: "wsscat", age: 0}
            
    //      当然我们可以封装好一个方法来处理对象的深拷贝,代码如下
            var obj = {
                name: 'wsscat',
                age: 0
            }
            var deepCopy = function(source) {
                var result = {};
                for(var key in source) {
                    if(typeof source[key] === 'object') {
                        result[key] = deepCopy(source[key])
                    } else {
                        result[key] = source[key]
                    }
                }
                return result;
            }
            var obj3 = deepCopy(obj)
            obj.name = 'autumns';
            console.log(obj);//Object {name: "autumns", age: 0}
            console.log(obj3);//Object {name: "wsscat", age: 0}
        </script>
    </html>

    数组中存放函数

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
        <body>
        </body>
        <!--在javascript中函数也是一种数据,能够像操作一个对象对它进行操作。
        并且javascript不进行数据类型检查,数组可以存放任何东西,
        在下面代码中我们不但在数组中存放了函数,并且也可以在存放一个执行函数的返回值,
        所以数组前两个数据存放都是函数执行返回值-->
    
        <script type="text/javascript">
            var funcA = function() {
                console.log("funcA");
                return "hello funA";
            }
            var funcB = function() {
                console.log("funcB");
                return "hello funB";
            }
            var funcC = function() {
                console.log("funcC");
                return "hello funC";
            }
            var arr = [funcA(), funcB(), funcC];
            console.log(arr);
            arr[2]();
        </script>
    </html>

    数组对象的深拷贝

    <!DOCTYPE html>
    <html>
    
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
    
        <body>
        </body>
        <script type="text/javascript">
            Object.prototype.deepCopy = function() {
                var obj = null; //用于最后返回一个对象,这个对象是深复制的结果
                for(var attr in this) { //遍历这个对象的每一个属性
                    if(this.hasOwnProperty(attr)) { //主要是递归自有属性
                        if(typeof(this[attr] === 'object')) { //如果对象的属性是一个对象,就递归复制它的每一个属性
                            if(this[attr] === null) { //如果对象为null
                                obj[attr] = null;
                            } else if(Object.prototype.toString(this[attr]) === '[object Array]') { //如果是个数组
                                obj[attr] = [];
                                for(var i = 0; i < this[attr].length; i++) {
                                    obj[attr].push(this[attr][i].deepCopy());
                                }
                            } else { //object
                                obj[attr] = this[attr].deepCopy();
                            }
                        } else {
                            obj[attr] = this[attr];
                        }
                    }
                }
                return obj;
            }
        </script>
    
    </html>
  • 相关阅读:
    今天是不是要得瑟那么一下下啦
    今天小小的总结一下最近的小程序中的问题
    敏感词过滤和XML的创建
    【腾讯优测干货分享】安卓专项测试之GPU测试探索
    【腾讯Bugly干货分享】WebVR如此近-three.js的WebVR示例解析
    【腾讯Bugly干货分享】Android动态布局入门及NinePatchChunk解密
    【腾讯Bugly干货分享】基于RxJava的一种MVP实现
    【腾讯Bugly干货分享】动态链接库加载原理及HotFix方案介绍
    【腾讯Bugly干货分享】微信iOS SQLite源码优化实践
    【腾讯Bugly干货分享】移动客户端中高效使用SQLite
  • 原文地址:https://www.cnblogs.com/LLX8/p/9212216.html
Copyright © 2011-2022 走看看