EcmaScript6 ES6

us.content const MY_CONST = 1; // Можно создавать константы, их менять нельзя, но можно менять значения массива или объекта let a = 1; // Это переменная /*const ex1 = function (i) { // Так было раньше return 100 + i; };*/ // Важно, стрелочные функции не создают контекст и this через них проходит! const ex2 = (i) => { // Создание стрелочной функции return 100 + i; } const ex3 = i => 100 + i; // Краткая запись, если несколько параметров, то нужны скобки (i, str ) const ex4 = (name, age) => ({name, age}) // Стрелочной функция, если нужно вернуть объект const ex5 = { name: 'Test', age: 22, consoleName() { // Функция можно задать без : function, написав сразу так const {name, age} // Чтобы не писать много раз this.name или this.age можно задать такую костанту console.log(name + ' ' + age) } } const {age} = ex5 // Это аналог такой записи: const age = ex5.age const obj = { name: 'Cat', logName: function () { var self = this; // Сейчас можно заменить стрелочной функцией setTimeout(() => 'Name: ' + self.name); setTimeout(function () { return 'Name: ' + self.name; }); } }; const func = (a = 15) => { // Раньше писали a = a || 15; Можно передать underfined и подставиться 15 return a; }; const name = 'Cat'; const age = 30; const fill = {name, age}; // Получить name => cat, age => 30, т.е. название ключей взялись из названий констант const fill2 = {[name + '-' + age]: 100}; // Получиться name-age => 100 // Объекты let obj2 = { name: 'Cat', age: 30 } let {name} = obj2; // Чтобы не писать 2 раза name, можно так let {name, age} = obj2; // Создаются сразу 2 переменные name и age let {name: n, age: a} = obj2; // Создаются сразу 2 переменные n и a Object.assign(obj, obj2); // в obj добавить содержимое obj2 obj3 = Object.assign({}, obj, obj2); // в obj3 положить содержимое obj и obj2 for (let e of Object.entries(obj3)) { // Пройтись по всем ключам и значениям (только по ключам let k of Object.keys(obj3), только по значениям let v of map.Object(obj3)) console.log(`${e[0]} - ${e[1]}`); } // Массивы let arr = ['Cat', 30]; let [name, age] = arr; // Создаются сразу 2 переменные name и age let [, age] = arr; // Создаётся одна переменная age let [, age = 33] = arr; // Создаётся одна переменная age и по-умолчанию 33 let find = arr.find('Cat'); // Возвращает один элемент в массиве, можно передать условие find(x => x > 3) // Set (подобие массива, только содержит уникальные значения) let set = new Set(); // Можно прям сюда добавить new Set('cat', 10) set.add('cat'); // Добавить в сет, можно написать по цепочке set.add('cat').add('10') set.add('10'); set.has('cat'); // Проверить, существует ли cat, возвращает true или false set.size; // Размер сета set.delete('cat'); // Удалить значение cat set.clear('cat'); // Удалить все значение // WeakSet (тоже что и Set, только если какое-либо значение равно null, то оно удаляется из сета) let weak = new WeakSet(); // Map (подобие объекта, только содержит уникальные значения) let map = new Map(); // Можно прям сюда добавить new Map([['name', 'Cat'], ['age', 30]]) map.set('name', 'Cat'); // Положить в объект map.set('age', '30'); map.get('name'); // Достать name map.has('name'); // Проверить, существует ли name, возвращает true или false map.delete('name'); // Удалить name map.size; // Размер map for (let e of map.entries()) { // Пройтись по всем ключам и значениям (только по ключам let k of map.keys(), только по значениям let v of map.values()) console.log(`${e[0]} - ${e[1]}`); } // WeakMap (тоже что и Map, только если какое-либо значение равно null, то оно удаляется из map) let weak = new WeakMap(); // Функция для вывода любого кол-ва аргументов (оператор Rest, для сбора аргументов) function logArgs(num, ...args) { // Раньше писали так var args = Array.prototype.slice.call(arguments); console.log(num, args); } logArgs(20, ...arr); // В параметры передаются значения массива arr, в любом кол-ве (оператор Spread, чтобы разворачивать объекты) // Строки let str1 = `Name: ${name}, age: ${10 + 20}`; // Можно в строку вставлять переменные str1.repeat(3); // Повторить 3 раза строку str1.startsWith('Name'); // Начинается ли строка с Name или str1.startsWith('me', 2), возвращает true или false str1.includes('Name'); // Входит ли строка с Name или str1.includes('me', 2), возвращает true или false // Циклы for (let i = 0; i < arr.length; i++) { console.log(arr[i]); } arr.forEach(function (item) { console.log(item); }); // Новый вариант цикла for (let i of arr) { console.log(arr[i]); } // Классы class Car { constructor(name) { // Конструктор класса this.name = name; } logName() { // Метод класса console.log(this.name); } static staticName() { // Статический метод console.log('Static name'); } } let car = new Car('Audi'); // Экземкляр класса car.logName(); // Вызов метода класса Car.staticName(); // Вызов статической функции class Moto extends Car { // Наследование класса Car constructor(name) { super(name); // Для наследования конструктора наследоваемого класса } logName() { // Переписать метод класса Car //super.logName(); // Вызвать метод родителя console.log(this.name); } } // Export let name = 'Cat'; export name; // Можно так export let name = 'Cat'; export {name, age}; export function func(); // Экпортировать функцию export default function func(); // тогда импорт import func from './script'; // Import import * as extra from './script'; // Импортировать всё из script.js (который на одном уровне) в объект extra import {name, age} from './script'; // Так импортируются конкретные переменные, можно поменять название переменных {name as n} import {func} from './script'; // Импортировать функцию import './scripts'; // Импортировать файл // window.Bootstrap = require('bootstrap.native/dist/bootstrap-native-v4') // Импортировать глобально // Символы (получить уникальное поле, только с помощью поля, через которое он создавался) let s = Symbol('Cat'); console.log(Object.getOwnPropertySymbols(obj)); // Посмотреть символы в объекте // Последовательность Фебоначи let fib = { [Symbol.iterator]() { let pre = 0, cur = 1; return { next() { [pre, cur] = [cur, pre + cur]; return {value: cur, done: false}; } } } }; for (let n of fib) { if (n > 1500) break; console.log(n); }