JavaScript 改变赋值的数组对象值不改变原数组对象的值

https://blog.csdn.net/qq_24909089/article/details/84023581

问题原因:

原始值和引用值
在 ECMAScript 中,变量可以存在两种类型的值,即原始值和引用值。

原始值:存储在栈(stack)中的简单数据段,也就是说,它们的值直接存储在变量访问的位置。

引用值:存储在堆(heap)中的对象,也就是说,存储在变量处的值是一个指针(point),指向存储对象的内存处。

官方文档:http://www.w3school.com.cn/js/pro_js_value.asp

案例如下:

<script src="https://cdn.staticfile.org/jquery/2.0.0/jquery.min.js"></script>
 
    <script type="text/javascript">
        
        //定义变量
        var data_mydataD =Array();
        function Deliver() {
                   
            var data =Array();
            data['Field_1'] = 0;
            data['Field_2'] = 0;
            data['Field_3'] = 0;
            //初始值
            console.log(data);
            console.log(data_mydataD);
            if (data) {
                data_mydataD = data;
                DeliverC(data_mydataD);
 
                //改变值
                console.log(data);
                console.log(data_mydataD);
 
            }
        }
        function DeliverC(mydataD) {
 
            mydataD['Field_1'] = -1;
            mydataD['Field_2'] = -1;
            mydataD['Field_3'] = -1;
        };
 
        Deliver();
    </script>
运行结果:

当我改变mydataD的传入参数时data也跟着改变了

通过查找资料得知,对数组对象赋值是引用关系,感觉像是使用了同一内存空间,解决方法如下。

1.方法一:

使用jQuery.extend()方法,jQuery.extend() 函数用于将一个或多个对象的内容合并到目标对象

官方文档:http://www.runoob.com/jquery/misc-extend.html

2.方法二:

使用Object.create 函数,创建一个具有指定原型且可选择性地包含指定属性的对象

官方文档:https://msdn.microsoft.com/zh-cn/library/ff925952(v=vs.94).aspx

代码修改如下:

<script src="https://cdn.staticfile.org/jquery/2.0.0/jquery.min.js"></script>
 
    <script type="text/javascript">
        
        //定义变量
        var data_mydataD =Array();
        function Deliver() {
                   
            var data =Array();
            data['Field_1'] = 0;
            data['Field_2'] = 0;
            data['Field_3'] = 0;
            //初始值
            console.log(data);
            console.log(data_mydataD);
            if (data) {
 
                //原赋值方式
                data_mydataD = data;
 
                //方法一:
                data_mydataD = $.extend(true, [], data);
 
                //方法二:
                // data_mydataD = Object.create(data);
 
                DeliverC(data_mydataD);
 
                //改变值
                console.log(data);
                console.log(data_mydataD);
 
            }
        }
        function DeliverC(mydataD) {
 
            mydataD['Field_1'] = -1;
            mydataD['Field_2'] = -1;
            mydataD['Field_3'] = -1;
        };
 
        Deliver();
    </script>
运行结果:

如果想赋值对象可以改成$.extend(true, {}, data);

运行结果如下


--------------------- 
作者:天下皆白_唯我独黑 
来源:CSDN 
原文:https://blog.csdn.net/qq_24909089/article/details/84023581 
版权声明:本文为博主原创文章,转载请附上博文链接!

猜你喜欢

转载自blog.csdn.net/MyNameIsXiaoLai/article/details/86605544
今日推荐