JS 常見的陣列操作

1
2
3
4
5
6
7

// todolist 資料容器
let todoListData = []

// 編號用隨機亂數
function newId () {
  return ~ (Date.now() + (Math.random()*50))
}

1
2
3
4
5
6

let newTodoData = {
  "id": newId(),
  "title": "買早餐",
  "info": "要漢堡跟可樂"
}
todoListData.push(newTodoData)

1

todoListData.length = 0

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

// 要被刪除的 id
const id = 385746993

// 找 id 存在的 index 位置
const listIndex = todoListData.findIndex(element => element.id == id)

// 若 id 存在就刪除
if (listIndex > -1) {
  todoListData.splice(listIndex, 1)
}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12

// 要尋找的 id
const id = 385746993

// 找 id 的 index 位置
const listIndex = todoListData.findIndex(element => element.id == id)

// 顯示資料及找不到 id 的處理
if (listIndex < 0) {
  console.log("找不到:" + id)
} else {
  return todoListData[listIndex]
}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

// 要修改的 id 與內容
const id = 385746993
const newTitle = "買下午茶"
const newInfo = "檸檬蛋糕起司塔"

// 找 id 的 index 位置
const listIndex = todoListData.findIndex(element => element.id == id)

// 修改資料及找不到 id 的處理
if (listIndex < 0) {
  console.log("找不到:" + id)
} else {
  todoListData[listIndex].title = newTitle
  todoListData[listIndex].info = newInfo
}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

[3, 4, 5, 6].at(1); // 4
[3, 4, 5, 6].pop(); // [3, 4, 5]
[3, 4, 5, 6].push(7); // [3, 4, 5, 6, 7]
[3, 4, 5, 6].fill(1); // [1, 1, 1, 1]
[3, 4, 5, 6].join("-"); // '3-4-5-6'
[3, 4, 5, 6].shift(); // [4, 5, 6]
[3, 4, 5, 6].reverse(); // [6, 5, 4, 3]
[3, 4, 5, 6].unshift(1); // [1, 3, 4, 5, 6]
[3, 4, 5, 6].includes(5); // true
[3, 4, 5, 6].map((num) => num + 6); // [9, 10, 11, 12]
[3, 4, 5, 6].find((num) => num > 4); // 5
[3, 4, 5, 6].filter((num) => num > 4); // [5, 6]
[3, 4, 5, 6].every((num) => num > 5); // false
[3, 4, 5, 6].findIndex((num) => num > 4); // 2
[3, 4, 5, 6].reduce((acc, num) => acc + num, 0); // 18