ЛУЧШИЙ САЙТ ДЛЯ ВЕБ-РАЗРАБОТЧИКОВ

JS Учебник

JS Старт JS Введение JS Установка JS Вывод JS Объявления JS Синтаксис JS Комментарии JS Переменные JS Операторы JS Арифметические JS Присваивание JS Типы данных JS Функции JS Объекты JS События JS Строки JS Методы строки JS Числа JS Методы числа JS Массивы JS Методы массива JS Сортировка массива JS Итерация массива JS Даты JS Форматы дат JS Методы получения дат JS Методы установки дат JS Математические JS Рандомные JS Булевы JS Сравнения JS Условия JS Switch JS Цикл For JS Цикл While JS Прерывание JS Преобразование типов JS Побитовые JS Регулярные выражения JS Ошибки JS Область действия JS Подъём JS Строгий режим JS Ключевое слово this JS Ключевое слово Let JS Ключевое слово Const JS Функции стрелок JS Классы JS Отладка JS Гид по стилю JS Лучшие практики JS Ошибки JS Производительность JS Зарезервированные слова JS Версии JS Версия ES5 JS Версия ES6 JS JSON

JS Формы

JS Формы Формы API

JS Объекты

Определения объектов Свойства объекта Методы объекта Доступ к объектам Конструкторы объектов Прототипы объектов Объект ECMAScript 5

JS Функции

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

JS HTML DOM

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

JS Объектная модель браузера BOM

JS Окно JS Скрин JS Локация JS История JS Навигатор JS Всплывающее оповещение JS Тайминг JS Куки

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 Stringify JSON Объекты JSON Массивы JSON PHP JSON HTML JSON JSONP

JS и jQuery

jQuery Селекторы jQuery HTML jQuery CSS jQuery DOM

JS Примеры

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

JS Справочники

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

JavaScript. Уроки для начинающих

JavaScript Лучшие практики


Избегайте глобальных переменных, избегайте new, избегайте ==, избегайте eval()


Избегайте глобальных переменных

Минимизируйте использование глобальных переменных.

Это включает в себя все типы данных, объекты и функции.

Глобальные переменные и функции могут быть перезаписаны другими скриптами.

Вместо этого используйте локальные переменные и научитесь использовать замыкания.


Всегда объявляйте локальные переменные

Все переменные, используемые в функции, должны быть объявлены как локальные переменные.

Локальные переменные должны быть объявлены с ключевым словом var или ключевым словом let, в противном случае они станут глобальными переменными.

Строгий режим (strict mode) не допускает необъявленных переменных.


Объявления сверху

Хорошей практикой написания кода является размещение всех объявлений в начале каждого скрипта или функции.

Это:

  • Сделает чище код
  • Предоставит единственное место для поиска локальных переменных
  • Позволит избегать нежелательных (подразумеваемых) глобальных переменных
  • Уменьшит возможность нежелательных повторных объявлений
// Объявите в начале
var firstName, lastName, price, discount, fullPrice;

// Используйте после
firstName = "John";
lastName = "Doe";

price = 19.90;
discount = 0.10;

fullPrice = price * 100 / 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 = "John";             
var y = new String("John");
(x === y) // является false, потому что x является строкой и y является объектом.
Попробуйте сами »

Или еще хуже:

Пример

var x = new String("John");             
var y = new String("John");
(x == y) // является false, потому что вы не можете сравнивать объекты.
Попробуйте сами »

Не используйте new Object()

  • Используйте {} вместо new Object()
  • Используйте "" вместо new String()
  • Используйте 0 вместо new Number()
  • Используйте false вместо new Boolean()
  • Используйте [] вместо new Array()
  • Используйте /()/ вместо new RegExp()
  • Используйте function (){} вместо new Function()

Пример

var x1 = {};           // new object
var x2 = "";           // new primitive string
var x3 = 0;            // new primitive number
var x4 = false;        // new primitive boolean
var x5 = [];           // new array object
var x6 = /()/;         // new regexp object
var x7 = function(){}; // new function object
Попробуйте сами »

Остерегайтесь автоматических преобразований типов

Помните, что числа могут быть случайно преобразованы в строки или NaN (Not a Number / Не число).

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

Пример

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

При выполнении математических операций JavaScript может преобразовывать числа в строки:

Пример

var x = 5 + 7;       // x.valueOf() является 12,  тип x является числом
var x = 5 + "7";     // x.valueOf() является 57,  тип x является строкой
var x = "5" + 7;     // x.valueOf() является 57,  тип x является строкой
var x = 5 - 7;       // x.valueOf() является -2,  тип x является числом
var x = 5 - "7";     // x.valueOf() является -2,  тип x является числом
var x = "5" - 7;     // x.valueOf() является -2,  тип x является числом
var x = 5 - "x";     // x.valueOf() является NaN, тип x является числом
Попробуйте сами »

Вычитание строки из строки не генерирует ошибку, но возвращает NaN (Not a Number):

Пример

"Hello" - "Dolly"    // возвращает 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) { /*код функции*/ }

Подробнее о параметрах функции и аргументах читайте в Параметры функции


Завершите переключатели (switch) по умолчанию

Всегда завершайте операторы 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";
}
Попробуйте сами »

Избегайте использования eval()

Функция eval() используется для запуска текста как кода. Практически во всех случаях нет необходимости использовать её.

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