JavaScript Практика
Избегайте глобальных переменных, избегайте new
, избегайте ==
, избегайте eval()
Избегайте глобальных переменных
Сведите к минимуму использование глобальных переменных.
Сюда входят все типы данных, объекты и функции.
Глобальные переменные и функции могут быть перезаписаны другими скриптами.
Вместо этого используйте локальные переменные и узнайте, как использовать Закрытие.
Всегда объявлять локальные переменные
Все переменные, используемые в функции, должны быть объявлены как локальные переменные.
Локальные переменные должны быть объявлены ключевым словомvar
или ключевым словом let
, иначе они станут глобальными переменными.
Строгий режим strict mode не допускает необъявленных переменных.
Объявления сверху
Хорошая практика программирования - помещать все объявления вверху каждого скрипта или функции.
Это будет:
- Сделает более чистый код
- Обеспечьте единое место для поиска локальных переменных
- Упростите избежание нежелательных (подразумеваемых) глобальных переменных
- Уменьшите вероятность нежелательных повторных деклараций
// Объявление в начале
var firstName, lastName, price, discount, fullPrice;
// Использовать позже
firstName = "Щипунов";
lastName = "Андрей";
price = 19.90;
discount = 0.10;
fullPrice = price - discount;
Это также, относится к переменным цикла:
// Объявление в начале
var i;
// Использовать позже
for (i = 0; i < 5; i++)
{
По умолчанию JavaScript перемещает все объявления наверх (JavaScript Подъем).
Инициализация переменных
Хорошая практика программирования - инициализировать переменные при их объявлении.
Это будет:
- Сделает более чистый код
- Обеспечьте единое место для инициализации переменных
- Избегайте неопределенных значений
// Объявление и запуск с самого начала
var firstName = "",
lastName
= "",
price = 0,
discount = 0,
fullPrice
= 0,
myArray = [],
myObject = {};
Инициализация переменных дает представление о предполагаемом использовании (и предполагаемом типе данных).
Никогда не объявляйте Number, String или Boolean объекты
Всегда обрабатывайте числа, строки или логические значения как примитивные значения. Не как объекты.
Объявление этих типов как объектов снижает скорость выполнения и вызывает неприятные побочные эффекты:
Пример
var x = "Щипунов";
var y = new String("Щипунов");
(x === y) // ложно, потому что x - строка, а y - объект.
Попробуйте сами »
Или еще хуже:
Пример
var x = new String("Щипунов");
var y = new String("Щипунов");
(x == y) // ложно, потому что вы не можете сравнивать объекты.
Попробуйте сами »
Не использовать new Object()
- Используйте
{}
вместоnew Object()
- Используйте
""
вместоnew String()
- Используйте
0
вместоnew Number()
- Используйте
false
вместоnew Boolean()
- Используйте
[]
вместоnew Array()
- Используйте
/()/
вместоnew RegExp()
- Используйте
function (){}
вместоnew Function()
Пример
var x1 = {}; // новый объект
var x2 = ""; // новая примитивная строка
var x3 = 0; // новое примитивное число
var x4 = false; // новый примитивный логический
var x5 = []; // новый объект массива
var x6 = /()/; // новый объект регулярного выражения
var x7 = function(){};// новый объект функции
Попробуйте сами »
Остерегайтесь автоматического преобразования типов
Помните, что числа могут быть случайно преобразованы в строки или NaN
(не число).
JavaScript слабо типизирован. Переменная может содержать разные типы данных, а переменная может изменять свой тип данных:
При выполнении математических операций JavaScript может преобразовывать числа в строки:
Пример
var x = 5 + 7; // x.valueOf() равно 12, typeof x это число
var x = 5 + "7"; // x.valueOf() равно 57, typeof x это строка
var x = "5" + 7; // x.valueOf() равно 57, typeof x это строка
var x = 5 - 7; // x.valueOf() равно -2, typeof x это число
var x = 5 - "7"; // x.valueOf() равно -2, typeof x это число
var x = "5" - 7; // x.valueOf() равно -2, typeof x это число
var x = 5 - "x"; // x.valueOf() равно NaN, typeof x это число
Попробуйте сами »
Вычитание строки из строки не приводит к ошибке, но возвращает NaN
(не число):
Используйте === Сравнение
Оператор сравнения ==
всегда преобразуется (в соответствующие типы) перед сравнением.
Оператор ===
заставляет сравнивать значения и тип:
Пример
0 == ""; // true
1 == "1"; // true
1 == true; // true
0 === ""; // false
1 === "1"; // false
1 === true;
// false
Попробуйте сами »
Использование параметров по умолчанию
Если функция вызывается с отсутствующим аргументом, значение отсутствующего аргумента устанавливается равным undefined
.
Неопределенные значения могут нарушить ваш код. Присваивать аргументам значения по умолчанию - хорошая привычка.
ECMAScript 2015 позволяет использовать параметры по умолчанию в определении функции:
function (a=1, b=1) {/*function code*/ }
Подробнее о параметрах функции и аргументах читайте в Параметры функции.
Завершите switch по умолчанию
Всегда завершайте операторы switch
значением default
. Даже если вы думаете, что в этом нет необходимости.
Пример
switch (new Date().getDay()) {
case 0:
day = "Воскресенье";
break;
case 1:
day = "Понедельник";
break;
case 2:
day = "Вторник";
break;
case 3:
day = "Среда";
break;
case 4:
day = "Четверг";
break;
case 5:
day = "Пятница";
break;
case 6:
day = "Суббота";
break;
default:
day =
"Неизвестно";
}
Попробуйте сами »
Избегайте использования eval()
Функция eval()
используется для запуска текста в качестве кода. Практически во всех случаях нет необходимости использовать ее.
Поскольку он позволяет запускать произвольный код, а также представляет проблему безопасности.