昨天(Day 1)我用一個簡單的數字陣列 [80, 95, 60],自己寫迴圈算平均值和最高分。
那算是基本功練習,今天繼續往下學,接觸到 物件 跟 陣列操作方法。
物件可以想像成一張「學生資料卡」,裡面放著名字、分數這些屬性。
let student = {
name: "小明",
score: 80
};
// 點記法
console.log(student.name); // "小明"
// 方括號記法
let key = "score";
console.log(student[key]); // 80
我發現:點記法最常用,方括號則適合在屬性名稱是變數或特殊字元時使用。
昨天我用 for 迴圈來累加、找最大值,程式雖然能跑,但看起來有點笨重。
今天學到陣列內建的方法,可以讓程式更簡潔:
let scores = [60, 75, 90];
// forEach:逐一處理
scores.forEach(s => console.log("分數:", s));
// map:轉換成新陣列
let doubled = scores.map(s => s * 2);
console.log(doubled); // [120, 150, 180]
// filter:篩選符合條件的元素
let passed = scores.filter(s => s >= 60);
console.log(passed); // [60, 75, 90]
// reduce:累積運算
let sum = scores.reduce((acc, s) => acc + s, 0);
console.log(sum); // 225
這些方法一開始看起來有點陌生,但實際用過後,真的比自己寫迴圈清楚很多。
物件和陣列在複製時要小心。
直接賦值只是「共用同一份資料」,修改其中一個會影響到另一個。
let arr1 = [1, 2, { score: 90 }];
let arr2 = arr1; // 指向同一份
arr2[2].score = 100;
console.log(arr1[2].score); // 100 → 一起被改掉
這才知道為什麼有「淺拷貝」跟「深拷貝」的差別:
今天挑戰一個小任務,用一組學生名單來做練習:
let students = [
{ name: "小明", score: 80 },
{ name: "小美", score: 55 },
{ name: "阿土", score: 90 },
{ name: "阿花", score: 40 }
];
// 1. 篩選及格的學生
let passedNames = students
.filter(s => s.score >= 60)
.map(s => s.name);
console.log("及格學生名單:", passedNames);
// ["小明", "阿土"]
// 2. 計算平均分數
let total = students.reduce((acc, s) => acc + s.score, 0);
let average = total / students.length;
console.log("平均分數:", average);
// 66.25
// 3. 找出最高分的學生
let topStudent = students.reduce((max, s) => (s.score > max.score ? s : max));
console.log("最高分學生:", topStudent.name);
// "阿土"
// 4. 排行榜
let ranking = [...students].sort((a, b) => b.score - a.score);
console.log("成績排行榜:", ranking.map(s => `${s.name} (${s.score})`));
// ["阿土 (90)", "小明 (80)", "小美 (55)", "阿花 (40)"]
這裡剛好用到了今天學的 filter、map、reduce 和 sort,感覺就像一整套工具箱派上用場。
昨天用迴圈做資料處理時,覺得程式碼寫起來有點「重複又囉嗦」。
今天學到的這些方法,讓我能更快完成一樣的事情:
filter
➡ 幫我挑出及格的學生
map
➡ 把名字清單整理出來
reduce
➡ 算平均、找最高分
sort
➡ 排出成績榜
這樣寫程式的感覺更清楚、更直觀。
對我這個初學者來說,最大的收穫是:
不要什麼都靠迴圈,其實陣列本身就有很多好用的方法。
明天 Day 3 要學 ES6 的語法(解構、展開、模板字串),希望能讓程式碼更簡潔。