6 проблем, которые вы должны знать о внешнем интерфейсе.

Как фронтенд-разработчики, JavaScript является нашим основным языком разработки. Он имеет относительно простой синтаксис и устоявшуюся экосистему, которая становится все более влиятельной в сообществе. В процессе его использования мы часто сталкиваемся с разными странными проблемами, которые зачастую ставят нас в тупик. Поэтому я составил список из 6 распространенных и интересных вопросов.

1. Странное поведение try…catch

Вопрос: Что вернет следующий код при выполнении, 2 или 3?

Ответ 3. Почему так? Это связано с тем, что в операторе try…catch…finally предложение finally выполняется независимо от того, было ли выброшено исключение. Кроме того, если возникает исключение, операторы в предложении finally выполняются, даже если для обработки исключения нет предложения catch.



2. [] и null являются объектами

Каков результат следующих 3 строк кода?

Результат возврата выглядит так.

Оператор typeof возвращает строку и должен соответствовать таблице 37: возвращаемое значение оператора typeof . Он возвращает строку «object» для нулевых, обычных объектов, объектов, специфичных для стандарта, и нестандартных объектов, которые не реализуют [[Call]].

Однако вы можете использовать метод toString для проверки типа объекта.



3. Стрелочная функция возвращает значение undefined

Почему функция f2 возвращает значение undefined после выполнения?

Наше первое впечатление должно состоять в том, чтобы вернуть {}, но он возвращает неопределенное значение, по сути потому, что стрелочная функция возвращает {}, является частью синтаксиса стрелочной функции, {} не возвращает, поэтому по умолчанию возвращается неопределенное значение. Мы можем написать тестовый пример, чтобы увидеть.

Таким образом, приведенная выше функция f2 возвращает undefined, хотя при необходимости можно вернуть объект {}, просто заключив возвращаемое значение в круглые скобки.

let f2 = () => ({});
f2(); // -> {}

4. Можем ли мы также использовать обратные кавычки для выполнения функций?

Есть ли другой способ вызвать функцию, кроме приведенного ниже?

И, конечно же, мы можем использовать вызов «backquote».

Это выглядит потрясающе, но на самом деле здесь используется строка шаблона. Это расширенная форма строки трафарета, строка трафарета с меткой. В приведенном выше примере кода функция f является литеральной меткой шаблона. Метка может использоваться для разбора строки шаблона функции. Первый аргумент функции тега содержит массив строковых значений. Остальные параметры связаны с выражением.



5. Есть ли теги в JavaScript?

Не будет ли проблем с этим стилем письма ниже?

Ответ отрицательный, он вернет строку Hello. Это связано с тем, что foo распознается как тег и затем выполняется, за которым следует console.log("Hello"), а затем break foo для прерывания выполнения. Мы часто используем операторы с метками вместе с операторами break/continue для завершения или продолжения цикла.



6. {}{} не определено

Мы можем протестировать следующий код в консоли. Подобная структура вернет значение последнего определенного объекта.

При синтаксическом анализе {} оно возвращает undefined, а при синтаксическом анализе {foo: ‘bar’}{} выражение {foo: ‘bar’} возвращает ‘bar’.

Здесь {} имеет два значения: это означает «объект» или это означает «блок кода».

Например, {} в () => {} означает «блок кода». Поэтому нам нужно добавить круглые скобки: () =› ({}), чтобы он правильно возвращал объект.

Итак, если мы теперь используем {foo: ‘bar’} как «блок», мы можем написать это в терминале.

Ага, тот же результат! Таким образом, скобки в {foo: ‘bar’}{} означают «блок кода».

Добро пожаловать в Twitter, LinkedIn и GitHub!

Писать всегда было моей страстью, и мне доставляет удовольствие помогать людям и вдохновлять их. Если у вас есть какие-либо вопросы, обращайтесь!

Дополнительные материалы на PlainEnglish.io. Подпишитесь на нашу бесплатную еженедельную рассылку новостей. Подпишитесь на нас в Twitter, LinkedIn, YouTube и Discord.