Giới thiệu về JavaScript#

JavaScript là một ngôn ngữ lập trình kịch bản (scripting language) chủ yếu được sử dụng để tạo ra các trang web tương tác. JavaScript có thể được sử dụng cả ở phía client (trình duyệt web) và phía server (ví dụ như Node.js).

Các khái niệm cơ bản#

1. Cú pháp cơ bản#

Dưới đây là một ví dụ đơn giản về cú pháp của JavaScript:

// Đây là một dòng comment
/*
Đây là một comment nhiều dòng
*/

// Khai báo biến
var x = 5;
let y = 10;
const z = 15;

// In ra console
console.log(x, y, z);

2. Biến và hằng#

JavaScript cung cấp ba cách để khai báo biến: var, let, và const.

• var: Khai báo một biến có phạm vi toàn cục hoặc phạm vi hàm.
• let: Khai báo một biến có phạm vi khối (block scope).
• const: Khai báo một hằng số, giá trị không thể thay đổi sau khi được gán.

3. Kiểu dữ liệu#

JavaScript hỗ trợ nhiều kiểu dữ liệu bao gồm:

• Number: Số (cả số nguyên và số thập phân)
• String: Chuỗi ký tự
• Boolean: Giá trị đúng hoặc sai (true/false)
• Object: Đối tượng
• Array: Mảng
• Null: Giá trị rỗng
• Undefined: Giá trị chưa được định nghĩa

Ví dụ về các kiểu dữ liệu:

let number = 42; // Number
let name = "John"; // String
let isTrue = true; // Boolean
let person = { firstName: "John", lastName: "Doe" }; // Object
let numbers = [1, 2, 3, 4, 5]; // Array
let emptyValue = null; // Null
let undefinedValue; // Undefined

3. Kiểu dữ liệu#

JavaScript hỗ trợ nhiều kiểu dữ liệu bao gồm:

• Number: Số (cả số nguyên và số thập phân)
• String: Chuỗi ký tự
• Boolean: Giá trị đúng hoặc sai (true/false)
• Object: Đối tượng
• Array: Mảng
• Null: Giá trị rỗng
• Undefined: Giá trị chưa được định nghĩa

Ví dụ về các kiểu dữ liệu:

let number = 42; // Number
let name = "John"; // String
let isTrue = true; // Boolean
let person = { firstName: "John", lastName: "Doe" }; // Object
let numbers = [1, 2, 3, 4, 5]; // Array
let emptyValue = null; // Null
let undefinedValue; // Undefined

4. Toán tử#

JavaScript hỗ trợ nhiều loại toán tử khác nhau:

• Toán tử số học: +, -, *, /, %
• Toán tử gán: =, +=, -=, *=, /=
• Toán tử so sánh: ==, ===, !=, !==, >, <, >=, <=
• Toán tử logic: &&, ||, !

Ví dụ về các toán tử:

let a = 10;
let b = 20;

console.log(a + b); // 30
console.log(a > b); // false
console.log(a == 10 && b == 20); // true

5. Cấu trúc điều khiển#

JavaScript cung cấp các cấu trúc điều khiển như if, else, switch, for, while, và do...while.

Ví dụ về cấu trúc điều khiển:

let age = 18;

// Câu lệnh if-else
if (age >= 18) {
  console.log("Bạn đã đủ tuổi trưởng thành.");
} else {
  console.log("Bạn chưa đủ tuổi trưởng thành.");
}

// Vòng lặp for
for (let i = 0; i < 5; i++) {
  console.log(i);
}

// Vòng lặp while
let j = 0;
while (j < 5) {
  console.log(j);
  j++;
}

// Vòng lặp do-while
let k = 0;
do {
  console.log(k);
  k++;
} while (k < 5);

6. Hàm (Function)#

Hàm là một khối mã có thể được gọi và thực thi. Hàm có thể nhận tham số và trả về giá trị.

Ví dụ về hàm:

// Định nghĩa hàm
function sayHello(name) {
  return `Hello, ${name}!`;
}

// Gọi hàm
console.log(sayHello("Alice"));

7. Đối tượng (Object)#

Đối tượng là một tập hợp các cặp khóa-giá trị (key-value pairs). Mỗi cặp bao gồm một thuộc tính (property) và giá trị (value).

Ví dụ về đối tượng:

let car = {
  make: "Toyota",
  model: "Corolla",
  year: 2020,
  displayInfo: function() {
    return `${this.make} ${this.model} (${this.year})`;
  }
};
console.log(car.displayInfo()); // Toyota Corolla (2020)

8. Mảng (Array)#

Mảng là một đối tượng giống danh sách, dùng để lưu trữ nhiều giá trị trong một biến.

Ví dụ về mảng:

let fruits = ["Apple", "Banana", "Cherry"];

// Truy cập phần tử trong mảng
console.log(fruits[0]); // Apple

// Thêm phần tử vào mảng
fruits.push("Orange");
console.log(fruits); // ["Apple", "Banana", "Cherry", "Orange"]

// Xóa phần tử khỏi mảng
fruits.pop();
console.log(fruits); // ["Apple", "Banana", "Cherry"]

9. Hàm mũi tên (Arrow Function)#

Hàm mũi tên là một cách viết ngắn gọn hơn để định nghĩa hàm trong JavaScript. Nó có cú pháp ngắn gọn và không có từ khóa this riêng.

Ví dụ về hàm mũi tên:

// Định nghĩa hàm bình thường
function add(a, b) {
  return a + b;
}

console.log(add(2, 3)); // 5

// Định nghĩa hàm mũi tên
const addArrow = (a, b) => a + b;

console.log(addArrow(2, 3)); // 5

10. Các Phương Thức Làm Việc Với Mảng Trong JavaScript#

Array.prototype.push()#

Thêm một hoặc nhiều phần tử vào cuối mảng và trả về độ dài mới của mảng.

let arr = [1, 2, 3];
arr.push(4); // arr: [1, 2, 3, 4]

Array.prototype.pop()#

Loại bỏ phần tử cuối cùng của mảng và trả về phần tử đó.

let arr = [1, 2, 3];
let last = arr.pop(); // last: 3, arr: [1, 2]

Array.prototype.shift()#

Loại bỏ phần tử đầu tiên của mảng và trả về phần tử đó.

let arr = [1, 2, 3];
let first = arr.shift(); // first: 1, arr: [2, 3]

Array.prototype.unshift()#

Thêm một hoặc nhiều phần tử vào đầu mảng và trả về độ dài mới của mảng.

let arr = [1, 2, 3];
arr.unshift(0); // arr: [0, 1, 2, 3]

Array.prototype.concat()#

Kết hợp hai hoặc nhiều mảng và trả về mảng mới.

let arr1 = [1, 2];
let arr2 = [3, 4];
let newArr = arr1.concat(arr2); // newArr: [1, 2, 3, 4]