Часть 1
Введение:
JavaScript — это язык программирования высокого уровня, созданный в 1995 году Бренданом Эйхом для веб-разработки. С тех пор он превратился в универсальный язык, используемый для разработки веб-приложений, серверной части и мобильных приложений. JavaScript был стандартизирован ECMA International в 1997 году как ECMAScript и выпущен в 2015 году с новыми функциями, такими как стрелочные функции, литералы шаблонов, деструктуризация и оператор расширения.
Обзор ES6:
ES6 (ECMAScript 2015) — это версия JavaScript, выпущенная в 2015 году. Она включает в себя новые функции, такие как стрелочные функции, литералы шаблонов, деструктурирование, оператор распространения, классы, модули, let и const, параметры по умолчанию, карту и набор объектов, промисы. , генераторы, async/await и усовершенствования литерала объекта, чтобы сделать кодирование проще, эффективнее и удобнее в сопровождении.
Новые функции в ES6:
- Стрелочные функции. Стрелочные функции — это сокращение для написания анонимных функций в JavaScript. Она также известна как функция «толстая стрелка» и обозначается оператором «=›».
(param1, param2, ...) => { function body } or param => expression // For single expression
Случаи использования и преимущества:
- Лаконичный и читаемый код
- This-binding: стрелочные функции не имеют собственного ключевого слова
this
, поэтому они автоматически наследуют значениеthis
окружающего контекста. - Подходит для функционального программирования и функций обратного вызова
Сравнение с обычными функциями:
- Стрелочные функции не имеют собственного ключевого слова
this
, в отличие от традиционных функций. - Стрелочные функции нельзя использовать в качестве конструкторов, в отличие от традиционных функций.
- Стрелочные функции не имеют объекта аргументов, в отличие от традиционных функций.
Пример:
// Traditional function function multiply(a, b) { return a * b; } // Arrow function equivalent const multiply = (a, b) => a * b;
2. Объяснение let и const:
- let и const используются для объявления переменных.
- Переменным, объявленным
let
, можно присвоить новое значение. - Переменные, объявленные с помощью
const
, не могут быть переназначены.
Сравнение с var:
- var — это старый способ объявления переменных в JavaScript.
- var имеет область действия функции, а
let
/const
имеет область действия блока.
Преимущества использования let
и const
по сравнению с var
:
- Лучшее понимание области видимости переменных.
- Предотвращает непреднамеренное изменение переменных.
- Предотвращает подъем переменной.
Случаи использования let
:
- Когда вы хотите переназначить значение переменной.
Случаи использования const
:
- Когда вы хотите объявить постоянное значение, которое нельзя изменить.
Пример:
const name = "John Doe"; console.log(name); // Output: "John Doe" let age = 30; console.log(age); // Output: 30
3. Деструктуризация. Деструктуризация в JavaScript означает распаковку значений из массивов или объектов в отдельные переменные.
Деструктуризация массива:
- Синтаксис:
const [var1, var2, ...varX] = array;
- Присваивает переменным соответствующие значения в массиве.
Деструктуризация объекта:
- Синтаксис:
const {var1, var2, ...varX} = object;
- Назначает переменные соответствующим свойствам объекта.
Преимущества деструктуризации:
- Лаконичный и читаемый код
- Простой доступ к значениям объекта/массива
- Улучшенная организация кода
Случаи использования для деструктуризации:
- Извлечение значений из массивов или объектов.
- Использование нескольких возвращаемых значений из функций.
- Деструктуризация как аргументы функции.
Пример:
const numbers = [1, 2]; const [one, two, three = 3] = numbers; console.log(one, two, three); // Output: 1 2 3 const person = { name: "John Doe", age: 30 }; const { name: fullName, age } = person; console.log(fullName, age); // Output: "John Doe" 30 const { name, ...otherProps } = person; console.log(name, otherProps); // Output: "John Doe" { age: 30 }
4. Оператор распространения:оператор распространения в JavaScript представлен тремя точками (...
) и используется для распространения элементов массива или свойств объекта в новый массив или объект.
Синтаксис:
- Оператор расширения массива:
const newArray = [...oldArray]
- Оператор распространения объекта:
const newObject = {...oldObject}
Случаи использования и преимущества:
- Копирование массивов или объектов.
- Объединение массивов или объектов.
- Использование внутрифункциональных вызовов или деструктуризация.
Примеры:
- Копирование массива:
const oldArray = [1, 2, 3]; const newArray = [...oldArray]; console.log(newArray); // Output: [1, 2, 3]
2. Объединение объектов:
const obj1 = { a: 1, b: 2 }; const obj2 = { c: 3, d: 4 }; const newObject = { ...obj1, ...obj2 }; console.log(newObject); // Output: { a: 1, b: 2, c: 3, d: 4 }
3. Использование внутрифункциональных вызовов:
const numbers = [1, 2, 3]; console.log(Math.max(...numbers)); // Output: 3
Я закончил часть 1 и перейду к части 2 в следующей истории.
Если вы хотите узнать больше о программировании на Javascript, обязательно подпишитесь на меня, чтобы увидеть больше фрагментов кода и примеров. Я буду делиться ценной информацией и советами о том, как освоить язык и улучшить свои навыки разработчика. Итак, следите за обновлениями, и давайте продолжим учиться вместе.
Спасибо за прочтение. Удачного обучения 😄
Дополнительные материалы на PlainEnglish.io. Подпишитесь на нашу бесплатную еженедельную рассылку новостей. Подпишитесь на нас в Twitter, LinkedIn, YouTube и Discord .
Заинтересованы в масштабировании запуска вашего программного обеспечения? Ознакомьтесь с разделом Схема.