JavaScript là một trong những ngôn ngữ lập trình phổ biến nhất hiện nay. Trong bài viết này, chúng ta sẽ cùng khám phá 10 mẹo JavaScript giúp bạn viết code hiệu quả hơn.
1. Sử dụng Destructuring
Destructuring giúp bạn trích xuất dữ liệu từ array hoặc object một cách ngắn gọn và dễ đọc hơn. Thay vì phải truy cập từng thuộc tính riêng lẻ, bạn có thể "phá vỡ" cấu trúc và lấy ra những gì cần thiết.
// Cách cũ
const user = { name: 'John', age: 30 };
const name = user.name;
const age = user.age;
// Với destructuring
const { name, age } = user;2. Template Literals
Template literals giúp bạn tạo chuỗi một cách linh hoạt và dễ dàng hơn so với cách nối chuỗi truyền thống. Bạn có thể nhúng biến và biểu thức trực tiếp vào trong chuỗi.
// Cách cũ
const greeting = 'Hello, ' + name + '! You are ' + age + ' years old.';
// Với template literals
const greeting = `Hello, ${name}! You are ${age} years old.`;3. Arrow Functions
Arrow functions không chỉ giúp code ngắn gọn hơn mà còn giải quyết vấn đề về this trong JavaScript. Đây là một trong những tính năng được sử dụng nhiều nhất trong ES6+.
// Function thông thường
function add(a, b) {
return a + b;
}
// Arrow function
const add = (a, b) => a + b;4. Spread Operator
Spread operator (...) giúp bạn sao chép và kết hợp array/object một cách dễ dàng. Đây là công cụ mạnh mẽ để làm việc với dữ liệu immutable.
// Sao chép array
const arr1 = [1, 2, 3];
const arr2 = [...arr1, 4, 5];
// Kết hợp objects
const obj1 = { a: 1, b: 2 };
const obj2 = { ...obj1, c: 3 };5. Optional Chaining
Optional chaining (?.) giúp bạn truy cập thuộc tính lồng nhau mà không lo lỗi khi giá trị là null hoặc undefined. Điều này giúp code an toàn và dễ đọc hơn.
// Cách cũ
const city = user && user.address && user.address.city;
// Với optional chaining
const city = user?.address?.city;Bài viết liên quan

React Hooks - Những điều bạn cần biết

