Современные концепции в JavaScript (часть 2)

В этой статье давайте обсудим некоторые новые концепции JavaScript. Это продолжение предыдущей статьи. Поэтому я предлагаю вам просмотреть часть 1 этой статьи, прежде чем переходить к этому.

Посетите предыдущую статью -

6. Шаблонные литералы

Ссылается на строковый литерал, допускающий встроенные выражения. Литералы шаблонов должны быть заключены в « вместо « ».

Многострочные строки с использованием шаблонных литералов -

Легко писать многострочные строки без использования «\ n»

Интерполяция выражений -

Встраивать выражения в обычные строки

Это напечатает сумму как 13.

Вложенные шаблоны -

Пожалуйста, обратитесь к статье в разделе «Ссылки», чтобы узнать больше о шаблонных литералах.

7. Классы

Классы JavaScript ведут себя так же, как классы Java. Однако есть несколько ключевых отличий.

• В Javascript мы должны определить конструктор, используя ключевое слово «конструктор», а не имя класса.
• Нет необходимости создавать локальную переменную для вызова «this. ‹Variablename› = variablename» внутри конструктора.
• Легко переопределять функции.

Давайте посмотрим на эти моменты на примере.

8. Разрушение

Это полезная функция, предоставляемая JavaScript для извлечения свойств из объектов и их привязки.

Попробуем разобраться в поведении деструктурирующих объектов на некоторых примерах.

Доступ к ценностям

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

Другой способ использования деструктуризации

Теперь метод напечатает 196. Мы только передали объект vehicle, и требуемый метод извлек из объекта необходимое свойство («base» в приведенном выше примере). Это избавляет от необходимости использовать весь объект.

Назначить значение по умолчанию

Рассмотрим следующий пример,

Приложение напечатало Toyota, потому что свойство «марка» легко доступно внутри автомобиля. Однако внутри транспортного средства нет свойства цвета. Поэтому заявка напечатала «синий», который является значением по умолчанию.

Деструктуризация с функцией

Рассмотрим сценарий, в котором нам нужно прочитать файл.

Мы видим, что код с деструктуризацией намного чище и удобен для разработчиков. Нам не нужно писать «fs.readFileSync».

3 точки (…)

Это совершенно новая функция, представленная в ES6. Его можно использовать в качестве оператора Rest или оператора Spread.

Оператор отдыха

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

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

Оператор распространения

Рассмотрим ситуацию, когда нам нужно включить все элементы объекта в какой-либо список. В таких ситуациях мы можем использовать Оператор распространения.

9. Обещания

Это способ справиться с асинхронными операциями в JavaScript. Обещание - это в основном гарантия того, что мы собираемся что-то делать в будущем. Ценность обещания неизвестна на момент создания. Это значение будет предоставлено в какой-то момент в будущем.

Основные состояния обещания

• В ожидании: состояние до того, как обещание выполнено или не выполнено.
• Решено: операция успешно завершена.
• Отклонено: операция не удалась.

Давайте попробуем разобраться в Promises на нескольких примерах. Рассмотрим ситуацию, когда нам нужно получить данные с веб-сайта,

Почему мы заключили это в обещание?

Потому что HTTP требуется время, чтобы перейти на сервер и получить ответ.

Потребители-

.then: после завершения ответа

.catch (): для регистрации ошибок.

.finally (): этот метод сработает независимо от состояния (разрешить или отклонить).

Теперь, чтобы успешно получить результат, нам нужно вызвать это внутри функции «async» с помощью ключевого слова «await».

• await: оператор, используемый для ожидания обещания.

Что, если бы мы не использовали ключевое слово await?

Тогда программа напечатает undefined. Это потому, что приложение не ждет ответа на обещание (пока обещание не будет разрешено). Ключевое слово «await» допустимо только в «асинхронной» функции.

Я использовал следующее видео г-на Krishntha Dinesh, чтобы собрать необходимую информацию.

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