今天的主題是資料管理結構!
在這裡先簡單介紹一下兩種資料管理結構,分別是陣列(array)、物件(object)
陣列(array)
透過index管理資料,有固定排序,但是沒有名稱的資料結構。
物件(object)
透過key管理資料,沒有固定的排序,但是有名稱的資料結構。(key值通常是字串)
接下來就來進一步聊聊陣列(array)這個資料管理結構吧!


宣告陣列
首先,想要宣告一組陣列的話,要怎麼做呢?
說到宣告,就要先寫個let,接著寫出想要幫這組陣列取的名字,
再來用[ ]符號把陣列資料給框起來,中間用","區隔。
也就會是以下這樣。
image

取出陣列資料
想取出陣列資料的話,要先打出這個陣列的名字,告訴電腦我們要的陣列是哪個陣列,
接著一樣用[ ]符號,指定要取出哪一個內容。
還記得陣列是有排序,但沒有名字的資料結構嗎?
那要怎麼指定要取出哪個內容呢?
正確打案就是!!用數字指定!
注意!
陣列只能用數字來指定,但是排序卻是從0開始
所以從第一個陣列內容開始的代表數字會是0、1、2、3、4......
也就是以上述範例為例的話,想要取出Jolin這個名字,就必須使用數字2來指定。
image
增加陣列元素
想要增加一個元素時,除了可以直接在[ ]再追加新的元素內容外,還可以試試看其他方式。
(尤其在要加的元素內容很龐大時,如果還一個一個加,那就太沒有效率了)

1. 使用push:使用這個方式,可以把要新增的元素,加到陣列的最後面。
使用方式:一樣要寫出自己要放入元素的陣列名稱,接著加上.push(),
然後在( )裡面加上要新增的元素。

實際寫法也就會變成
要加入元素的陣列名.push(新增元素1, 新增元素2, ...)
範例:myFriendName.push('Hebe','Ella', 'selina')
image
2. 使用concat:使用這個方式,會新開一個陣列,新的陣列會和舊的陣列合併。
使用方式:因為是新開一個陣列,所以會重新宣告一組的新的陣列,那也就需要先寫出let,
並加上新陣列的名稱,然後這組陣列是和舊陣列合併,所以在等於的右邊也就會是指定要合併的舊陣列名稱,
接著加上,concat( ),然後裡面是新的陣列,所以會用[ ]框起來。

實際寫法也就會變成
let 新陣列名 = 舊陣列名.concat([新增元素1、新增元素2, ....])
範例:let myNewFriendName = myFriendName.concat(['Hebe','Ella', 'selina'])
image

3. 使用unshift
使用這個方式,會將要新增的元素加到陣列的最前面。
使用方式:先寫出要新增元素的陣列名稱,再加上.unshift(),
( )內加入要新增的元素。
實際寫法也就會變成
要加入元素的陣列名.unshift(新增元素1, 新增元素2, ...)
範例:myFriendName.unshift('Hebe','Ella')
image


移除元素
1. 使用pop:可以從陣列中刪除陣列中的最後一個元素,和push的用法相反。
使用方式:先寫出要刪除元素的陣列名稱,再加上.pop()。
實際寫法也就會變成
要刪除元素的陣列名.pop()
範例:myFriendName.pop()
image
*在第3行進行刪除後,顯示刪除元素的陣列。

2. 使用shift:將陣列中的第一個元素移除,和unshift的用法相反。

使用方式:先寫出要刪除元素的陣列名稱,再加上.shift()。
實際寫法也就會變成
要刪除元素的陣列名.shift()
範例:myFriendName.shift()
image

3. 使用splice:可以從指定的元素開始刪掉特定數量的元素。
使用方式:先寫出要刪掉元素的陣列名稱,接著加上.splice(),( )裡面寫上兩個數字,中間用","區隔,
這兩個數字分別代表從哪裡開始刪除,和刪除幾個元素。
實際寫法也就會變成
要刪除元素的陣列名.splice(從幾號元素開始刪除,刪除幾個元素)
範例:myFriendName.splice(1,2)
* 刪除從Ashley這個元素開始的兩個元素
image

其他
length:計算陣列的長度。
使用方法:先寫出要計算長度的陣列名稱,再加上.length。
實際寫法也就會變成
要計算長度的陣列名.length
範例:myFriendName.length
image

補充注意!
在陣列中使用+=會變成怎樣?
可能有人會想到,用"+="來增加新的元素到陣列裡面,但是用這樣的方法可能會造成一些問題。
實際來看看是什麼情況吧~
image
使用+=後,加入兩個元素後,反而變成了一串字串了。
而當使用數字0試圖存取第一個元素時,則變成取這一串字串的第一個英文字。
所以在使用+時,需要非常注意,使用+=是無法正常加新元素加入陣列中的喔!

陣列大致上複習到這裡了~
那就先掰餔囉:D
 

arrow
arrow
    創作者介紹
    創作者 文科少女寫程式 的頭像
    文科少女寫程式

    文科少女學程式

    文科少女寫程式 發表在 痞客邦 留言(0) 人氣()