В този урок ще научите за JavaScript ES6 с помощта на примери.
JavaScript ES6 (известен също като ECMAScript 2015 или ECMAScript 6 ) е по-новата версия на JavaScript, въведена през 2015 г.
ECMAScript е стандартът, който използва езикът за програмиране JavaScript. ECMAScript предоставя спецификацията за това как трябва да работи езикът за програмиране JavaScript.
Този урок предоставя кратко резюме на често използваните функции на ES6, така че можете да започнете бързо в ES6.
Оставете JavaScript
JavaScript letсе използва за деклариране на променливи. Преди това променливите бяха декларирани с помощта на varключовата дума.
За да научите повече за разликата между letи var, посетете JavaScript let vs var.
Променливите, декларирани с използване, letса с блоков обхват . Това означава, че те са достъпни само в рамките на определен блок. Например,
// variable declared using let let name = 'Sara'; ( // can be accessed only inside let name = 'Peter'; console.log(name); // Peter ) console.log(name); // Sara
JavaScript конст
Операторът constсе използва за деклариране на константи в JavaScript. Например,
// name declared with const cannot be changed const name = 'Sara';
След като бъде деклариран, не можете да промените стойността на constпроменлива.
Функция за стрелка на JavaScript
Във версията ES6 можете да използвате функции със стрелки, за да създавате функционални изрази. Например,
Тази функция
// function expression let x = function(x, y) ( return x * y; )
може да се запише като
// function expression using arrow function let x = (x, y) => x * y;
За да научите повече за функциите на стрелките, посетете JavaScript Arrow Function.
JavaScript класове
JavaScript класът се използва за създаване на обект. Класът е подобен на конструкторска функция. Например,
class Person ( constructor(name) ( this.name = name; ) )
Ключовата дума classсе използва за създаване на клас. Свойствата се присвояват във функция конструктор.
Сега можете да създадете обект. Например,
class Person ( constructor(name) ( this.name = name; ) ) const person1 = new Person('John'); console.log(person1.name); // John
За да научите повече за класовете, посетете JavaScript Classes.
Стойности на параметрите по подразбиране
Във версията ES6 можете да предавате стойности по подразбиране във функционалните параметри. Например,
function sum(x, y = 5) ( // take sum // the value of y is 5 if not passed console.log(x + y); ) sum(5); // 10 sum(5, 15); // 20
В горния пример, ако не предадете параметъра за y, по подразбиране ще отнеме 5 .
За да научите повече за параметрите по подразбиране, посетете функцията по подразбиране на функцията JavaScript.
JavaScript шаблони литерали
Шаблонният литерал улесни включването на променливи в низ. Например, преди да трябва да направите:
const first_name = "Jack"; const last_name = "Sparrow"; console.log('Hello ' + first_name + ' ' + last_name);
Това може да се постигне с помощта на литерала на шаблон чрез:
const first_name = "Jack"; const last_name = "Sparrow"; console.log(`Hello $(first_name) $(last_name)`);
За да научите повече за шаблонните литерали, посетете JavaScript Template Literal.
Деструктуриране на JavaScript
Синтаксисът за деструктуриране улеснява присвояването на стойности на нова променлива. Например,
// before you would do something like this const person = ( name: 'Sara', age: 25, gender: 'female' ) let name = person.name; let age = person.age; let gender = person.gender; console.log(name); // Sara console.log(age); // 25 console.log(gender); // female
Използвайки синтаксиса за деструктуриране на ES6 , горният код може да бъде написан като:
const person = ( name: 'Sara', age: 25, gender: 'female' ) let ( name, age, gender ) = person; console.log(name); // Sara console.log(age); // 25 console.log(gender); // female
За да научите повече за деструктурирането, посетете JavaScript Destructuring.
Внос и износ на JavaScript
Можете да експортирате функция или програма и да ги използвате в друга програма, като ги импортирате. Това помага да се направят компоненти за многократна употреба. Например, ако имате два JavaScript файла с имена contact.js и home.js.
В contact.js файл, можете да експортирате на contact()функцията:
// export export default function contact(name, age) ( console.log(`The name is $(name). And age is $(age).`); )
След това, когато искате да използвате contact()функцията в друг файл, можете просто да импортирате функцията. Например във файла home.js:
import contact from './contact.js'; contact('Sara', 25); // The name is Sara. And age is 25
Обещания на JavaScript
Обещанията се използват за обработка на асинхронни задачи. Например,
// returns a promise let countValue = new Promise(function (resolve, reject) ( reject('Promise rejected'); )); // executes when promise is resolved successfully countValue.then( function successValue(result) ( console.log(result); // Promise resolved ), )
За да научите повече за обещанията, посетете JavaScript Promises.
Оператор за почивка и разпространение на JavaScript
Можете да използвате параметъра rest за представяне на неопределен брой аргументи като масив. Например,
function show(a, b,… args) ( console.log(a); // one console.log(b); // two console.log(args); // ("three", "four", "five", "six") ) show('one', 'two', 'three', 'four', 'five', 'six')
Предавате останалите аргументи, като използвате … синтаксис. Следователно параметърът за име на почивка .
Използвате синтаксиса … за разпространение, за да копирате елементите в един масив. Например,
let arr1 = ('one', 'two'); let arr2 = (… arr1, 'three', 'four', 'five'); console.log(arr2); // ("one", "two", "three", "four", "five")
Както параметърът rest, така и операторът за разпространение използват един и същ синтаксис. Операторът за разпространение обаче се използва с масиви (итерируеми стойности).
За да научите повече за оператора за разпространение, посетете JavaScript Spread Operator.
