🟡 Phần 2: Kiến thức Trung Bình – Cấu trúc và Xử lý

Dưới đây là đáp án chi tiết cho phần 🟡 Phần 2: Kiến thức Trung Bình – Cấu trúc và Xử lý trong JavaScript:

---

1. Các loại vòng lặp trong JavaScript (for, while, do...while)

Vòng lặp	Cú pháp	Đặc điểm
for	for (init; condition; update)	Thường dùng khi biết rõ số lần lặp
while	while (condition)	Kiểm tra điều kiện trước khi lặp
do...while	do { } while (condition)	Luôn chạy ít nhất 1 lần

---

2. Khác biệt giữa for...in và for...of

Tiêu chí	for...in	for...of
Duyệt	Duyệt qua key (index, property)	Duyệt qua giá trị trong iterable
Dùng cho	Object, Array (không khuyến khích)	Array, Set, Map, String, iterable
Ví dụ	for (let key in obj)	for (let value of arr)

const arr = ['a', 'b'];
for (let i in arr) console.log(i); // 0, 1
for (let i of arr) console.log(i); // a, b

---

3. Callback là gì? Khi nào nên dùng?

• Callback là một hàm được truyền làm đối số cho hàm khác, và được gọi lại bên trong hàm đó.

function greet(name, callback) {
  console.log('Hello ' + name);
  callback();
}
greet('Tài', () => console.log('Done!'));

• Dùng khi: cần xử lý bất đồng bộ, hoặc tách logic xử lý sau khi hoàn thành tác vụ.

---

4. Promise là gì? So sánh callback và Promise.

• Promise là một object đại diện cho một tác vụ bất đồng bộ, có 3 trạng thái:

  • pending → fulfilled hoặc rejected

const promise = new Promise((resolve, reject) => {
  setTimeout(() => resolve('Success'), 1000);
});
promise.then(res => console.log(res));

So sánh	Callback	Promise
Dễ bị callback hell	✅ Có thể	❌ Giải quyết được
Xử lý lỗi	Phải kiểm tra thủ công	.catch() rõ ràng
Chuỗi xử lý	Khó kiểm soát	.then() chaining dễ quản lý

---

5. Giải thích async/await trong JavaScript.

• Là cú pháp giúp đọc Promise giống code đồng bộ.

• async dùng để đánh dấu một hàm trả về Promise.

• await dùng để chờ kết quả của một Promise, chỉ dùng được trong async.

async function fetchData() {
  const res = await fetch('https://api.com/data');
  const json = await res.json();
  console.log(json);
}

---

6. Closure là gì? Lấy ví dụ.

• Closure là hàm có thể ghi nhớ biến ở phạm vi bao quanh nó (outer scope) ngay cả khi scope đó đã bị kết thúc.

function counter() {
  let count = 0;
  return function () {
    count++;
    return count;
  };
}
const increment = counter();
console.log(increment()); // 1
console.log(increment()); // 2

→ count vẫn được nhớ nhờ closure.

---

7. Scope và Lexical Scope là gì?

• Scope: phạm vi tồn tại của biến (global, function, block)

• Lexical Scope: hàm truy cập biến dựa trên nơi nó được khai báo, không phải nơi được gọi.

function outer() {
  const a = 'outer';
  function inner() {
    console.log(a); // lexical scope cho phép truy cập biến a
  }
  inner();
}

---

8. IIFE là gì? Dùng để làm gì?

• IIFE (Immediately Invoked Function Expression): hàm được định nghĩa và gọi ngay lập tức.

(function() {
  console.log('Run immediately');
})();

• Mục đích:

  • Tạo scope riêng biệt để tránh ô nhiễm global.

  • Dùng trong module pattern trước khi có import/export.

---

9. Giải thích nguyên lý hoạt động của this trong các ngữ cảnh khác nhau.

Ngữ cảnh	this là gì?
Global	window (trình duyệt) / global (Node.js)
Trong object method	Chính object đó
Trong function thường	undefined (strict mode) hoặc window
Trong constructor	Instance được tạo ra
Arrow function	Không có this riêng, dùng lexical this

const obj = {
  name: 'Tài',
  greet: function () {
    console.log(this.name); // "Tài"
  }
};

---

10. Sự khác biệt giữa function thường và arrow function khi dùng this?

Đặc điểm	Regular Function	Arrow Function
Binding this	Theo ngữ cảnh gọi	Theo nơi được khai báo (lexical)
Có arguments	Có	Không
Dùng làm constructor	✅ Có thể	❌ Không được

const obj = {
  name: 'Tài',
  regular: function () {
    console.log(this.name); // "Tài"
  },
  arrow: () => {
    console.log(this.name); // undefined (vì `this` là global)
  }
};

---