Các phương pháp hay nhất về JavaScript
Tránh các biến toàn cục, tránh new, tránh ==, tránheval()
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 kiểu 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 một hàm nên được khai báo là biến cục bộ.
Các biến cục bộ phải được khai báo với var
từ khóa hoặc lettừ khóa, hoặc consttừ khóa, 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 phương pháp 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 tránh các biến toàn cục không mong muốn (ngụ ý) dễ dàng hơn
- Giảm khả năng khai báo lại không mong 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 các biến
Đó là một thực hành mã hóa 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 = {};
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ự định).
Khai báo các đối tượng với const
Khai báo các đối tượng với const sẽ ngăn chặn bất kỳ sự thay đổi kiểu ngẫu nhiên nào:
Thí 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 với const sẽ ngăn chặn bất kỳ sự thay đổi kiểu ngẫu nhiên nào:
Thí dụ
let cars = ["Saab", "Volvo", "BMW"];
cars = 3; // Changes array to number
const cars = ["Saab", "Volvo", "BMW"];
cars = 3; // Not possible
Khô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()
Thí 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
Cẩn thận với các chuyển đổi kiểu 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ó:
Thí dụ
let x = "Hello"; // typeof x is a string
x = 5; // changes typeof x to a number
Hãy 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:
Thí 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
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ố):
Thí dụ
"Hello" - "Dolly" // returns NaN
Sử dụng === So sánh
Toán tử ==so sánh luôn chuyển đổi (thành các kiểu so khớp) trước khi so sánh.
Toán tử ===buộc so sánh các giá trị và kiểu:
Thí dụ
0 == ""; // true
1 == "1"; // true
1 == true; // true
0 === ""; // false
1 === "1"; // false
1 === true;
// false
Sử dụng mặc định tham số
Nếu một hàm được gọi với một đối số bị thiếu, giá trị của đối số bị thiếu được đặt thành
undefined.
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 các giá trị mặc định cho các đối số.
Thí dụ
function myFunction(x, y) {
if (y === undefined) {
y = 0;
}
}
ECMAScript 2015 cho phép các tham số mặc định trong định nghĩa hàm:
function (a=1, b=1) { /*function code*/ }
Đọc thêm về các 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 bằng giá trị mặc định
Luôn kết thúc switchcâu lệnh của bạn bằng a default. Ngay cả khi bạn nghĩ rằng không cần thiết.
Thí 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";
}
Tránh Số, Chuỗi và Boolean dưới dạng Đối tượng
Luôn coi các số, chuỗi hoặc boolean là các giá trị nguyên thủy. Không phải là đồ 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:
Thí dụ
let x = "John";
let y = new String("John");
(x === y) // is false because x is a string and y is an object.
Hoặc thậm chí tệ hơn:
Thí dụ
let x = new String("John");
let y = new String("John");
(x == y) // is false because you cannot compare objects.
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ó cũng đại diện cho một vấn đề bảo mật.