Object, Array và Tuple trong TypeScript

Object, Array và Tuple là ba cấu trúc dữ liệu cốt lõi trong mọi ứng dụng. Biết cách gán kiểu chính xác cho chúng sẽ giúp bạn xây dựng hệ thống dữ liệu ổn định và dễ bảo trì.

---

1. Nội dung chính

• Định nghĩa object với kiểu rõ ràng
• Khai báo array với kiểu phần tử
• Điểm khác nhau giữa array và tuple
• Ứng dụng object + array trong thực tế
• Khi nào nên dùng tuple thay vì object

---

2. Ví dụ chi tiết

2.1. Object

// Object với kiểu inline
const user: {
  id: number;
  name: string;
  isActive: boolean;
} = {
  id: 1,
  name: "Alice",
  isActive: true,
};

// Sử dụng type alias (recommended)
type User = {
  id: number;
  name: string;
  isActive: boolean;
  email?: string; // optional property
};

const user2: User = {
  id: 2,
  name: "Bob",
  isActive: false,
  email: "bob@example.com"
};

// Object với method
type Calculator = {
  add: (a: number, b: number) => number;
  subtract: (a: number, b: number) => number;
  history: number[];
};

const calc: Calculator = {
  add: (a, b) => a + b,
  subtract: (a, b) => a - b,
  history: []
};

2.2. Array

// Array với kiểu cơ bản
const numbers: number[] = [1, 2, 3, 4, 5];
const names: Array<string> = ["Bob", "Charlie", "Alice"];

// Array với kiểu phức tạp
const users: User[] = [
  { id: 1, name: "Alice", isActive: true },
  { id: 2, name: "Bob", isActive: false }
];

// Array methods với type safety
const doubled = numbers.map(n => n * 2); // number[]
const filtered = names.filter(name => name.length > 5); // string[]
const found = users.find(user => user.id === 1); // User | undefined

// Multi-dimensional arrays
const matrix: number[][] = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

const coordinates: [number, number][] = [
  [10, 20],
  [30, 40],
  [50, 60]
];

2.3. Tuple

// Tuple cơ bản
const userInfo: [number, string, boolean] = [1, "Alice", true];

// Tuple với 2 phần tử - thường dùng cho coordinates
const point: [number, number] = [10, 20];
const point3D: [number, number, number] = [10, 20, 30];

// Tuple cho HTTP response
const response: [number, string] = [200, "OK"];
const errorResponse: [number, string] = [404, "Not Found"];

// Tuple với optional elements
const rgb: [number, number, number, number?] = [255, 0, 0]; // Alpha optional
const rgba: [number, number, number, number] = [255, 0, 0, 0.5];

// Tuple cho function return multiple values
function getUserInfo(): [number, string, boolean] {
  return [1, "Alice", true];
}

const [id, name, active] = getUserInfo(); // Destructuring

2.4. Array of Object

// Array of objects - pattern phổ biến
type Product = {
  id: number;
  title: string;
  price: number;
  inStock: boolean;
};

const products: Product[] = [
  { id: 1, title: "Keyboard", price: 100, inStock: true },
  { id: 2, title: "Mouse", price: 50, inStock: false },
  { id: 3, title: "Monitor", price: 500, inStock: true }
];

// CRUD operations với type safety
function addProduct(product: Product): void {
  products.push(product);
}

function findProductById(id: number): Product | undefined {
  return products.find(p => p.id === id);
}

function updateProduct(id: number, updates: Partial<Product>): void {
  const index = products.findIndex(p => p.id === id);
  if (index !== -1) {
    products[index] = { ...products[index], ...updates };
  }
}

function filterProducts(predicate: (p: Product) => boolean): Product[] {
  return products.filter(predicate);
}

// Usage
const expensiveProducts = filterProducts(p => p.price > 300);
const availableProducts = filterProducts(p => p.inStock);

---

3. Kiến thức trọng tâm

3.1. Object giúp mô tả rõ cấu trúc dữ liệu

• Mọi ứng dụng đều dựa vào object để tổ chức thông tin: user, product, order
• Type safety giúp tránh lỗi khi truy cập properties
• Optional properties với dấu ? cho flexibility

💡 GHI NHỚ: Luôn định nghĩa type cho object để có autocomplete và type checking

3.2. Array chỉ định kiểu phần tử giúp tránh lỗi runtime

• Nếu array là number[], bạn không thể đẩy string vào — loại bỏ hàng loạt bug logic
• Array methods như map, filter, find đều có type safety
• Generic Array và T[] là equivalent

3.3. Tuple phù hợp khi dữ liệu có số lượng phần tử cố định và có thứ tự

• Tọa độ (x, y) - perfect use case cho tuple
• [statusCode, message] - HTTP response pattern
• Kết quả hàm trả về nhiều giá trị - alternative to object

⚠️ GHI NHỚ: Tuple khác array ở chỗ length và types là fixed

---

4. Bài tập thực hành

Bài 1: Tạo object product

type Product = {
  id: number;
  name: string;
  price: number;
  category?: string;
};

const product: Product = {
  id: 1,
  name: "Laptop",
  price: 1000,
  category: "Electronics"
};

Bài 2: Tạo mảng scores

const scores: number[] = [1, 2, 3, 4, 5];

// Hoặc với Array generic
const scores2: Array<number> = [1, 2, 3, 4, 5];

// Với validation
function validateScores(scores: number[]): boolean {
  return scores.every(score => score >= 0 && score <= 5);
}

console.log(validateScores(scores)); // true

Bài 3: Tạo tuple response

type HttpResponse = [number, string];

const successResponse: HttpResponse = [200, "OK"];
const errorResponse: HttpResponse = [404, "Not Found"];
const serverError: HttpResponse = [500, "Internal Server Error"];

// Với destructuring
const [statusCode, message] = successResponse;
console.log(`Status: ${statusCode}, Message: ${message}`);

---

5. Sai lầm thường gặp

• Dùng array thay vì tuple cho fixed-length data
• Không định nghĩa type cho object - mất type safety
• Mix different types trong array không có union type
• Quên handle undefined khi dùng array methods như find
• Dùng tuple quá phức tạp - đôi khi object đơn giản hơn

⚠️ GHI NHỚ: KISS principle - Keep It Simple and Straightforward

---

6. Kết luận

Nắm vững object, array và tuple giúp bạn tổ chức dữ liệu một cách chặt chẽ và an toàn. Đây là nền tảng quan trọng để bước sang interface, type alias và các kỹ thuật nâng cao hơn.

🔑 GHI NHỚ QUAN TRỌNG:

• Object: Định nghĩa cấu trúc dữ liệu với named properties
• Array: Collection của cùng kiểu dữ liệu với dynamic length
• Tuple: Fixed-length array với known types từng vị trí
• Luôn định nghĩa types để có type safety và autocomplete
• Chọn đúng cấu trúc cho từng use case để code clean và maintainable