ES6 基本用法 - daniel-qa/Vue GitHub Wiki

特性	說明	範例	常用方法 / 操作
Set	(去重)儲存不重複元素，無順序	const s = new Set([1,2,2,3]); // Set {1,2,3}	add(val), delete(val), has(val), clear(), size, forEach()
Map	鍵值對，鍵可以是任意類型	const m = new Map(['name','Alice'](/daniel-qa/Vue/wiki/'name','Alice')); m.get('name'); // 'Alice'	set(key,val), get(key), has(key), delete(key), clear(), size, forEach()
Symbol	唯一值，可用作物件鍵，避免衝突	const id = Symbol('id'); const obj = {[id]:123}; obj[id]; // 123	N/A
let / const	let: 區塊級變數；const: 不可重新賦值	let x=10; const y=[1,2]; y.push(3);	N/A
解構賦值	陣列或物件快速取值	const [a,b] = [1,2]; const {name,age} = {name:'Alice',age:25};	N/A
Template string	字串插變數值，支援多行，簡單 JS 表達式	const name='Alice'; `Hello ${name}` // Hello Alice	N/A
Arrow function	簡潔函數寫法	const sum=(x,y)=>x+y;	N/A

• Template string（反引號 `）

Template string 的強大之處就是：

可以直接放 JavaScript 變數

也可以放任何表達式，例如算術運算、函數呼叫、物件屬性取值…

---

mplate string 裡的 ${...} 只能放 JavaScript 表達式（expression），而不是完整的程式區塊或語句（statement）。

可以放的例子（expression）：

const name = 'Alice';
const age = 25;

console.log(`Hello ${name}`);            // 變數
console.log(`Next year: ${age + 1}`);    // 算術運算
console.log(`Score: ${Math.max(10, 20)}`); // 函數呼叫
console.log(`First score: ${[90,80,70][0]}`); // 陣列取值

不能放的例子（statement / 完整程式區塊）：

// 以下會報錯
console.log(`Check: ${if(age>18) 'adult' else 'minor'}`);
console.log(`Loop: ${for(let i=0;i<5;i++) console.log(i)}`);

💡 總結：

可以理解成「可以放簡單 JS 表達式」

不可以直接放整段 script 或語句（像宣告變數、for/if 等完整程式區塊）

如果想做邏輯判斷或多行程式，先在 Template string 外計算好值，再把結果放進 ${}

---

範例說明：

const name = 'Alice';
const age = 25;
const scores = [90, 80, 70];

console.log(`Hello ${name}, you are ${age} years old.`);
// Hello Alice, you are 25 years old.

console.log(`Next year, you will be ${age + 1}.`);
// Next year, you will be 26.

console.log(`Your first score is ${scores[0]}.`);
// Your first score is 90

console.log(`Random number: ${Math.floor(Math.random()*100)}`);
// Random number: 0~99 之間的數字

• Symbol

基本概念

Symbol 是 ES6 新增的一種 原始資料類型（primitive type），像 number、string、boolean 一樣。

每個 Symbol 都是唯一的，就算描述文字相同，也不會相等。

const s1 = Symbol('id');
const s2 = Symbol('id');

console.log(s1 === s2); // false

這裡即使描述都寫 'id'，s1 和 s2 還是不同的 Symbol。

用途：作為物件鍵（Property Key）

普通物件屬性鍵通常是字串，容易跟其他鍵衝突。

Symbol 作為鍵，可以確保 不會被覆蓋 或意外衝突。

const id = Symbol('id'); const obj = { [id]: 123, name: 'Alice' };

console.log(obj[id]); // 123 console.log(obj.name); // 'Alice'

注意：obj.id 是 undefined，因為 Symbol 鍵不是字串，必須用 [id] 取值。