JavaScript Лучшие практики
Избегайте глобальных переменных, избегайте new, избегайте ==, избегайте eval()
Избегайте глобальных переменных
Сведите к минимуму использование глобальных переменных.
Сюда входят все типы данных, объекты и функции.
Глобальные переменные и функции могут быть перезаписаны другими скриптами.
Вместо этого используйте локальные переменные и узнайте, как использовать замыкания.
Всегда объявляйте локальные переменные
Все переменные, используемые в функции, должны быть объявлены как локальные переменные.
Локальные переменные должны быть объявлены с помощью ключевого слова var или ключевого слова let, иначе они станут глобальными переменными.
Строгий режим не допускает необъявленных переменных.
Объявления вверху
Хорошая практика программирования - помещать все объявления вверху каждого скрипта или функции.
Это даёт:
- Более чистый код
- Обеспечивает единое место для поиска локальных переменных
- Упрощает избежание нежелательных (подразумеваемых) глобальных переменных
- Уменьшает вероятность нежелательного повторного объявления
// Объявить в начале
let firstName, lastName, price, discount, fullPrice;
// Use later
firstName = "John";
lastName = "Doe";
price = 19.90;
discount = 0.10;
fullPrice = price - discount;
Это также касается переменных цикла:
for (let i = 0; i < 5; i++)
{
Инициализация переменных
Рекомендуется инициализировать переменные при их объявлении.
Это даёт:
- Более чистый код
- Обеспечивает единое место для инициализации переменных
- Избежание неопределенных значений
// Объявить и инициировать в начале
let firstName = "",
let lastName = "",
let price = 0,
let discount = 0,
let fullPrice = 0,
const myArray = [],
const myObject = {};
Инициализация переменных даёт представление о предполагаемом использовании (и предполагаемом типе данных).
Объявить объекты с помощью const
Объявление объектов с помощью const предотвратит случайное изменение типа:
Пример
let car = {type:"Fiat", model:"500", color:"white"};
car = "Fiat"; // Изменяет объект на строку
const car = {type:"Fiat", model:"500", color:"white"};
car = "Fiat"; // Невозможно
Объявить массивы с помощью const
Объявление массивов с помощью const предотвратит случайное изменение типа:
Пример
let cars = ["Saab", "Volvo", "BMW"];
cars = 3; // Изменяет массив на число
const cars = ["Saab", "Volvo", "BMW"];
cars = 3; // Невозможно
Не используйте new Object()
- Используйте
""вместоnew String() - Используйте
0вместоnew Number() - Используйте
falseвместоnew Boolean() - Используйте
{}вместоnew Object() - Используйте
[]вместоnew Array() - Используйте
/()/вместоnew RegExp() - Используйте
function (){}вместоnew Function()
Пример
let x1 = ""; // новая примитивная строка
let x2 = 0; // новое примитивное число
let x3 = false; // новое примитивное булево значение
const x4 = {}; // новый объект
const x5 = []; // новый объект массива
const x6 = /()/; // новый объект regexp
const x7 = function(){}; // новый объект функции
Попробуйте сами »
Остерегайтесь автоматического преобразования типов
Код JavaScript не очень типизирован.
Переменные могут содержать все типы данных.
Переменная может изменять свой тип данных:
Пример
let x = "Hello"; // typeof x - это строка
x = 5; // изменяет typeof x на число
Попробуйте сами »
Помните, что числа могут случайно быть преобразованы в строки или NaN (Not a Number - Не число).
При выполнении математических операций JavaScript может преобразовывать числа в строки:
Пример
let x = 5 + 7; // x.valueOf() равно 12, typeof x - это число
let x = 5 + "7"; // x.valueOf() равно 57, typeof x - это строка
let x = "5" + 7; // x.valueOf() равно 57, typeof x - это строка
let x = 5 - 7; // x.valueOf() равно -2, typeof x - это число
let x = 5 - "7"; // x.valueOf() равно -2, typeof x - это число
let x = "5" - 7; // x.valueOf() равно -2, typeof x - это число
let x = 5 - "x"; // x.valueOf() равно NaN, typeof x - это число
Попробуйте сами »
Вычитание строки из строки не вызывает ошибки, но возвращает NaN (Not a Number):
Используйте === Сравнение
Оператор сравнения == всегда преобразует (в соответствующие типы) перед сравнением.
Оператор === принудительно сравнивает значения и тип:
Пример
0 == ""; // true
1 == "1"; // true
1 == true; // true
0 === ""; // false
1 === "1"; // false
1 === true;
// false
Попробуйте сами »
Используйте значения параметров по умолчанию
Если функция вызывается с отсутствующим аргументом, значение отсутствующего аргумента устанавливается на undefined (неопределенное).
Undefined (неопределенные) значения могут нарушить ваш код. Присваивать аргументам значения по умолчанию - хорошая привычка.
ECMAScript 2015 позволяет использовать параметры по умолчанию в определении функции:
function (a=1, b=1) { /*код функции*/ }
Дополнительные сведения о параметрах и аргументах функции см. в разделе Параметры функции
Завершите переключатели настройками по умолчанию
Всегда завершайте операторы switch с помощью default (значения по умолчанию). Даже если вы думаете, что в этом нет необходимости.
Пример
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";
}
Попробуйте сами »
Избегайте числовых, строковых и логических значений в качестве объектов
Всегда относитесь к числам, строкам или логическим значениям как к примитивным значениям. Не как к объектам.
Объявление этих типов как объектов снижает скорость выполнения и вызывает неприятные побочные эффекты:
Пример
let x = "John";
let y = new String("John");
(x === y) // является false потому что x - это строка, а y - объект
Попробуйте сами »
Или даже хуже:
Пример
let x = new String("John");
let y = new String("John");
(x == y) // является false, потому что нельзя сравнивать объекты
Попробуйте сами »
Избегайте использования eval()
Функция eval() используется для запуска текста как кода. Практически во всех случаях нет необходимости использовать его.
Поскольку он позволяет запускать произвольный код, он также представляет проблему безопасности.
