JavaScript Распространённые ошибки

В этой главе мы обсудим распространённые ошибки JavaScript.

---

Неправильное использование оператора присваивания

В JavaScript-программе, если вы используете знак равенства оператора присваивания (=) в условии if, это приведёт к неверному результату. Правильный способ — использовать знак двойного равенства оператора сравнения (==).

ifУсловие возвращаетfalse(как мы и ожидали), потому что x не равен 10:

ifУсловие возвращаетtrue(не то, что мы ожидали), потому что в условии присваивается x = 10, а 10 — это true:

ifУсловие возвращаетfalse(не то, что мы ожидали), потому что в условии присваивается x = 0, а 0 — это false:

	Инструкция присваивания возвращает значение переменной.

Распространённые ошибки при работе с операторами сравнения

При обычном сравнении тип данных игнорируется. Следующее условие if возвращает true:

При строгом сравнении === — это оператор идентичности, который проверяет и значение, и тип выражений. Следующее условие if возвращает false:

Такая ошибка часто встречается в операторах switch, потому что в операторах switch для сравнения используется оператор идентичности (===):

Следующий пример вызовет всплывающее окно alert:

Следующий пример не вызовет всплывающее окно alert, потому что типы не совпадают:

---

Меры предосторожности при сложении и конкатенации

Сложение— это складывание двухчиселвместе.

Конкатенация— это соединение двухстроквместе.

JavaScript использует оператор + как для сложения, так и для конкатенации.

Далее мы можем использовать примеры, чтобы увидеть разницу между сложением двух чисел и конкатенацией числа со строкой:

Использование переменных для сложения также даёт непоследовательные результаты:

---

Меры предосторожности при работе с данными с плавающей точкой

Все данные в JavaScript хранятся как 64-битныеданные с плавающей точкой (float)для хранения.

Всем языкам программирования, включая JavaScript, сложно определить точность данных с плавающей точкой:

Чтобы решить вышеуказанную проблему, можно использовать целочисленное умножение и деление:

Для получения более подробной информации можно обратиться к:Проблемы точности в JavaScript и их решения

---

Переносы строк в строках JavaScript

JavaScript позволяет использовать переносы строк в строках:

Однако использование символа возврата каретки для переноса строки непосредственно в строке вызовет ошибку:

Вы можете открыть инструменты разработчика или нажать F12, чтобы просмотреть сообщение об ошибке:

Чтобы сделать перенос строки в строке, нужно использовать обратную косую черту (\), как показано ниже:

---

Некорректное использование точек с запятой

В следующем примере инструкция if теряет своё тело. Исходное тело инструкции if выполняется как независимый блок кода, что приводит к неверному выводу.

Из-за неправильного использования точки с запятой блок кода в инструкции if будет выполняться всегда:

---

Примечания об операторе return

По умолчанию JavaScript автоматически завершает инструкцию в конце строки.

Следующие два примера возвращают один и тот же результат (в одном есть точка с запятой, в другом нет):

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

Следующие примеры возвращают один и тот же результат:

Однако следующий пример вернётundefined：

Почему это происходит? Потому что в JavaScript код в примере 4 эквивалентен следующему коду:

function myFunction(a) {
    var
    power = 10;  
    return;       // 分号结束，返回 undefined
    a * power;
}

Объяснение

Если это незавершённая инструкция, как показано ниже:

var

JavaScript попытается прочитать инструкцию во второй строке:

power = 10;

Но поскольку такая инструкция является завершённой:

return

JavaScript автоматически закроет инструкцию:

return;

В JavaScript точки с запятой необязательны.

Поскольку return является завершённой инструкцией, JavaScript завершит инструкцию return.

	Примечание:Не разрывайте инструкцию return по строкам.

---

Использование имён для индексации массивов

Многие языки программирования позволяют использовать имена в качестве индексов массива.

Массивы, в которых в качестве индексов используются имена, называются ассоциативными массивами (или хешами).

JavaScript не поддерживает использование имён для индексации массивов; он допускает только числовые индексы.

В JavaScript,объектыиспользуютимена в качестве индексов.。

Если вы используете имена в качестве индексов, JavaScript переопределит массив как стандартный объект при доступе к массиву.

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

---

При определении элементов массива не добавляйте завершающую запятую

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

var colors = [5, 6, 7,]; //这样数组的长度可能为3 也可能为4.

Правильный способ определения:

points = [40, 100, 1, 5, 25, 10];

---

При определении объекта не добавляйте завершающую запятую

Неправильный способ определения:

websites = {site:"Example", url:"www.example.com", like:460,}

Правильный способ определения:

websites = {site:"Example", url:"www.example.com", like:460}

---

undefined — это не null

В JavaScriptnullиспользуется для объектов,undefinedиспользуется для переменных, свойств и методов.

Объект может быть null, только если он был определён; в противном случае он undefined.

Если мы хотим проверить, существует ли объект, будет выброшена ошибка, если объект ещё не определён.

Неправильное использование:

if (myObj !== null && typeof myObj !== "undefined") 

Правильный способ — сначала использовать typeof, чтобы проверить, определён ли объект:

if (typeof myObj !== "undefined" && myObj !== null) 

---

Блочная область видимости

В каждом блоке кода JavaScript не создаёт новую область видимости; как правило, областью видимости каждого блока кода является глобальная.

Переменная i в следующем коде возвращает 10, а не undefined:

Другие расширения