iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 8
0
自我挑戰組

前端工程師的30份套餐系列 第 8

Day8 -基礎陣列與展開運算符

  • 分享至 

  • xImage
  •  

陣列定義

陣列的索引值從0開始,可以用[]括號來改變陣列成員的值,或者取得指定值。

const a = []    //空陣列
const b = [1,2,3]

a[0] = 1
a[1] = 2
a[2] = 3
a[1] = 4

console.log(typeof a) //object
console.log(a) //[1,4,3]
console.log(a.length) //3

多維陣列

是指陣列中的陣列,例如以下範例:

const array = [
    [1,2,3],
    [4,5,6],
    [7,8,9]
]
console.log(array[1][2]) //答案會是什麼呢?

.
.
.
.
.
.
.
答案是5
因為array[1] = [3,4,5],之中的第三個就是5


判斷是否為陣列

最常見的情況是,使用到的函式要求傳入的參數是陣列,而且不能是物件或其他類型,要如何判斷傳進來的值是一個陣列呢?

直接使用typeof的話,對陣列資料類型只會回傳object

isArray:是個ES5的方法,如範例:
const a = [6, 1, 8]
console.log(Array.isArray(a)) //true

展開運算符(spread operator)

透過點點點的方式現在很常被使用,主要是可以把陣列中的元素取出

let number = [1,2,3,4,5];
console.log(...number)  //1,2,3,4,5

也可以用來組合陣列

const a = [1, 2, 3]
const b = [...aArray,4,5,6]
console.log(b) //[1,2,3,4,5,6]

展開運算符的運用

  • 合併陣列
const arr1 = ['a', 'b'];
const arr2 = ['c'];
const arr3 = ['d', 'e'];

// ES5 的合併陣列
arr1.concat(arr2, arr3);
// [ 'a', 'b', 'c', 'd', 'e' ]

// ES6 的合併陣列
[...arr1, ...arr2, ...arr3]
// [ 'a', 'b', 'c', 'd', 'e' ]
  • 字符串的陣列
[...'hello']
// [ "h", "e", "l", "l", "o" ]

上一篇
Day7- ES6 解構賦值
下一篇
Day9- 陣列處理方法: map()、reduce()和filter()
系列文
前端工程師的30份套餐30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言