40 Mẹo JavaScript Mà Mọi Developer Cần Nắm Chắc Trong Năm 2025

Hỡi các developer, bạn đã sẵn sàng nắm chắc JavaScript và nâng level code trong năm 2025 chưa? 😎 Trong bài viết này, mình sẽ chia sẻ 40 mẹo JavaScript ngắn gọn, từ cơ bản về JavaScript đến nâng cao, giúp bạn code nhanh hơn, sạch hơn, và cool hơn. Dù bạn là newbie hay senior, những shortcut này sẽ là bí kíp để bạn tự tin hơn. Ngồi xuống, pha ly cà phê, và cùng khám phá nào!

1. Toán tử và điều kiện

JavaScript có nhiều cách viết ngắn gọn để xử lý điều kiện, giúp bạn nắm chắc JavaScript dễ dàng hơn. Dưới đây là những mẹo siêu xịn!

1. Nullish Coalescing (??): Thay ||, dùng ?? để kiểm tra null hoặc undefined.

   let value = null ?? 'default'; // 'default'

2. Optional Chaining (?.): Truy cập thuộc tính an toàn, không lo lỗi.

   let name = user?.profile?.name; // undefined nếu user hoặc profile không tồn tại

3. Ternary Operator (?): Rút gọn if...else, cơ bản về JavaScript.

   let status = age >= 18 ? 'Người lớn' : 'Trẻ em';

4. Logical OR for Default: Gán giá trị mặc định nhanh.

   let count = inputCount || 0;

5. Logical AND for Conditional Execution: Chỉ chạy nếu điều kiện đúng.

   isLoggedIn && fetchData();

6. Double NOT (!!) for Boolean: Chuyển giá trị thành Boolean.

   let isTrue = !!value; // true hoặc false

7. Short-circuit Evaluation: Thay thế if đơn giản.

   value && console.log('Giá trị tồn tại!');

8. Number Conversion: Chuyển string thành số với +.

   let num = +'123'; // 123

2. Mảng và vòng lặp

Mảng là trái tim của JavaScript. Dùng các shortcut này để xử lý mảng mượt mà, giúp bạn nắm chắc JavaScript!

9. Spread Operator (...): Sao chép mảng nhanh.

   let newArray = [...oldArray];

10. Destructuring Array: Lấy phần tử dễ dàng.

    let [first, second] = [1, 2, 3]; // first = 1, second = 2

11. Array.from: Tạo mảng từ iterable.

    let arr = Array.from('hello'); // ['h', 'e', 'l', 'l', 'o']

12. Fill Array: Tạo mảng với giá trị lặp.

    let arr = Array(5).fill( cycle; // [0, 0, 0, 0, 0]

13. Flat Array: Làm phẳng mảng.

    let flat = [1, [2, [3]]].flat(Infinity); // [1, 2, 3]

14. Array.includes: Kiểm tra phần tử trong mảng.

    let exists = [1, 2, 3].includes(2); // true

15. Filter with Destructuring: Lọc mảng nhanh.

    let evens = [1, 2, 3, 4].filter(n => n % 2 === 0); // [2, 4]

16. Map with Index: Lấy index trong map.

    let indexed = ['a', 'b'].map((item, i) => `${i}: ${item}`); // ['0: a', '1: b']

3. Đối tượng và thuộc tính

Đối tượng trong JavaScript có nhiều mẹo hay ho để tiết kiệm code, giúp bạn hiểu cơ bản về JavaScript sâu hơn!

17. Object Destructuring: Lấy thuộc tính nhanh.

    let { name, age } = { name: 'John', age: 30 };

18. Shorthand Property: Rút gọn khai báo đối tượng.

    let name = 'John';
    let obj = { name, age: 30 }; // { name: 'John', age: 30 }

19. Object Spread: Sao chép hoặc hợp nhất đối tượng.

    let newObj = { ...oldObj, newProp: true };

20. Optional Chaining with Objects: Truy cập thuộc tính sâu an toàn.

    let value = obj?.data?.value;

21. Object.keys: Lấy danh sách key.

    let keys = Object.keys({ a: 1, b: 2 }); // ['a', 'b']

22. Object.values: Lấy danh sách value.

    let values = Object.values({ a: 1, b: 2 }); // [1, 2]

23. Object.entries: Lấy cặp key-value.

    let entries = Object.entries({ a: 1, b: 2 }); // [['a', 1], ['b', 2]]

24. Delete Property: Xóa thuộc tính nhanh.

    delete obj.key;

4. Hàm và async

Hàm là linh hồn của JavaScript. Dùng các mẹo này để code hàm nhanh hơn!

25. Arrow Function: Rút gọn hàm.

    const add = (a, b) => a + b;

26. Default Parameters: Gán giá trị mặc định.

    function greet(name = 'Khách') { return `Xin chào ${name}`; }

27. Rest Parameters: Thu thập tham số linh hoạt.

    function sum(...numbers) { return numbers.reduce((a, b) => a + b, 0); }

28. Async/Await: Xử lý bất đồng bộ gọn gàng.

    async function fetchData() { const res = await fetch('url'); return res.json(); }

29. IIFE: Hàm chạy ngay lập tức.

    (() => console.log('Chạy ngay!'))();

30. Bind Shortcut: Ràng buộc this nhanh.

    const bound = func.bind(this);

31. Function Expression: Hàm trong biến.

    const square = x => x * x;

32. Return Early: Thoát hàm sớm.

    function check(value) { if (!value) return false; return true; }

5. ES Modules và cú pháp hiện đại

JavaScript 2025 không thể thiếu ES Modules và các tính năng mới để nắm chắc JavaScript!

33. Dynamic Import: Tải module theo nhu cầu.

    const module = await import('./module.js');

34. Top-level Await: Dùng await ngoài async.

    const data = await fetch('url').then(res => res.json());

35. Nullish Coalescing Assignment (??=): Gán nếu null/undefined.

    obj.value ??= 'default';

36. Logical OR Assignment (||=): Gán nếu falsy.

    obj.value ||= 'default';

37. Logical AND Assignment (&&=): Gán nếu truthy.

    obj.value &&= 'newValue';

38. Private Fields (#): Thuộc tính riêng tư trong class.

    class MyClass { #private = 42; }

39. Static Fields: Thuộc tính tĩnh.

    class MyClass { static count = 0; }

40. Array.at: Lấy phần tử bằng index, hỗ trợ index âm.

    let last = [1, 2, 3].at(-1); // 3

Wow, 40 mẹo rồi! 😎 Những shortcut này sẽ giúp bạn nắm chắc JavaScript, code nhanh hơn, đẹp hơn, và ít bug hơn. Bạn biết thêm mẹo nào hay ho? Comment bên dưới hoặc nhắn mình trên TikTok nhé!

Chúc bạn một ngày vui vẻ – happy coding! Xem thêm video của mình tại @devfe68.