Khi nói đến các buổi phỏng vấn JavaScript, nhà tuyển dụng tìm kiếm cả kiến thức thực tế lẫn lý thuyết. Vì vậy, dưới đây là danh sách 20 khái niệm JavaScript cốt lõi được giải thích bằng các ví dụ ngắn gọn để giúp bạn luôn sẵn sàng cho các cuộc phỏng vấn.
1. Closures
Closure là một hàm ghi nhớ các biến bên ngoài của nó ngay cả sau khi hàm bên ngoài đã hoàn thành việc thực thi.
function outer() { let count = 0; return function inner() { count++; return count; };
} const counter = outer();
console.log(counter()); // 1
console.log(counter()); // 2
2. Hoisting
Trong Hoisting, các khai báo biến và hàm trong JavaScript được "nâng" lên đầu phạm vi của chúng.
console.log(greet()); // Hello! function greet() { return "Hello!";
} console.log(num); // undefined
var num = 5;
3. Event Loop & Callbacks
JavaScript là đơn luồng và vòng lặp sự kiện (Event Loop) cho phép các hoạt động không đồng bộ sử dụng các hàm gọi lại (Callbacks).
console.log("Start");
setTimeout(() => console.log("Async operation"), 1000);
console.log("End"); // Output: Start, End, Async operation
4. Promises
Promises xử lý các hoạt động không đồng bộ, với các trạng thái: pending, fulfilled và rejected.
let fetchData = new Promise((resolve, reject) => { setTimeout(() => resolve("Data received!"), 1000);
}); fetchData.then(data => console.log(data)); // Data received!
5. Async/Await
Async/Await đơn giản hóa việc xử lý promise.
async function fetchData() { let data = await new Promise(resolve => setTimeout(() => resolve("Data"), 1000)); console.log(data);
} fetchData(); // Data
6. Arrow Functions
Arrow Functions cung cấp một cú pháp ngắn gọn và không có this của riêng chúng.
const add = (a, b) => a + b;
console.log(add(2, 3)); // 5
7. Destructuring
Destructuring cho phép bạn giải nén các giá trị từ mảng hoặc các thuộc tính từ đối tượng.
const person = { name: "Alice", age: 25 };
const { name, age } = person; console.log(name); // Alice
console.log(age); // 25
8. Spread & Rest Operators
Spread ... mở rộng các phần tử và Rest thu thập chúng vào một mảng.
const arr1 = [1, 2, 3];
const arr2 = [...arr1, 4, 5]; // Spread function sum(...nums) { // Rest return nums.reduce((a, b) => a + b);
}
console.log(sum(1, 2, 3, 4)); // 10
9. Prototypes
Prototypes cho phép các đối tượng kế thừa các thuộc tính và phương thức.
function Car(name) { this.name = name;
} Car.prototype.getName = function() { return this.name;
}; const myCar = new Car("Tesla");
console.log(myCar.getName()); // Tesla
10. This
this đề cập đến ngữ cảnh mà một hàm được gọi.
const person = { name: "John", sayName() { console.log(this.name); },
}; person.sayName(); // John
11. Classes
Các lớp ES6 cung cấp một cú pháp rõ ràng hơn cho lập trình hướng đối tượng.
class Animal { constructor(name) { this.name = name; } speak() { return `${this.name} makes a sound.`; }
} const dog = new Animal("Dog");
console.log(dog.speak()); // Dog makes a sound.
12. Modules
Modules cho phép bạn chia nhỏ mã của mình trên nhiều tệp.
// add.js
export const add = (a, b) => a + b; // main.js
import { add } from "./add.js";
console.log(add(2, 3)); // 5
13. Map và Filter
map và filter là các phương thức mảng để biến đổi và lọc mảng.
const numbers = [1, 2, 3, 4];
const doubled = numbers.map(n => n * 2); // [2, 4, 6, 8]
const evens = numbers.filter(n => n % 2 === 0); // [2, 4]
14. Reduce
reduce tích lũy các giá trị từ một mảng.
const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((acc, n) => acc + n, 0);
console.log(sum); // 10
15. SetTimeout và SetInterval
setTimeout trì hoãn việc thực thi, trong khi setInterval lặp lại nó.
setTimeout(() => console.log("After 1 second"), 1000); let count = 0;
const intervalId = setInterval(() => { console.log("Count:", ++count); if (count === 3) clearInterval(intervalId);
}, 1000);
16. Template Literals
Template literals cho phép các chuỗi nhiều dòng và nội suy.
const name = "World";
console.log(`Hello, ${name}!`); // Hello, World!
17. Type Coercion
Type Coercion là việc JavaScript có thể chuyển đổi kiểu dữ liệu ngầm định, đôi khi không thể đoán trước.
console.log("5" + 5); // 55 (string)
console.log("5" - 2); // 3 (number)
18. Truthy và Falsy Values
Các giá trị như 0, "", null, undefined, NaN là falsy.
if ("") { console.log("This won't run");
} else { console.log("Falsy value");
}
19. Debouncing & Throttling
Debouncing và throttling là các kỹ thuật để kiểm soát tần suất thực thi hàm, thường để phản hồi các sự kiện.
Trong đó, Debounce (trì hoãn thực hiện):
function debounce(func, delay) { let timeout; return function (...args) { clearTimeout(timeout); timeout = setTimeout(() => func.apply(this, args), delay); };
} window.addEventListener("resize", debounce(() => console.log("Resized!"), 500));
Và Throttle (giới hạn thực hiện):
function throttle(func, limit) { let inThrottle; return function (...args) { if (!inThrottle) { func.apply(this, args); inThrottle = true; setTimeout(() => (inThrottle = false), limit); } };
} window.addEventListener("scroll", throttle(() => console.log("Scrolling!"), 200));
20. Currying
Currying biến đổi một hàm với nhiều đối số thành một chuỗi các hàm với một đối số duy nhất.
function multiply(a) { return function (b) { return a * b; };
} const double = multiply(2);
console.log(double(5)); // 10