Привет всем, надеюсь, у вас все хорошо, наконец мы начинаем новую подтему в JavaScript! Я всегда делаю заметки к каждой главе в моем приложении Notes на моем Mac, нам удалось достичь 100 глав! Давайте начнем с ES6 с FreeCodeCamp.

Введение в ES6

Но что это за загадочный ES6? Что ж, до сих пор мы изучали стандартизированную версию JavaScript, также известную как ECMAScript, или сокращенно ES. Этот термин и JavaScript взаимозаменяемы.

До сих пор мы рассматривали ES5, который был завершен в 2009 году, его все еще можно использовать для программирования, однако, как и другие компьютерные языки, JS постоянно развивается, а ES6, выпущенный в 2015 году, является следующим этапом эволюции JS. что мы рассмотрим.

Примечание. На данный момент в уроках FreeCodeCamp ES6 - это последняя версия, которую охватывает FreeCodeCamp, однако новые версии ES выходят каждый год, а текущая версия на сегодняшний день - ES11 или ECMAScript 2020.

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

Разница между Var и Let

Когда мы объявляем переменную, мы обычно используем ключевое слово var, которое мы можем позже перезаписать в коде. Это потенциально могло вызвать проблемы и ошибки в больших фрагментах кода.

Одно из решений этой проблемы - использовать вместо этого новое ключевое слово ES6 let. Это ключевое слово объявляет переменную так же, как var, но позже сигнализирует об ошибке, если эта переменная будет перезаписана в будущем. Итак, let объявляет переменную один раз и не может быть перезаписана.

Кроме того, мы также можем использовать термин «использовать строгий», который включает строгий режим и выявляет распространенные ошибки кодирования, потенциально «небезопасные» действия и ошибки. Взглянем:

Сравнение объема ключевого слова Let или Var

Когда мы объявляем переменную с помощью var, мы можем объявить ее в глобальной области действия или вручную в локальной области (например, внутри функции).

Ключевое слово let похоже, но с некоторыми изящными дополнительными функциями. Например, когда мы объявляем let внутри блока, оператора или выражения, его область действия ограничена этим блоком, оператором или выражением.

Во-первых, давайте посмотрим, как реагирует var:

Как видно из инициализации цикла for, i объявлен с var в global , поэтому, когда i ++ (конечное выражение в цикле for, увеличивает значение i на цикл), глобальная переменная i обновляется. Этот пример выше можно было бы записать так, с теми же результатами:

Это может вызвать проблемы, если эта функция будет создана и сохранена для дальнейшего использования в цикле for, который использует переменную, также называемую i. Ниже приведен пример фрагмента кода, в котором случайно используется global i при инициализации цикла for:

Примечание. Обратите внимание, как мы говорим, что i строго равно 2, однако при распечатке мы возвращаем 3. Это связано с тем, что обновленная глобальная переменная i используется, как она была ранее определена как 3, а не значение of i, который был создан в этом конкретном цикле for.

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

Введите ключевое слово let, это обновление не позволяет выполнять такое поведение в ES6:

Примечание. i не определен, поскольку i не был объявлен в глобальной области. Также рекомендуется использовать разные идентификаторы переменных, чтобы не вводить в заблуждение (не всегда используйте букву i в каждом цикле, который вы пишете, черт возьми!).

Объявление переменных только для чтения с помощью Const

И это плавно возвращает нас к const, о котором мы говорили вчера, это ключевое слово, которое мы используем перед объявлением переменной, которую мы хотим оставить «постоянной».

Он использует все возможности let, но добавляет, что переменные доступны только для чтения. Распространенной практикой записи переменных const является использование прописных букв с разделением нескольких слов подчеркиванием, это поможет вам следить за тем, какие переменные находятся в режиме только для чтения, например: «DOGS_RULE» (вы знаю это). Давайте посмотрим на эти новые функции, обратите внимание на положение const и let:

И это распечатывает:

Заменить массив, объявленный с помощью Const

Рекомендуется создавать все идентификаторы переменных с помощью const, а когда вы знаете, что идентификатор должен быть гибким, используйте let.

Однако помните, что объекты (включая функции, массивы и т. Д.) Все еще изменяемы (их можно редактировать), const только предотвращает изменение идентификатора этого объекта, массива и т. Д. изменено, а не его содержимое.

Таким образом, когда переменная была установлена ​​с помощью const, ее не совсем безопасно редактировать, и мы все равно можем получить доступ к свойствам этой переменной и редактировать их, например значения в массиве, где само имя массива установлено с помощью const, мы все равно можем изменить свойства / values ​​с подобными индексам массива, например array [0] = (напишите здесь другое значение).

Предотвращение мутации объекта

Теперь предположим, что мы хотим предотвратить изменение свойств данного объекта, как мы это сделаем? К счастью, эта проблема решена с помощью функции Object.freeze (). После того, как эта функция вступит в силу, вы больше не сможете добавлять, обновлять или удалять ее свойства. Давайте взглянем:

Аааи давай сделаем перерыв. Спасибо всем за то, что учились вместе со мной сегодня, и увидимся в следующий раз!