7 полезни нововъведения в JavaScript (ECMAScript6) | Център за професионално обучение - Devise Expert

7 полезни нововъведения в JavaScript (ECMAScript6)

Автор: Дикран Хачикян

С последната спецификация  ECMAScript 6 или ES 6, в езика JavaScript са добавени много нови и полезни  възможности, най-интересните от които можете да прочетете в  тази статия.

Пълният код на примерите можете да свалите от профила ми в Github

 Декларация на променливи с let

let е ключовата дума, която заменя позната ни var за деклариране на променливи. За тези от вас, които не знаят, при var има проблеми свързани с видимостта на променливите (scope) и повторната им декларация като те са специфични за JavaScript и не се срещат в другите езици за програмиране, така че за програмисти, които са започнали да програмират на други езици и след това са преминали към JavaScript (повечето попадат в тази категория), проблемите могат лесно да останат незабелязани.

Ето един пример:

Ако се замени var с let това ще ограничи областта на видимост на b до блока на if т.е. последното извеждане на b ще предизвика ReferenceError:b is not defined.

По същият начин, при повторна декларация на променлива с var, това не се отчита като грешка,
но ако се замени var с let, резултатът ще бъде SyntaxError: Identifier ‘msg’ has already been declared.

 Декларация на константи

В JavaScript константите са най-обикновени променливи с подходящ префикс или суфикс в името (т.е. програмистите са се договорили, че това е константа – var const_path = ‘…’ или var path_const = ‘…’ ) и съответно пред промяната на стойнстта няма никакви пречки.
С новата спецификация може да използвате ключовата дума const, която предпазва от промени на стойността както е в другие езици.

Ако с const се декларира обектна променлива, то действието на const е малко по-различно. Стойностите на ключовете и самите ключове ще могат да се променят, добавят и изтриват, но на самата обектна променлива няма да могат да се присвояват нови стойности както е показано в следващият фрагмент:

Низ съдържащ променливи и изрази

Ако програмирате на PHP, то със сигурност вече знаете как изглежда това! Единственото условие е да оградите низa с апострофи ( ` `,  не с ‘  ‘ или “ „).

Функции с подразбиращи се параметри

В JavaScript няма ясна индикация (освен в документацията) за това кои параметри на функциите са задължителни и кои могат да бъдат пропуснати при извикването й и съответно, ако не се подаде стойност каква ще бъде стойността по подразбиране- нещо, което в редица други езици (C++, Python, PHP) съществува отдавна.

На параметрите, за които няма стойност при извикване на функцията, по подразбиране им се присвоява специалната стойнст undefined, която в тялото на фукцията може да се замени със стойност по подразбиране.

С въвеждането на параметри с подразбиращи се стойности в ES6, същият код изглежда доста по-ясен и е достатъчно да се погледне прототипа на функцията за да се видят възможните варианти за нейното извикване.

Функции генератори

Функциите генератори са една идея заимствана от Python. Идеята на тези функции е да връщат при всяко извикване следваща стойност изчислена във функцията или взета от масив, низ и др.
При декларирането им трябва да се постави * след function, а връщането на самата стойност става с yield.

Действието на yield е доста по-различно от оператора return, с който изпълнението на функцията приключва и съответно стойностите на i не биха се запазвали. Освен това, в примера е използван безкраен цикъл, но благодарение на yield това не е проблем за изпылнението на кода.

Ламбда изрази (arrow functions)

С ламбда изразите (името съм заимствал от езика Java) можете да превърнете декларацията на кратки функции в компактни и лесни за четене изрази.

Например, ако декларираме функция, която премахва интервалите от краищата и разбива текста по определен разделител като връша стойностите в масив, в най-простия си вид това може да изглежда така:

В ES6 съшата функция може да се замести с по-опростен и компактен синтаксис:

и дори с още по-опростен, ако в тялото има само return без други изрази:

Оператор … за масиви (spread operator)

При определени действия с масиви, операторът може да ви помогне да избегнете цикли и други неудобни начини за достъп до елементите.
Например, преди ES6:

Мисля, че този фрагмент дори няма нужда от коментар :). ES6 превръща това в нещо далеч по-елегантно:

Доста елегатно изглежда и копирането на данните от един масив в друг масив:

 

Ако искате да видите в детайли кой от браузерите в каква степен поддържа новия стандарт, можете да направите това тук.