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

ключевое слово пусть

  • let позволяет вам объявлять переменные, ограниченные областью действия оператора блока или выражения, в котором он используется, в отличие от ключевого слова var, которое объявляет переменную глобально или локально для всей функции независимо от того, области действия блока.
  • Другое различие между var и let заключается в том, что последний инициализируется значением только тогда, когда его оценивает синтаксический анализатор.
var x = 10;
// Here x is 10
{
    let x = 2; // Here x is 2
}
// Here x is 10

ключевое слово const

  • Константы имеют блочную область видимости, как и переменные, объявленные с использованием ключевого слова let. Значение константы нельзя изменить путем переназначения, и ее нельзя повторно объявить.
  • Однако, если константа является объектом или массивом, ее свойства или элементы могут быть обновлены или удалены.
var x = 10;
// Here x is 10
{
    const x = 2; // Here x is 2
}
// Here x is 10

Стрелочные функции

Выражение со стрелочной функцией — это компактная альтернатива традиционному функциональному выражению, но оно ограничено и не может использоваться во всех ситуациях. Стрелочные функции не имеют собственных привязок к this, arguments или super, и их не следует использовать в качестве метода.

const items = [
   'abc',
   'xyz',
   'pqrs'
];
console.log(items.map(item => item.length));
// expected output: Array [3, 3, 4]

Для/из

Оператор for…of создает цикл, перебирающий итерируемые объекты, включая встроенные и определяемые пользователем итерируемые объекты.

const array1 = ['a', 'b', 'c'];
for (const element of array1) {
    console.log(element);
}
// expected output: "a"
// expected output: "b"
// expected output: "c"

Объекты карты

Объект Map повторяет свои элементы в порядке вставки — цикл for…of возвращает массив [key, value] для каждой итерации.

const myMap = new Map();
myMap.set('a', 1);
myMap.set('b', 2);
myMap.set('c', 3);
console.log(myMap.get('a'));
// expected output: 1
myMap.set('a', 97);
console.log(myMap.get('a'));
// expected output: 97
console.log(myMap.size);
// expected output: 3
myMap.delete('b');
console.log(myMap.size);
// expected output: 2

Установить объекты

Объекты Set представляют собой наборы значений. Вы можете перебирать элементы набора в порядке вставки. Значение в наборе может встречаться только один раз; он уникален в коллекции Сета.

const mySet = new Set()
mySet.add(1)           // Set [ 1 ]
mySet.add(5)           // Set [ 1, 5 ]
mySet.add(5)           // Set [ 1, 5 ]
mySet.add('some text') // Set [ 1, 5, 'any str' ]
console.log(mySet.has(4)) //false
console.log(mySet.has(1)) //true
mySet.delete(1)
console.log(mySet.has(1)) //false

Классы

Классы — это шаблон для создания объектов. Они инкапсулируют данные с кодом для работы с этими данными. Классы в JS построены на прототипах, но также имеют некоторый синтаксис и семантику, которые не используются в семантике классов ES5.

class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
  // Getter
  get area() {
    return this.calcArea();
  }
  // Method
  calcArea() {
    return this.height * this.width;
  }
}
const square = new Rectangle(20, 20);
console.log(square.area); //400

Обещания

Обещание — это объект, представляющий возможное завершение или сбой асинхронной операции. Объект JavaScript Promise может быть: Ожидающим Выполненным Отклоненным.

var promise = new Promise(function(resolve, reject){   . . .}); //or
ES6 var promise = new Promise((resolve, reject)=> {   . . .});

Символ

Символ — это встроенный объект, конструктор которого возвращает примитив символа — также называемый значением символа или просто символом — который гарантированно уникален. Чтобы создать новый примитивный символ, вы пишете Symbol() с опциональной строкой в ​​качестве описания.

let sym1 = Symbol()
let sym2 = Symbol('abc')
let sym3 = Symbol('pqr')
Symbol('abc') === Symbol('abc')  // false

Параметры по умолчанию

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

function multiply(a, b = 1) {
    return a * b;
}
console.log(multiply(5, 2));
// expected output: 10
console.log(multiply(5));
// expected output: 5

Параметр покоя функции

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

function sum(...theArgs) {
    let total = 0;
    for (const arg of theArgs) {
        total += arg;
    }
    return total;
}
console.log(sum(1, 2, 3));
// expected output: 6
console.log(sum(1, 2, 3, 4));
// expected output: 10

Строка.includes()

Метод include() выполняет поиск с учетом регистра, чтобы определить, можно ли найти одну строку в другой строке, возвращая true или false в зависимости от ситуации.

'test abc 123'.includes('abc')  // returns true
'test abc 123'.includes('Abc')  // returns false

Строка.startsWith()

Метод startWith() определяет, начинается ли строка с символов указанной строки, возвращая true или false в зависимости от ситуации.

let str = 'test abc 123 xyz'
console.log(str.startsWith('test abc'))          // true
console.log(str.startsWith('abc'))      // false

String.endsWith()

Метод endWith() определяет, заканчивается ли строка символами указанной строки, возвращая true или false в зависимости от ситуации.

let str = 'test abc 123 xyz'
console.log(str.endsWith('123 xyz'))          // true
console.log(str.endsWith('123'))      // false

Массив.от()

Статический метод Array.from() создает новый неглубоко скопированный экземпляр Array из массивоподобного или итерируемого объекта.

Array.from('foo');
// [ "f", "o", "o" ]
const set = new Set(['foo', 'bar', 'baz', 'foo']);
Array.from(set);
// [ "foo", "bar", "baz" ]
Array.from([1, 2, 3], x => x + x);
// [2, 4, 6]

Ключи массива()

Метод keys() возвращает новый объект Array Iterator, содержащий ключи для каждого индекса в массиве.

const array1 = ['a', 'b', 'c', d];
const iterator = array1.keys();
for (const key of iterator) {
    console.log(key);
}
// expected output: 0
// expected output: 1
// expected output: 2
// expected output: 3

Поиск массива ()

Метод find() возвращает первый элемент предоставленного массива, который удовлетворяет предоставленной функции тестирования. Если никакие значения не удовлетворяют функции тестирования, возвращается значение undefined.

const array1 = [5, 8, 12, 8, 130, 44];
const found = array1.find(element => element > 10);
console.log(found);
// expected output: 12

Массив найтиИндекс()

Метод findIndex() возвращает индекс первого элемента в массиве, который удовлетворяет предоставленной функции тестирования. В противном случае возвращается -1, что указывает на то, что ни один элемент не прошел проверку.

const array1 = [5, 8, 12, 8, 130, 44];
const isLargeNumber = (element) => element > 13;
console.log(array1.findIndex(isLargeNumber));
// expected output: 4

Объект.записи

Метод Object.entries() возвращает массив собственных перечислимых пар свойств со строковыми ключами данного объекта [ключ, значение]. Это то же самое, что итерация с циклом for…in, за исключением того, что цикл for…in также перечисляет свойства в цепочке прототипов.

const object1 = {
    a: 'somestring',
    b: 42
};
for (const [key, value] of Object.entries(object1)) {
    console.log(`${key}: ${value}`);
}
// expected output:
// "a: somestring"
// "b: 42"

Если есть необходимость в другом порядке, то сначала следует отсортировать массив, например Object.entries(obj).sort((a, b) => b[0].localeCompare(a[0]));

Спасибо за прочтение. Если вы нашли статью полезной, не забудьте аплодировать ирассказать о ней своим друзьям и коллегам. Если у вас есть какие-либо вопросы, не стесняйтесь обращаться ко мне. Свяжитесь со мной в 👉 LinkedIn, Github :)