Подписаться на мой список адресов электронной почты сейчас в http://jauyeung.net/subscribe/
Следуй за мной в Твиттере в https://twitter.com/AuMayeung
Еще много статей в https://medium.com/@hohanga
Еще больше статей в http://thewebdev.info/
С 2015 года JavaScript значительно улучшился.
Сейчас использовать его гораздо приятнее, чем когда -либо.
В этой статье мы рассмотрим, как использовать модули JavaScript.
До ES6
ES5 или раньше не имеют нативной модульной системы.
Следовательно, существуют различные модульные системы, которые были созданы для решения проблемы организации кода.
Есть система модулей Commonhs, которая является стандартной ib node.js.
Он имеет компактный синтаксис и загружает модули синхронно и используется на стороне сервера.
Система модуля асинхронного модуля является еще одной популярной мобильной системой.
У него более сложный синтаксис, который позволяет им работать без eval или шаг компиляции.
Модули ES6
Модули ES6 создают формальную систему модулей, которая является стандартной для JavaScript.
Он имеет компактный синтаксис и позволяет нам делать отдельный экспорт.
Кроме того, он поддерживает циклические зависимости.
Существует прямая поддержка асинхронной загрузки, и загрузка настраивается.
Синтаксис даже более компактный, чем синтаксис модуля ES6.
И он поддерживает циклические зависимости.
Это лучше, чем обычные.
Стандартная система модуля имеет декларативный синтаксис для импорта и экспорта.
И он имеет программный API загрузчика для настройки того, как загружаются модули, и для условной загрузки модулей.
Названный экспорт
С названным экспортом мы можем экспортировать более одного члена модуля.
Например, мы можем написать:
Math.js
export const sqrt = Math.sqrt;
export function add(x, y) {
return x + y;
}
export function subtract(x, y) {
return x - y;
}
Чтобы создать модуль, который имеет несколько функций, экспортируемых с Экспорт ключевое слово.
Тогда мы можем импортировать предметы, написав:
import { add, subtract } from "./math";
const sum = add(1, 2);
const difference = subtract(1, 2);
Мы импортировали предметы из Math.js модуль.
Названные экспорты находятся в кудрявых брекетах.
Затем мы можем назвать функции, которые мы экспортировали под ним.
С Commonjs мы используем module.exports свойство для экспорта нескольких членов модуля.
Например, мы можем написать:
Math.js
const sqrt = Math.sqrt;
function add(x, y) {
return x + y;
}
function subtract(x, y) {
return x - y;
}
module.exports = {
sqrt,
add,
subtract
};
index.js
const { add, subtract } = require("./math");
const sum = add(1, 2);
const difference = subtract(1, 2);
Мы называем Требуется Требовать всего модуля, а затем мы уничтожили записи из импортированного модуля.
Тогда мы можем использовать импортированные функции так же.
Экспорт по умолчанию
Экспорт по умолчанию – это тип экспорта, который может произойти только один раз в любом модуле.
Мы можем назвать их все, когда им импортируем экспорт по умолчанию.
Например, мы можем написать:
Math.js
export default function add(x, y) {
return x + y;
}
экспортировать Добавить Функция как экспорт по умолчанию.
И тогда мы можем импортировать функцию, написав:
index.js
import add from "./math"; const sum = add(1, 2);
Чтобы экспортировать класс, мы можем написать:
Foo.js
export default class {}
Нам не нужен полуколон после заявления.
Тогда мы можем импортировать его:
import Foo from "./Foo"; const foo = new Foo();
Мы можем включить или исключить имя для экспорта по умолчанию.
Итак, мы можем написать:
`export` `default` `function` baz`() {}`
`export` `default` `class` `Bar` `{}`
или
`export` `default` `function() {}`
`export` `default` `class {}`
Вывод
Перед ES6 нет модульной системы, которая является стандартной для языка.
С тех пор JavaScript имеет нативную мобильную систему, которую мы можем использовать для стандартной организации нашего кода.
Пост Лучший из современного JavaScript – Основы модуля появился первым на Веб -разработчик Анкет
Оригинал: “https://dev.to/aumayeung/best-of-modern-javascript-module-basics-dkm”