JS ++ | Модули
Модули позволяют организовать код и разделить приложение на более мелкие части. Например, персональный компьютер можно разделить на «модули» клавиатуры, мыши и монитора, которые можно подключать отдельно.
В идеале, при модульном дизайне, мы хотим, чтобы наши модули можно было независимо использовать повторно. Клавиатуру PS / 2 можно подключить к любой машине, имеющей порт PS / 2, поскольку она не предназначена для отдельной машины. Точно так же в программном обеспечении ваша компания или организация может иметь несколько приложений, требующих аутентификации. Вместо того, чтобы многократно переписывать код входа и аутентификации для каждого отдельного приложения, вы можете захотеть предоставить функциональность аутентификации через один модуль.
Модули в JS ++ можно объявить с помощью ключевого слова module.
Создайте папку с именем «Калькулятор». В папке создайте файл с именем «Calculator.jspp» и добавьте следующий код:
модуль Калькулятор
{
int add (int a, int b) {
вернуть a + b;
}
int subtract (int a, int b) {
вернуть a - b;
}
}
Однако мы не можем просто выполнить код модуля в том же файле. JS ++ поощряет «модульный дизайн» и требует, чтобы ваши модули были отделены от основной логики программы.
Главный файл
«Главный файл» - это точка входа в приложение. Другими словами, вы говорите компилятору JS ++: «Мое приложение начинается здесь». JS ++ допускает только одну точку входа в приложение. Начнем с примера; создайте файл с именем main.jspp, который будет импортировать наш модуль «Калькулятор» со следующим кодом:
Калькулятор импорта;
внешний $;
int результат = Calculator.add (1, 1);
$ (". дисплей-результат"). текст (результат);
Здесь много чего происходит, так что давайте разберемся с этим. В предыдущих главах мы импортировали библиотеки JavaScript с помощью ключевого слова external. Мы по-прежнему импортируем jQuery (библиотеку JavaScript), используя ключевое слово external в приведенном выше коде. Однако для импорта библиотек JS ++ (определенных с помощью ключевого слова module) нам нужно использовать ключевое слово import. Это важное различие, потому что оно позволяет нам изолировать небезопасный код JavaScript.
Оператор import ожидает полное имя модуля. В нашем простом примере полное имя модуля - просто «Калькулятор». JS ++ знает, что оттуда делать.
Затем мы используем один из методов, определенных в модуле «Калькулятор»: метод «добавить». Мы просто складываем 1 + 1 и сохраняем результат в переменной result. Затем мы используем jQuery для отображения результата нашего расчета.
Создадим файл Calculator.html для отображения нашего результата:
<! DOCTYPE html>
<head>
<title> Калькулятор </title>
</head>
<body>
<div class = "display-result"> </div>
<script src = "http://code.jquery.com/jquery-1.12.4.min.js"> </script>
<script src = "app.jspp.js"> </script>
</body>
</html>
Обобщение как Calculator.jspp и main.jspp файлы. Для Windows это так же просто, как выбрать оба файла, щелкнуть один из файлов правой кнопкой мыши и выбрать «Скомпилировать с JS ++». Для Mac и Linux используйте следующую команду:
js ++ Calculator.jspp main.jspp
Файл app.jspp.js должен быть сгенерирован JS ++.
Порядок входных файлов не имеет значения. JS ++ автоматически определит порядок компиляции файлов.
Откройте index.html, и вы должны увидеть результат: 2.
Вложенные модули и частичная квалификация
В JS ++ мы можем объявлять вложенные модули для дальнейшей организации нашего кода. Есть два способа сделать это:
модуль MyApplication
{
модуль Калькулятор
{
// ...
}
}
или:
модуль MyApplication.Calculator
{
// ...
}
Давайте изменим Calculator.jspp так, чтобы модуль «Калькулятор» стал эксклюзивным для «Моего приложения» для организации нашего кода:
модуль MyApplication.Calculator
{
int add (int a, int b) {
вернуть a + b;
}
int subtract (int a, int b) {
вернуть a - b;
}
}
Теперь, когда мы изменили структуру нашего модуля, мы должны изменить наш оператор импорта main.jspp, чтобы отразить это. Однако мы собираемся добавить поворот, чтобы не печатать:
import MyApplication.Calculator;
внешний $;
int результат = добавить (1, 1);
$ (". дисплей-результат"). текст (результат);
Скомпилируйте файлы и откройте index.html в своем браузере. Вы должны заметить тот же результат: 2.
Вы заметили дополнительный поворот?
Вместо вызова Calculator.add мы просто вызывали функцию сложения через add. Все следующие способы правильного вызова функции 'add':
добавить (1, 1); Calculator.add (1, 1); MyApplication.Calculator.add (1, 1);
Первые две строки известны как «частичная квалификация». Третья и последняя строка известна как «полная квалификация». Полное имя - это «полный путь», а частично определенное имя - «относительный путь».
JS ++ позволяет использовать такие относительные пути через частично определенные имена, чтобы код оставался кратким. Однако чем больше вы уточняете имя, тем легче будет читать ваш код и следовать ему. Выбор стиля кода зависит от вас.