+1

JavaScript cơ bản Bài 3: Biến (Variables): Khái niệm let, const, var và cách lưu trữ dữ liệu

1. Mục tiêu bài học

  • Hiểu được khái niệm Biến (Variable) là gì và tại sao chúng ta cần dùng biến.

  • Phân biệt và biết cách sử dụng đúng các từ khóa khai báo biến: let, const, và var.

  • Nắm vững quy tắc đặt tên biến chuẩn chỉnh trong JavaScript.

2. Nội dung chi tiết (Script / Outline)

Phần 1: Biến là gì? (Ẩn dụ cái hộp chứa đồ)

Hãy tưởng tượng chương trình máy tính của bạn là một kho hàng lớn, và bạn có rất nhiều món đồ cần cất giữ (tên người, điểm số, trạng thái đăng nhập...).

  • Biến (Variable) giống như một cái hộp có dán nhãn để chứa dữ liệu bên trong.

  • Thay vì nhớ các giá trị phức tạp, bạn chỉ cần nhớ cái tên của cái hộp (tên biến) và lấy ra dùng khi cần thiết.

Phần 2: Khai báo biến trong JavaScript (let, const, var)

Trong JavaScript hiện đại (ES6+), chúng ta có 3 từ khóa để khai báo biến, nhưng mục đích sử dụng sẽ khác nhau:

  1. const (Constant - Hằng số):

    • Dùng để khai báo những dữ liệu không thay đổi trong suốt quá trình chạy chương trình (ví dụ: số Pi, URL của API, cấu hình hệ thống).

    • Đặc điểm: Một khi đã gán giá trị thì không thể gán lại giá trị mới cho nó.

    • Ví dụ: const PI = 3.14; hoặc const maxScore = 100;

  2. let (Biến có thể thay đổi):

    • Dùng để khai báo những dữ liệu có thể thay đổi giá trị sau này (ví dụ: điểm số của người chơi, trạng thái giỏ hàng, số lần click).

    • Đặc điểm: Có thể gán lại giá trị thoải mái.

    • Ví dụ:

      JavaScript

      let score = 10;
      score = 15; // Hợp lệ, điểm số đã tăng lên 15
      
      
  3. var (Cách cũ - Nên tránh dùng):

    • Đây là cách khai báo biến từ thời kỳ đầu của JavaScript.

    • Tại sao ít dùng? var có những lỗi về phạm vi biến (scope) rất khó kiểm soát và dễ gây ra các lỗi ngớ ngẩn trong code lớn.

    • Lời khuyên: Hãy quên var đi và luôn ưu tiên dùng const (mặc định) và let (khi cần thay đổi giá trị).

Phần 3: Quy tắc đặt tên biến chuẩn chỉnh (Best Practices)

Không phải thích đặt tên gì cũng được. Để code chuyên nghiệp và dễ đọc, hãy tuân theo các quy tắc sau:

  1. Phân biệt chữ hoa / chữ thường (Case-sensitive): Biến age và Age là hoàn toàn khác nhau.

  2. Không bắt đầu bằng số: let 1stUser = "An"; →\rightarrow Lỗi! Phải viết là let user1 = "An";.

  3. Quy tắc lạc đà (CamelCase): Từ chữ cái thứ hai trở đi phải viết hoa chữ cái đầu tiên (rất phổ biến trong JS).

    • Ví dụ chuẩn: let fullName = "Nguyen Van A";, let isLogin = true;
  4. Đặt tên có ý nghĩa: Không đặt tên biến vô nghĩa kiểu let a = "An";, hãy đặt rõ ràng let studentName = "An";.

3. Tổng kết & Bài tập nhỏ cho học viên

  • Key takeaway:

    • Biến là cái hộp chứa dữ liệu.

    • Luôn ưu tiên dùng const, khi nào cần thay đổi giá trị mới dùng let. Tránh xa var.

  • Thử thách tại nhà:

    • Khai báo một hằng số (const) lưu tên của bạn.

    • Khai báo một biến (let) lưu tuổi hiện tại của bạn.

    • Sau đó, dùng console.log() để in ra một câu hoàn chỉnh: "Xin chào, tôi tên là [Tên], năm nay tôi [Tuổi] tuổi."

Bạn thấy bài 3 này đã rõ ràng chưa? Khi nào bạn sẵn sàng, chúng ta chuyển tiếp sang Bài 4 (Kiểu dữ liệu nguyên thủy: Số, Chuỗi, Boolean, Null, Undefined) nhé!


All rights reserved

Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí