Как захватить мир, или javascript next уже сейчас

в 8:25, , рубрики: harmony, javascript, метки: ,

Доброго времени суток дорогой читатель. Я очень люблю все новое и красивое и поэтому очень часто посматриваю за развитием ecma 6 aka Harmony. Да-да, вы не ошиблись, речь пойдет именно о новом javascript, хотя он еще в разработке, но многие фичи уже сейчас можно начать тестировать, так сказать, просто для своего удовольствия.В помощь можно взять Firefox последней версии, но я нашел более другой способ для себя. Далее речь пойдет о новых возможностях javascript, что нас ждет и о slimerjs.Итак, что же такое slimerjs? Наверное стоит познакомиться с ним ближе, если мы хотим с ним работать. По сути slimerjs есть ни что иное что и phantomjs. Это скриптовый браузер для разработчика имеющий в своем арсенале движок эквивалентный последнему Firefox. Это означает, что мы имеем полную возможность использовать его, как REPL.Что же оставим теорию на будущее и рассмотрим как же работать со slimerjs. Так как я любитель Windows, и часто сталкиваюсь с трудностью настроек, но я не унываю. Все свои действия я буду описывать для Windows, по сути особого труда настроить под другую OS нет. И так поехали.Первым делом мы скачиваем slimerjs, распаковываем в папку, и прописываем системные переменные. В моем случае это была папка C:/Tools/slimerjs, добавляем это в переменную path. Также нам нужно установить переменную для Firefox, так как slimerjs требует Firefox, для запуска. Переменную SLIMERJSLAUNCHER в моем случае я установил так: C:Program Files (x86)Mozilla Firefoxfirefox.exe. Чтоже на этом наши магические манипуляции заканчиваются. Приступим к написанию кода, для проверки фич ecma 6.Первое, на что я обратил свое внимание это на короткую запись функции. Найдя в просторах интернета, довольно подробно описаное использования, я решил проверить это. И о чудо, изумлению не было предела. Есть несколько вариантов записи, я приведу все.

1) var square = function(x) { return x * x; }

2) var square2 = function(x) x * x;

3) var square3 = x => { return x * x };

4) var square4 = x => x * x;

5) var squareAndCube = x => [x * x, x * x * x];

Четвертый вариант знаком многим разработчикам работающим с C#, Scala, Typescript. Это есть не что иное как лямба оператор.Пятый вариант интересен собой, тем, что это еще и деструктивная операция. Давай-те проверим все эти типы записей. Для этого нам надо создать файл, пусть он будет иметь название ecma6-test-features.js и записать в него ф-ции описанные выше. Допишем к каждой функции console.log, и посмотрим результат запуском команды slimerjs ecma6-test-features.js. Поначалу нам откроется окошко, ясное дело, что оно нам будет мешать, но у него есть ряд назначений, о которых можно почитать в документации slimerjs. Для того чтобы избавится от нежелательного открытия окна, в конце нашего файла скрипта нужно дописать такой код slimer.exit(). Теперь мы имеем консоль похожую на nodejs, в которой мы можем выполнять свой код. Запустив наш скрипт, мы получим результат от всех выше написанных ф-ций. Такая запись ф-ций меня очень порадовала.Чтоже на очереди еще одна возможность в ecma6 — это list comprehensions. Что такое list comprehensions известно многим, тем кому нет, я в кратце объясню. Это такая синтаксическая конструкция, которая служит для создания списков применением операций над существующими списками. Чтоже рассмотрим пример, чтобы понять как это.

var list = [1,2,3,4,5];
var newList = [x * x for(x of list) if(x % 2 === 0)];

Итак, что же тут происходит? Первым выражением есть ф-ция, которая применяется к каждому элементу массива, эквивалент которой является map. Вторая запись является итератором, для прохода по элементам массива. Третья часть, которая содержит if? я вляется эквивалентом filter. С учетом того, что было сказано, плюс возможность короткой записи ф-ции, запишем этот кусок кода в более привычном виде.

var list = [1,2,3,4,5];
var newList = list.filter(x => x % 2 === 0).map(n => n * n);

Многим эта запись знакома. Да-да вы не ошиблись так можно писать в C#, Typescript И в других современных языках. Красиво не так-ли?На этом, пока все, далее я хотел рассказать и показать (потом выложить исходники всех тестов) остальные возможности работы с ecma6 уже сейчас.Это моя первая статья. У меня было много идей, что написать, но я решил начать с этогоБуду рад услышать замечания и пожелание, для дальнейшего совершенствования себя как писателя статей.С уважением ко всем. До новых встреч.

Автор: xGromMx

Источник

* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js