javascript - 如何使用jquery按值复制对象

Question

您好，我对这个复选框有疑问:

<input type="checkbox" id="hideTempSeries" checked="checked" value="0" /> 
     Temperature <br />
<input type="checkbox" id="hideFlowSeries" checked="checked" value="1" /> 
     Flow <br />
<input type="checkbox" id="hidePressSeries" checked="checked" value="2"/> 
     Pressure <br /> 
<input type="checkbox" id="hideCondSeries" checked="checked" value="3" /> 
     Conductivity  <br />

.. 这个 jQuery 函数将这个复选框值的数组发送到一个名为 removePanes(checkedArray)“每次任何复选框发生变化时”

   $("#tools :checkbox").change(function(){
       if($(this).prop('checked')){// when Checked

       }
       else{// when unChecked
       var checkedArray = [] ; 
        $("#tools :checkbox").each(function(index,value){
           if($(this).prop('checked') == false){checkedArray.push($(this).val())}

        });
        removePanes(checkedArray) ;
       }

removePanes() 函数

   function removePanes(id){
       var removeUncheckedSeries = $.map(newSeries , function(index,value){
        for(var i=0 ; i < id.length ; i++){  
            if(index.yAxis == id[i])return null;
        }  
       return index ;
       });
       var modified = $.map(removeUncheckedSeries, function(index,value) {
        index.yAxis = 15 ; 
        return index ;
       });
      console.log(modified) ;
    } ; 

这是 newSeries[] Object

然后，removePanes(checkedArray) 函数获取此数组并从以下位置移除与未检查值等效的所有对象:newSeries[] 对象

然后它将所有 yAxis 值设置为 15。

此功能无效。

因为每次更改复选框时，函数都不会重新加载 newSeries[] 对象，它只是在最后一次更改时修改它。

它所做的是，第一次点击工作正常，然后将所有 yAxis 设置为 15。当我取消选中任何其他框时，因为所有 yAxis 等于 15 并且 jQuery 数组发送值从 0 到 3 没有任何反应。

问题:每次复选框触发器发生变化时，我如何使 removePanes(checkedArray) 重新加载 newSeries[] 对象？

Answer 1

That is happening because objects are by default copied by reference in Javascript.

因此，如果您从任何地方更改复制对象的任何属性，它将影响所有其他对象。要仅按值(或克隆)复制对象，您可以使用 jQuery 的 $.extend() 方法，如此处所示的 Jonh Resig(是的，他本人)https://stackoverflow.com/a/122704/344304

var newObj = $.extend(true, {}, oldObj); // deep copy

所以改变你的removePanes函数如下

function removePanes(id) {
        var seriesCopy = jQuery.extend(true, {}, newSeries);
        var removeUncheckedSeries = $.map(seriesCopy, function(obj, index) {
            return   $.inArray(obj.yAxis,id) == -1 ? obj : null;
        });
        var modified = $.map(removeUncheckedSeries, function(obj, index) {
            obj.yAxis = 15;
            return obj;
        });
        console.log(modified);
    };​

演示: http://jsfiddle.net/joycse06/w2KS2/