iT邦幫忙

DAY 27
4

用 HTML5 和 JavaScript 學習開發 Windows 8 Apps系列 第 27

Day28 關於 JavaScript 清空 Array 的方法

  • 分享至 

  • xImage
  •  

這主題是有點離題了,不過今天剛學到的,轉載於我原本的 blog http://yiyingloveart.blogspot.tw/

清空 Array 有兩種方式
一種是:Array.length = 0;
另一種是:Array = [ ];

[觀念更正]
Array = [ ] 其實不能算是清空Array的方式,只能說有人會這樣做,
但是意義並不是清空的意思。
感謝 fillano 大大指正觀念 :)
哪種好?看一下例子。其實我覺得差不多耶,看你的需求。。。

我去買菜,本來袋子裡沒東西

var myBag = [];

後來夾了幾樣水果,就變成

myBag = ['apple', 'orange', 'watermelon'];

結果隔壁老王想要學我拿一樣的水果,複製一整個 myBag 給 mrWang;

var mrWang;
mrWang = myBag;

現在來看看我跟老王的袋子:

console.log(myBag);
console.log(mrWang);

----你會得到這樣的結果----
["apple", "orange", "watermelon", $family: function, $constructor: function, each: function, clone: function, clean: function…]
["apple", "orange", "watermelon", $family: function, $constructor: function, each: function, clone: function, clean: function…]
如果我再問問console.log myBag == mrWang? 會得到 true
myBag == mrWang
true

後來我反悔了,不想買水果,全部還回去。
(1) 如果用第一種方法清空 Array

myBag=[];

現在來看看我跟老王的袋子:

console.log(myBag);
console.log(mrWang);

----你會得到這樣的結果----
[$family: function, $constructor: function, each: function, clone: function, clean: function…]
["apple", "orange", "watermelon", $family: function, $constructor: function, each: function, clone: function, clean: function…]

(2) 那麼如果用第二種方法清空 Array:

myBag.length = 0;

現在來看看我跟老王的袋子:

console.log(myBag);
console.log(mrWang);

----你會得到這樣的結果----
[]
[]

以上的實驗,
差別在於用 array.length = 0 的方式會讓
我的 myBag 的內容都清空,同時學我的老王,也會跟我一樣把他自己的袋子給清空,真是學得徹底啊。
簡單來講用 array.length 會把原本參考你 Array 的內容也一起清空。

參考文章: http://davidwalsh.name/empty-array

真有趣,又學到了一招 :)
真是覺得 JavaScript 越來越難懂了.... 疑惑


上一篇
Day27 Split App 實作官方範例 Blog Reader (4)
下一篇
Day28 Split App 實作官方範例 Blog Reader (5)
系列文
用 HTML5 和 JavaScript 學習開發 Windows 8 Apps30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中
0
SunAllen
iT邦研究生 1 級 ‧ 2013-10-12 23:59:21

沙發
火星文大神~~~讚讚讚讚病

yiying iT邦新手 1 級 ‧ 2013-10-13 00:00:05 檢舉

呵呵xdd

0
fillano
iT邦超人 1 級 ‧ 2013-10-13 00:31:37

有一些觀念的問題...

在Javascript中,變數其實是存放物件的參考。所以:

<pre class="c" name="code">
var a = [];
a = ['a', 'b', 'c'];

這一段程式中,第一行是產生一個陣列物件,裡面沒有元素,然後把它的參考給變數a。第二行是產生另外一個陣列物件,裡面有三個元素,然後把它的參考給變數a。

在這兩行中,其實a變數已經被改過兩次。另外:

<pre class="c" name="code">
var a = ['a', 'b', 'c'];
var b = a;
a = [];

這一段程式,第一行是產生一個有三個元素的陣列物件,然後把它的參考給變數a,第二行是把變數a中的參考給b變數,第三行是產生一個新的空陣列,然後把它的參考給a變數。第三行的動作並不是清空陣列,而在第一行產生的陣列物件,他的參考仍然保存在b變數中。

如果我把程式第三行改成:

<pre class="c" name="code">
a.length = 0;

這個動作就是直接對陣列物件操作,而這個陣列物件的參考同時存放在a變數及b變數中,所以看起來就是同時被清空了。

yiying iT邦新手 1 級 ‧ 2013-10-13 00:39:54 檢舉

瞭解了
謝謝 fillano 細心的解釋謝謝
恩,所以說 真正要講清空,Array.length = 0 才算是有清空的意思
而 Array = [ ] 只是重新給一個參考嗎?

fillano iT邦超人 1 級 ‧ 2013-10-13 00:55:22 檢舉

是的哈哈

yiying iT邦新手 1 級 ‧ 2013-10-13 08:45:19 檢舉

恩恩謝謝您 :)

0
WILL.I.AM
iT邦新手 3 級 ‧ 2023-07-19 15:52:03

如果array是宣告成常數const,則使用array = [ ]會出錯, Error: Assignment to constant variable.

但可以用array.length = 0 的方式來清空

yiying iT邦新手 1 級 ‧ 2024-07-18 12:00:15 檢舉

謝謝!
抱歉好久沒登入 ithome,沒注意你的留言

我要留言

立即登入留言