javascript之多重影分身之術!

聽說「人呆看臉就栽」，今天我的臉看起來一定是特別地呆＞＜

photo credit: Xosé Castro via photopin cc

我陷在一團泥沼中許久不能動彈，只能稍微動動手，動動腳....

靠著我最常用的console.log不斷找尋蛛絲馬跡，最後答案揭曉....

不要罵我幹嘛不開門見山，讓我鋪陳一下咩~ 氣氛氣氛...

開始進入主題吧! 其實故事是這樣的.....

今天我寫了一個批次刪除資料的功能!

相當然爾，批次大概就是用迴圈來作囉!

在jquery裡面就是$.each() ; 在Angularjs 裡就是 angular.each()，反正用法都大同小異啦!

然而恐怖唷! 恐佈到了極點的事情是...如果要loop的資料在loop裡面變更了那可怎麼辦?

比如說我有一段程式如下:

$.each($scope.data, function (key, value) {
    if (value.selected == true) {
        removeList($scope.data, value);    //在$scope.data中刪除value這資料($scope.data是array)
    }
})

就字面上解釋就是看陣列有多少資料一五一十的跑一遍，如果資料被選取就把他刪除掉!

see...簡單易懂!

但我後來發現這樣作法，我array明明就有兩筆資料，但老是都只跑一回....

後來我想到了，阿我是在搞笑喔！removeList把資料刪掉了當然會少一筆...

好吧! 其實我怎會不知道呢?  我忽略的是它會反映回去each裡面....

我不知哪來的想法，一直都覺得在開始跑each的時候array裡的資料就是原本的那些...

這是for迴圈語法的餘毒未清嗎? (因為通常會先去知道length....

不管如何，知道問題所在當然就要解決它囉啊!

第一個想法　

var temp=$scope.data; 
$.each(temp, function (key, value) {
    if (value.selected == true) {
        removeList($scope.data, value);   
    }
})

想法很簡單就用temp當成迴圈的資料，刪$scope.data而不要刪temp這樣總行了吧!!

.....

...

..

結果呢...答案揭曉! 不行........

$scope.data和temp會互相參考，達到一種你儂我儂、生死與共的境界!

所以呢! 　var temp=$scope.data; 　這動作我就把它當作互相「結拜」的動作!

結拜的基本宣誓詞就是「雖不能同年同月同日生，但願同年同月同日死」...

這兩個拜把兄弟非得要同甘共苦不可了....  (寫程式還能看連續劇真是不錯

話說這保哥之前給我們上js的課的時候好像有稍微講到。

好啦! 好啦! 我回想起來了....同一個記憶體位置啦...XD

所以怎辦呢?

我呢! 就另外宣告一個空白陣列然後再把值填進去囉! 如下:

var temp=[];
$.each($scope.data,function(i,v){
    temp.push(v);
})

這樣一來! 一個嶄新的temp資料就誕生了! (感動....

這過程我把它叫作多重影分身之術!

photo credit: Xosé Castro via photopin cc

沒錯! 這新誕生的資料就如同鳴人的影分身一般，每個都是獨立的! 

就算一個影分身被曉的成員幹掉，也不影響其他的影分身! (侯賽雷阿!~