САМОСТОЯТЕЛЬНОЕ ОБУЧЕНИЕ ДЛЯ ВЕБ РАЗРАБОТЧИКОВ
×

JS Учебник

JS Главная JS Введение JS Где установить? JS Вывод JS Заявления JS Синтаксис JS Комментарии JS Переменные JS Let JS Const JS Операторы JS Арифметика JS Присваивание JS Типы данных JS Функции JS Объекты JS События JS Строки JS Методы строк JS Поиск строк JS Шаблоны строк JS Числа JS Методы чисел JS Массивы JS Методы массива JS Сортировка массива JS Итерация массива JS Постоянный массив JS Даты JS Формат дат JS Методы получения дат JS Методы набора дат JS Объекты Math JS Случайные числа JS Булевы JS Сравнения JS Оператор If...Else JS Оператор Switch JS Цикл For JS Цикл For In JS Цикл For Of JS Цикл While JS Оператор Break JS Повторяющиеся JS Наборы JS Карты JS Typeof JS Преобразование JS Битовые JS Выражения JS Ошибки JS Область JS Подъемный JS Строгий JS Ключевое слово this JS Стрелки JS Классы JS JSON JS Отладчик JS Стиль JS Практика JS Ошибки JS Эффективность JS Слова

JS Версии

JS Версии JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE/Edge JS История

JS Объекты

Определение объекта Свойства объекта Методы объекта Отображение объекта Доступ объекта Конструкторы объекта Прототипы объекта Повторяющиеся объекты Набор объектов Карты объекта Справочник объектов

JS Функции

Определение функций Параметры функции Обращение к функции Вызов функции Применение функции Закрытие функции

JS Классы

Введение класса Наследование класса Статистический класс

JS Асинхронный

JS Обратный вызов JS Асинхронный JS Обещания JS Асинхронный

JS HTML DOM

DOM Введение DOM Методы DOM Документы DOM Элементы DOM HTML DOM Формы DOM CSS DOM Анимация DOM События DOM Прослушиватель DOM Навигация DOM Узлы DOM Коллекция DOM Список узлов

JS Браузер BOM

JS Window JS Экран JS Расположение JS История JS Навигатор JS Предупреждение JS Синхронизация JS Куки

JS Веб APIы

Веб API Введение Веб API История Веб API Хранилище Веб API Работник Веб API Извлечь Веб API Геолокации

JS AJAX

AJAX Введение AJAX XMLHttp AJAX Запрос на сервер AJAX Ответ с сервера AJAX Файл XML AJAX Файл PHP AJAX Файл ASP AJAX База данных AJAX Приложения AJAX Примеры

JS JSON

JSON Введение JSON Синтаксис JSON или XML JSON Типы данных JSON Парсинг JSON Строки JSON Объекты JSON Массивы JSON PHP JSON HTML JSON JSONP

JS или jQuery

jQuery Селекторы jQuery Элементы jQuery CSS jQuery DOM

JS Примеры

JS Примеры JS HTML DOM JS HTML Ввод JS HTML Объекты JS HTML События JS Браузер JS Редактор JS Упражнения JS Викторина JS Сертификат

JS Справочник

JavaScript Объекты HTML DOM Объекты


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 слабо типизирован. Переменная может содержать разные типы данных, а переменная может изменять свой тип данных:

Пример

var x = "Привет";// typeof x это строка
x = 5;// меняет typeof x на число
Попробуйте сами »

При выполнении математических операций 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 (не число):

Пример

"Привет" - "Андрей" // возвращает NaN
Попробуйте сами »

Используйте === Сравнение

Оператор сравнения == всегда преобразуется (в соответствующие типы) перед сравнением.

Оператор === заставляет сравнивать значения и тип:

Пример

0 == ""; // true
1 == "1"; // true
1 == true; // true

0 === ""; // false
1 === "1"; // false
1 === true; // false
Попробуйте сами »

Использование параметров по умолчанию

Если функция вызывается с отсутствующим аргументом, значение отсутствующего аргумента устанавливается равным undefined.

Неопределенные значения могут нарушить ваш код. Присваивать аргументам значения по умолчанию - хорошая привычка.

Пример

function myFunction(x, y) {
if (y === undefined) {
y = 0;
}
}
Попробуйте сами »

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() используется для запуска текста в качестве кода. Практически во всех случаях нет необходимости использовать ее.

Поскольку он позволяет запускать произвольный код, а также представляет проблему безопасности.