7 tips đơn giản giúp tối ưu hóa code Javascript của bạn

by admin in Javascript

Javascript là ngôn ngữ được sử dụng rất, rất nhiều. Nó chạy được trên tất cả các thiết bị, trình duyệt, là ngôn ngữ cơ bản khi developers bước vào con đường lập trình website.

Ngôn ngữ lập trình nào khi viết code cũng cần được tối ưu, dưới đây là 7 tips nhỏ có thể giúp ích cho các bạn.

1. Sử dụng biến động

Chúng ta vẫn quen với giá trị biến thay đổi thông qua các hàm xử lý, còn tên biến không thay đổi. Dưới đây là ví dụ cho bạn thấy mọi thứ có thể thay đổi 😀

let dynamicProperty = ‘human’;
let learn = {
title: ‘Javascript’,
[dynamicProperty]: ‘Senior’
};
console.log(learn); // { title:’JavaScript Best Practices’, human:’Senior’ }

2. Làm tròn giá trị

Hai hàm phổ biến chúng ta hay sử dụng là math.floor() và math.round()
Thay vào đó có hàm ngắn và hiệu quả hơn, đó là: ~~

Ví dụ:

Math.floor(10.11);
Math.round(10.11);

Bạn có thể dùng: ~~(10.11)

Đều cho result là: 10

3. Sử dụng Shortcuts

Ví dụ đơn giản về if/else, sử dụng shortcuts hợp lý sẽ giúp code của bạn sáng hơn, ngắn gọn hơn.

Thay vì code:

function getResult(variable) {
if (variable) {
return variable;
} else {
return ‘Variable is null’;
}
}

Bạn có thể viết:

function getResult(variable) {
return variable || ‘Variable is null’;
}

4. Không viết lặp lại mã code

Đây là điều ai cũng nhận ra nhưng do lười và suy nghĩ để xử lý sau cũng được.

Bạn luôn luôn tâm niệm rằng code của bạn còn có thể rút gọn được hơn nữa, nhiều đoạn code có thể được viết lại nhiều hơn một lần, bạn hoàn toàn có thể viết chúng ở một nơi và chỉ việc gọi tới khi cần. Việc này đôi khi mất thời gian hơn nhưng code đã được tối ưu hơn và giúp ích cho kỹ năng của bạn.

5. Hàm thay thế chuỗi

Chúng ta vẫn sử dụng string.replace() mỗi khi thay thế chuỗi, tuy nhiên hàm này chỉ sử dụng cho ký tự tìm thấy đầu tiên trong chuỗi.

Ví dụ:

let string = ‘I am a JavaScript developer. I love JavaScript.’;
let result = string.replace(‘JavaScript’, ‘VueJS’);
console.log(result); // I am a VueJS developer. I love JavaScript.

Bạn có thể thấy chỉ thay được chuỗi JavaScript tìm thấy lần đầu tiên, vế sau vẫn là VueJS

Để xử lý vấn đề này, chúng ta sử dụng biểu thức regex đơn giản như sau: /JavaScript/g

let string = ‘I am a JavaScript developer. I love JavaScript.’;
let result = string.replace(/JavaScript/g, ‘VueJS’);
console.log(result); // I am a VueJS developer. I love VueJS.

6. Thay đổi kích thước một mảng

Giả sử bạn có một mảng:

let programs = [‘Javascript’, ‘VueJS’, ‘React’, ‘Angular’, ‘TypeScript’];
console.log(programs); // [‘Javascript’, ‘VueJS’, ‘React’, ‘Angular’, ‘TypeScript’]
console.log(programs.length); // 5

Thay vì sử dụng for, push để lấy mảng, bạn có thể viết như sau: