Учебное пособие по Javascript Es6.
Введение:
ECMAScript 6 2015 версии , также известный как ES6 и ECMAScript 2015. это новая версия языка Javascript, это одна из основных вех в развитии Javascript. Он появился через 6 лет после выхода Es5, выпущенного в 2009 году. ES6 поддерживается всеми основными браузерами, кроме Internet Explorer 9. В нем появилось много новых важных функций, которые я собираюсь показать вы ниже через секунду.
ES6 Представлен замечательный простой синтаксис для написания Javascript, а также есть несколько дополнительных полезных функций, которые помогают вам в процессе разработки и упрощают работу для вас как разработчика. Поэтому, прежде чем читать эту статью, вам нужно немного узнать о Javascript Es5, чтобы понять Es6.
Пусть и Const:
В Javascript ES5 использование только ключевого слова var вызывает некоторые проблемы, когда дело доходит до обработки ошибок, например, если вы инициализировали одну и ту же переменную ключевым словом var 2 раза, она не выдает ошибку. как этот ниже:
Если вы попробуете тот же пример с Let и Const, в консоли появится ошибка. Ключевое слово Let используется, когда ваша переменная после этого изменится. С другой стороны, Const используется, когда вы не собираетесь изменять переменную после нее или присваивать ей другое значение.
Пусть и const имеют область действия блока, что означает, что они не будут доступны за пределами области действия блока. Взгляните на пример ниже.
Обратите внимание, что ключевое слово Const действует так же, как ключевое слово Let, с той лишь разницей, что первое используется для переменных, которые будут постоянными, а противоположное - для Пусть ключевое слово.
Стрелочные функции:
В ES5, мы писали такие функции:
ES6 предоставляет нам синтаксический сахар, который делает написание функций очень простым и интересным. вы можете использовать синтаксис стрелочных функций, как показано ниже:
Вы также можете написать стрелочную функцию без ключевого слова return и фигурных скобок ({}), но это только в том случае, если ваша функция содержит только один оператор. Кроме того, вы можете написать функцию без скобок, если она имеет только один параметр. взгляните на пример ниже:
Еще одна дополнительная функция для функций со стрелками заключается в том, что вы можете установить параметры по умолчанию. Поэтому, если вы не указали значение для своего параметра, для этого параметра будет добавлено значение по умолчанию. взгляните на пример ниже:
Классы ES6:
класс - это тип функции, но вместо использования ключевого слова function для ее запуска мы используем ключевое слово class, а свойства назначаются внутри constructor() метода. Поэтому мы используем ключевое слово Class для создания класса, а также добавляем к нему метод конструктора.
Простое определение класса с именем «Автомобиль»:
Создайте объект под названием «моя машина» на основе класса Car:
Создание строк с использованием шаблонных литералов:
Одной из важных функций ES6 является возможность создавать строки с помощью шаблонных литералов, что упрощает написание сложных строк. Он позволяет создавать многострочные строки и использовать функции интерполяции строк для создания строк. Взгляните на пример ниже:
Обратите внимание, что в примере используются обратные кавычки («), а не кавычки (« «). Кроме того, нет конкатенации строк со знаком (+).
Назначение деструктуризации:
Деструктурирование присваивания - еще одна функция ES6, которая позволяет назначать переменным значения, взятые из объектов или массивов.
В ES5 мы использовали для присвоения значений объектов таким переменным:
В ES6 с использованием Destructuring Assignment мы делаем это следующим образом:
Деструктурирование присвоения с помощью массивов:
Обратите внимание, что мы рассмотрели не все о деструктурировании назначения, поэтому обязательно узнайте больше из других ресурсов, потому что я просто даю вам основы.
Создайте обещание JavaScript:
Promise в Javascript звучит так, как будто он используется для выполнения обещаний выполнять что-то асинхронно. Когда обещание выполнено, это означает, что вы выполнили это обещание или, возможно, не смогли его выполнить.
Обещание принимает функцию с двумя параметрами: «решить», что означает, что обещание выполнено успешно, и «отклонить», что означает, что обещание не выполнено. Взгляните на пример ниже:
Обработайте выполненное обещание с помощью then:
Метод then (.then) выполняется сразу после выполнения вашего обещания с помощью resolve. Взгляните на пример ниже:
Обработка отклоненного обещания с помощью Catch:
catch - это метод, используемый, когда ваше обещание было отклонено. Он выполняется сразу после вызова метода reject обещания. Взгляните на пример ниже:
Вывод:
Убедитесь, что мы не рассмотрели все в Es6, есть еще много функций, которым вы можете научиться из других ресурсов. Так что просто продолжайте учиться, потому что это никогда не прекращается, особенно в области веб-разработки и разработки программного обеспечения, где технологии быстро меняются.
