以多筆資料的形式列出來，這就是陣列 (array)，一個變數中只能儲一項資料，若改用「陣列」的話就能結合多項資料，成為一個群組。
01-建立陣列
建立方式
1 | var 變數名稱 = [] |
1 | var 變數名稱 = [資料 0, 資料 1, 資料 2, 資料 3, 資料 4, ..., 資料 X(最後一筆不加逗號)] |
- 使用中括號(也稱方括號) [] ，一般會將建立完成的陣列儲於變數中。
- 陣列元素數量為0的陣列，javascript 先建立元素數量為 0 的陣列 (變可稱為空陣列)，以第0筆開始。
- 每筆資料用逗號隔開、寫在 [] 方括號中，最後一筆不使用逗號。
- 一組陣列中存放的元素個數沒有限制。
讀取出陣列中的所有資料
1 2 | // 變數名稱[索引編號] var todo = ['完成設計方案', '整理資料', '申請加入讀書會', '買牛奶']; |
- 如果使用 console.log(todo[0]); 在主控台會出現 "完成設計方案"
- alert(todo[3]); 彈出視窗會出現 完成設計方案 字串
- alert(todo); 彈出視窗會出現 完成設計方案,整理資料,申請加入讀書會,買牛奶
- console.log(todo); 輸出主控台會出現 ["完成設計方案", "整理資料", "申請加入讀書會", "買牛奶"]
可用length算出數量
1 | console.log(colors.length); |
See the Pen javascirpt-陣列基本運用 by Jimmy_Wu (@Jimmy_Wu) on CodePen.
1 2 3 4 5 | // 讀取出陣列中的所有資料 for(var i=0; i<todo.length; i++){ console.log(todo[i]); //alert(todo[i]); } |
1 2 3 4 | "完成設計方案" "整理資料" "申請加入讀書會" "買牛奶" |
如果使用 alert(todo[i]); 的話，有多少筆就會跑多第筆的回圈資料，目前有四筆就會彈四次，每次秀出每筆
See the Pen 讀取出陣列中的所有資料 by Jimmy_Wu (@Jimmy_Wu) on CodePen.
02-陣列使用方法
陣列中加入新的資料
1 2 3 | // 陣列的變數名稱 + 方法 ('加入的資料') // 例如：陣列列後加入此筆資料 todo.push = ('去看牙醫'); |
常用的新增、刪除陣列方法：
陣列變數名稱.pop() ，刪除最後筆資料。
陣列變數名稱.push(資料) ，在陣列最後面新增資料。
陣列變數名稱.shift() ，刪除陣列最後筆資料。
陣列變數名稱.unshift(資料一, 資料二, ...) ，陣列最前面新增多筆資料。
1 2 3 4 5 6 7 8 9 10 11 | var todo = ['完成設計方案', '整理資料', '申請加入讀書會', '買牛奶']; // 陣列列後加入此筆資料 todo.push = ('去看牙醫'); // 陣列最前面新增多筆資料 todo.unshift('創意發想', '畫初稿') // 讀取出陣列中的所有資料 for(var i=0; i<todo.length; i++){ console.log(todo[i]); //alert(todo[i]); } |
1 2 3 4 5 6 | "創意發想" "畫初稿" "完成設計方案" "整理資料" "申請加入讀書會" "買牛奶" |
See the Pen 陣列中加入新的資料 by Jimmy_Wu (@Jimmy_Wu) on CodePen.