Node.js
Node.JS с ES6

Вступление

Узел ES6 Поддержка и создание проекта с Babel

Вся спецификация ES6 еще не реализована полностью, поэтому вы сможете использовать только некоторые из новых функций. Вы можете увидеть список текущих поддерживаемых функций ES6 на странице http://node.green/

С NodeJS v6 была довольно хорошая поддержка. Поэтому, если вы используете NodeJS v6 или выше, вы можете пользоваться ES6. Тем не менее, вы также можете использовать некоторые из неизданных функций, а некоторые из-за пределов. Для этого вам нужно будет использовать транспилер

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

Babel позволяет использовать все функции из спецификации ES6 и некоторые дополнительные функции не в спецификации с «stage-0», например, import thing from 'thing вместо var thing = require('thing')

Если бы мы хотели создать проект, в котором мы использовали бы функции stage-0, такие как импорт, нам нужно было бы добавить Babel в качестве транспилятора. Вы увидите проекты с использованием реакции, а Vue и другие шаблоны на основе commonJS реализуют этап-0 довольно часто.

создать новый проект узла

mkdir my-es6-app
cd my-es6-app
npm init

Установите Babel на предустановку ES6 и этап-0

npm install --save-dev babel-preset-es2015 babel-preset-stage-2 babel-cli babel-register

Создайте новый файл с именем server.js и добавьте базовый HTTP-сервер.

import http from 'http'

http.createServer((req, res) => {
  res.writeHead(200, {'Content-Type': 'text/plain'})
  res.end('Hello World\n')
}).listen(3000, '127.0.0.1')

console.log('Server running at http://127.0.0.1:3000/')

Обратите внимание, что мы используем import http from 'http' -порт для import http from 'http' это функция stage-0, и если она работает, это означает, что мы правильно работаем с транспилером.

Если вы запустите node server.js он не сможет понять, как обрабатывать импорт.

Создание файла .babelrc в корневой директории вашего каталога и добавление следующих параметров

{
  "presets": ["es2015", "stage-2"],
  "plugins": []
}

теперь вы можете запустить сервер с node src/index.js --exec babel-node

Завершение работы - неплохо запустить транспилятор во время выполнения в производственном приложении. Однако мы можем внедрить некоторые скрипты в нашем пакете.json, чтобы упростить работу.

"scripts": {
    "start": "node dist/index.js",
    "dev": "babel-node src/index.js",
    "build": "babel src -d dist",
    "postinstall": "npm run build"
  },

Вышеупомянутое будет на npm install строить переданный код в каталог dist, чтобы npm start использовать перекодированный код для нашего производственного приложения.

npm run dev будет загружать сервер и время загрузки буфера, что отлично и предпочтительно при работе над проектом локально.

Идя дальше, вы можете установить nodemon npm install nodemon --save-dev чтобы следить за изменениями и перезагружать приложение узла.

Это действительно ускоряет работу с babel и NodeJS. В вас package.json просто обновите скрипт «dev», чтобы использовать nodemon

"dev": "nodemon src/index.js --exec babel-node",

Использовать JS es6 в приложении NodeJS

JS es6 (также известный как es2015) представляет собой набор новых функций для языка JS, цель которого заключается в том, чтобы сделать его более интуитивным при использовании ООП или при решении современных задач разработки.

Предпосылки:

1. Ознакомьтесь с новыми функциями es6 по адресу http://es6-features.org - он может вас разъяснить, если вы действительно собираетесь использовать его в своем следующем приложении NodeJS

2. Проверьте уровень совместимости версии вашего узла на странице http://node.green

3. Если все в порядке - давайте код!

Вот очень короткая выборка простого приложения hello world с JS es6

'use strict'

class Program
{
    constructor()
    {
        this.message = 'hello es6 :)';
    }

    print()
    {
        setTimeout(() =>
        {
            console.log(this.message);
            
            this.print();

        }, Math.random() * 1000);
    }
}

new Program().print();

Вы можете запустить эту программу и наблюдать, как она печатает одно и то же сообщение снова и снова.

Теперь .. пусть сломает его по строкам:

'use strict'

Эта строка действительно требуется, если вы собираетесь использовать js es6. strict режим, умышленно, имеет разную семантику из обычного кода (пожалуйста, прочитайте больше об этом на MDN - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode)

class Program

Невероятно - ключевое слово class ! Просто для быстрой справки - до es6 единственный способ определить класс в js был с ключевым словом ... function !

function MyClass() // class definition
{

}

var myClassObject = new MyClass(); // generating a new object with a type of MyClass

При использовании ООП класс является очень фундаментальной способностью, которая помогает разработчику представлять определенную часть системы (разрыв кода имеет решающее значение, когда код становится больше .. например: при написании кода на стороне сервера)

constructor()
{
    this.message = 'hello es6 :)';
}

Вы должны признать - это довольно интуитивно! Это c'tor моего класса - эта уникальная «функция» будет возникать каждый раз, когда объект создается из этого конкретного класса (в нашей программе - только один раз)

print()
{
    setTimeout(() => // this is an 'arrow' function
    {
        console.log(this.message);
        
        this.print(); // here we call the 'print' method from the class template itself (a recursion in this particular case)

    }, Math.random() * 1000);
}

Поскольку print определен в области класса - это фактически метод, который может быть вызван либо из объекта класса, либо из самого класса!

Итак .. до сих пор мы определили наш класс .. время его использовать:

new Program().print();

Что действительно равно:

var prog = new Program(); // define a new object of type 'Program'

prog.print(); // use the program to print itself

В заключение: JS es6 может упростить ваш код - сделать его более понятным и понятным (по сравнению с предыдущей версией JS) .. вы можете попытаться переписать существующий код и увидеть разницу для себя

НАСЛАЖДАТЬСЯ :)