Thực tiễn tốt nhất về JavaScript
Tránh các biến toàn cục, tránh new , tránh == , tránh eval()
Tránh các biến toàn cục
Giảm thiểu việc sử dụng các biến toàn cục.
Điều này bao gồm tất cả các loại dữ liệu, đối tượng và chức năng.
Các biến và hàm toàn cục có thể bị ghi đè bởi các tập lệnh khác.
Thay vào đó, hãy sử dụng các biến cục bộ và tìm hiểu cách sử dụng các bao đóng .
Luôn khai báo các biến cục bộ
Tất cả các biến được sử dụng trong hàm phải được khai báo là biến cục bộ .
Các biến cục bộ phải được khai báo bằng từ khóa var , let hoặc const , nếu không chúng sẽ trở thành biến toàn cục.
Chế độ nghiêm ngặt không cho phép các biến không được khai báo.
Tuyên bố trên cùng
Một cách viết mã tốt là đặt tất cả các khai báo ở đầu mỗi tập lệnh hoặc hàm.
Điều này sẽ:
- Cung cấp mã sạch hơn
- Cung cấp một nơi duy nhất để tìm kiếm các biến cục bộ
- Giúp dễ dàng tránh các biến toàn cục (ngụ ý) không mong muốn
- Giảm khả năng khai báo lại ngoài ý muốn
// Declare at the beginning
let firstName, lastName, price, discount, fullPrice;
// Use later
firstName = "John";
lastName = "Doe";
price = 19.90;
discount = 0.10;
fullPrice = price - discount;Điều này cũng áp dụng cho các biến vòng lặp:
for (let i = 0; i < 5; i++)
{Khởi tạo biến
Đó là một cách viết mã tốt để khởi tạo các biến khi bạn khai báo chúng.
Điều này sẽ:
- Cung cấp mã sạch hơn
- Cung cấp một nơi duy nhất để khởi tạo các biến
- Tránh các giá trị không xác định
// Declare and initiate at the beginning
let firstName = "";
let lastName = "";
let price = 0;
let discount = 0;
let fullPrice = 0,
const myArray = [];
const myObject = {};Việc khởi tạo các biến cung cấp ý tưởng về mục đích sử dụng (và kiểu dữ liệu dự kiến).
Khai báo đối tượng bằng const
Khai báo các đối tượng bằng const sẽ ngăn chặn mọi thay đổi ngẫu nhiên về loại:
Ví dụ
let car = {type:"Fiat", model:"500", color:"white"};
car = "Fiat"; // Changes object to string
const car = {type:"Fiat", model:"500", color:"white"};
car = "Fiat"; // Not possible
Khai báo mảng với const
Khai báo mảng bằng const sẽ ngăn chặn mọi thay đổi ngẫu nhiên về loại:
Ví dụ
let cars = ["Saab", "Volvo", "BMW"];
cars = 3; // Changes array to number
const cars = ["Saab", "Volvo", "BMW"];
cars = 3; // Not possible
Đừng sử dụng đối tượng mới()
- Sử dụng
""thay vìnew String() - Sử dụng
0thay vìnew Number() - Sử dụng
falsethay vìnew Boolean() - Sử dụng
{}thay vìnew Object() - Sử dụng
[]thay vìnew Array() - Sử dụng
/()/thay vìnew RegExp() - Sử dụng
function (){}thay vìnew Function()
Ví dụ
let x1 = ""; // new primitive string
let x2 = 0; // new primitive number
let x3 = false; // new primitive boolean
const x4 = {}; // new object
const x5 = []; // new array object
const x6 = /()/; // new regexp object
const x7 = function(){}; // new function object Hãy tự mình thử »Cảnh giác với việc chuyển đổi loại tự động
JavaScript được gõ lỏng lẻo.
Một biến có thể chứa tất cả các kiểu dữ liệu.
Một biến có thể thay đổi kiểu dữ liệu của nó:
Ví dụ
let x = "Hello"; // typeof x is a string
x = 5; // changes typeof x to a number
Hãy tự mình thử » Xin lưu ý rằng các số có thể vô tình được chuyển đổi thành chuỗi hoặc NaN (Không phải số).
Khi thực hiện các phép toán, JavaScript có thể chuyển đổi số thành chuỗi:
Ví dụ
let x = 5 + 7; // x.valueOf() is 12, typeof x is a number
let x = 5 + "7"; // x.valueOf() is 57, typeof x is a string
let x = "5" + 7; // x.valueOf() is 57, typeof x is a string
let x = 5 - 7; // x.valueOf() is -2, typeof x is a number
let x = 5 - "7"; // x.valueOf() is -2, typeof x is a number
let x = "5" - 7; // x.valueOf() is -2, typeof x is a number
let x = 5 - "x"; // x.valueOf() is NaN, typeof x is a number
Hãy tự mình thử » Trừ một chuỗi khỏi một chuỗi, không tạo ra lỗi nhưng trả về NaN (Không phải số):
Sử dụng === So sánh
Toán tử so sánh == luôn chuyển đổi (thành loại khớp) trước khi so sánh.
Toán tử === buộc so sánh các giá trị và loại:
Ví dụ
0 == ""; // true
1 == "1"; // true
1 == true; // true
0 === ""; // false
1 === "1"; // false
1 === true;
// false
Hãy tự mình thử »Sử dụng mặc định tham số
Nếu một hàm được gọi mà thiếu một đối số, giá trị của đối số bị thiếu sẽ được đặt thành undefined .
Các giá trị không xác định có thể phá vỡ mã của bạn. Đó là một thói quen tốt để gán giá trị mặc định cho các đối số.
ECMAScript 2015 cho phép tham số mặc định trong định nghĩa hàm:
function (a=1, b=1) { /*function code*/ }
Đọc thêm về tham số và đối số của hàm tại Tham số hàm
Kết thúc công tắc của bạn với mặc định
Luôn kết thúc câu lệnh switch của bạn bằng một default . Ngay cả khi bạn nghĩ rằng không cần thiết.
Ví dụ
switch (new Date().getDay()) {
case 0:
day = "Sunday";
break;
case 1:
day = "Monday";
break;
case 2:
day = "Tuesday";
break;
case 3:
day = "Wednesday";
break;
case 4:
day = "Thursday";
break;
case 5:
day = "Friday";
break;
case 6:
day = "Saturday";
break;
default:
day =
"Unknown";
}
Hãy tự mình thử »Tránh Số, Chuỗi và Boolean làm đối tượng
Luôn coi số, chuỗi hoặc boolean là giá trị nguyên thủy. Không phải như đồ vật.
Khai báo các loại này dưới dạng đối tượng, làm chậm tốc độ thực thi và tạo ra các tác dụng phụ khó chịu:
Ví dụ
let x = "John";
let y = new String("John");
(x === y) // is false because x is a string and y is an object.
Hãy tự mình thử »Hoặc thậm chí tệ hơn:
Ví dụ
let x = new String("John");
let y = new String("John");
(x == y) // is false because you cannot compare objects.
Hãy tự mình thử »Tránh sử dụng eval()
Hàm eval() được sử dụng để chạy văn bản dưới dạng mã. Trong hầu hết các trường hợp, không cần thiết phải sử dụng nó.
Bởi vì nó cho phép chạy mã tùy ý nên nó cũng thể hiện một vấn đề bảo mật.
