Какое отличие java от javascript

Java и JavaScript в чем разница

Названия этих двух языков созвучны. Многие думают, что это абсолютно одинаковые языки, которые просто используются для разных ситуаций. Но это далеко не так. Они предназначены для разных целей.

Оба языка используются не только в простых приложениях и сайтах, но и сложных проектах, где необходимо делать очень точные вычисления. Безопасность и гибкость этих языков позволяют им выполнять задачи любой сложности.

Узнайте, в чем различие двух языков, для чего каждый из них используется и в каких сферах применяется.

Получи грант, покрывающий 50% стоимости обучения
И обучайся новой профессии онлайн из любой точки мира
Получить грант

Java

Язык программирования Java был создан в 1995 году. Несмотря на то, что многие языковые части Java позаимствовал у C и C++, он продвигал другую идею — создать легкое и безопасное программирование.

Работа языка Java строится на едином написании кода, который будет работать в любых условиях. Вместо компиляции файлов под разные платформы в языке создавался файл с расширением JAR.

Где применяется Java:

• В написании приложений для Android. Он является официальным языком этой операционной системы. Изначально создатели не знали, какой язык использовать для работы новой ОС, и выбор пал на него. Это связано с его возможностью компилировать все в один файл, что помогает экономить память.
• В desktop-приложениях. Язык является инструментом для создания кроссплатформенного программного обеспечения.
• В системах расчетов. Java зарекомендовал себя как надежный и простой в применении язык, который быстро выполняет поставленные перед ним задачи. Его используют на больших предприятиях, в банковской работе, сметном деле, торговле, финансовых расчетах.
• В гаджетах. Язык используется в популярных смарт-часах, небольших контроллерах и датчиках. В странах СНГ и Европе его даже применяют для управления светофорами. В системе гибридных автомобилей он также зарекомендовал себя как надежный помощник.
• В области науки. Java используется при исследованиях, управлении сложными задачами и для помощи в контроле над искусственным интеллектом.

JavaScript

Как и Java, язык был создан в 1995 году. Он был разработан за 10 дней компанией Netscape Communications.

Сначала язык назывался LiveScript, но потом был дополнен компонентами от Java, и его переименовали в JavaScript, коротко — JS. На этих моментах сходства между двумя языками заканчиваются.

В отличие от Java, этот язык быстро завоевал популярность. Связано это с тем, что уже тогда интернет входил в повседневный обиход, и многие люди начинали заводить сайты. JavaScript наравне с HTML и CSS стал основным языком для создания сайтов.

Если в Java код компилируется, то в JS он интерпретируется. Это значит, что во время посещения сайта браузер получает код и начинает сразу его выполнять. Это позволяет пользователю получать моментальный результат.

За 25 лет JavaScript занял место самого гибкого языка программирования, который нашел применение в различных сферах:

• Веб-приложения. Язык используется для Frontend-разработки – действий со стороны браузера. Примеры: создание анимаций, обновлений, вставки данных и другое. А также для Backend-разработки – действий со стороны сервера. Примеры: взаимодействие с базой данных, обработка данных, маршрутизация и другое.
• Приложения для мобильных устройств. JavaScript с использованием инструментов React Native и PhoneGap позволяет создавать полноценные приложения, которые стабильно работают на устройствах. Фреймворки делятся на 2 типа: транслирующие JS в свой код и использующие движок JS.
• Настольные программы. С помощью фреймворков Electron и NE.js язык вытаскивается из онлайн-пространства. Движок программы упаковывается в исполняемый файл. В открывающемся окне исполняются CSS, JS, HTML.

87% наших выпускников уже работают в IT
Оставь заявку, и мы поможем с выбором новой профессии
Оставить заявку

Отличия

Выделим основные отличия языков:

1. Java – это язык программирования, использующийся для написания приложений. JavaScript – это язык сценариев, который используется для создания интерфейсов.
2. В Java наследование делается с помощью классов. В JavaScript происходит иерархическое наследование.
3. JavaScript применяется для внешней работы веб-сайтов, тогда как Java используется во внутренней.

Языки кардинально отличаются и выполняют разные задачи. Java подходит для написания приложений не только для персональных компьютеров, но и для операционной системы Android. JavaScript используется в создании сайтов. Его гибкость позволяет синхронизироваться с другими языками и создавать сайты, которые могут выполнять задачи любой сложности.

Вопрос – Ответ

• Что называется наследованием в Java?
  Под этим словом понимается, что один класс может наследовать другой. Это дает возможность повторно использовать код класса, от которого идет наследование.
• Можно ли вставить Java-приложение на сайт?
  Конечно! Для этого на устройстве необходимо иметь спецификацию Servlet API.
• Существуют редакторы Java-кода для Android-устройств?
  Да. Такие редакторы весят мало и позволяют не только делать редактирование, но и писать программы.

Подведем итоги статьи. Мы рассмотрели следующее:

• что такое Java
• что такое JavaScript
• их отличия.

Начни обучение сегодня
FrontEnd разработчик

Профессия Frontend-разработчик — лидер по количеству запросов от работодателей. Без этого специалиста не может обойтись ни одна современная компания, у которой есть сайт. Хотите стать Frontend-разработчиком и создавать сайты, интернет-магазины, маркетплейсы и прочее? Записывайтесь на наш курс!

QA Automation Engineer

QA Automation Engineer — это специалист, который обеспечивает качество продукта и контролирует все этапы разработки с момента появления идеи до релиза. Он имеет компетенции и тестировщика, и разработчика. Он участвует во всех процессах разработки: от подготовки стандартов и требований до самой разработки продукта. А также владеет ручным тестированием и пишет скрипты для автоматизации этого процесса, докладывает о проблемах и контролирует их исправление.

Project Manager

Project Manager — специалист, без которого не может обойтись ни один IT-проект. Если вы хотите войти в сферу IT-технологий, но учить языки программирования это не для вас, тогда профессия Project Manager — то, что вам нужно! Запишитесь на курс Project Management и начните свой путь в IT!

Популярное

10 задачек, которые дают на собеседованиях в IT-компании

8 главных качеств программиста: что говорят работодатели

Frontend разработчик: главные навыки

Что лучше изучать: Java или JavaScript

Некоторые начинающие программисты думают, что Java и JavaScript очень похожи, и если выучить какой-то один из этих языков, то потом без проблем можно будет кодить на другом.

Но по факту это не так: несмотря на то, что Java и JavaScript имеют похожие названия, эти языки программирования мало что объединяет, так как их используют для разных целей. Разберемся, что это за языки и чем они отличаются друг от друга.

Java

Java — это язык программирования общего назначения. Инженеры создавали его для программирования бытовой техники, но позже выяснили, что Java слишком продвинут для этого. Сейчас его используют для разработки:

• Серверных приложений
• Веб-приложений
• Игр
• Программ для работы с Big Data

Кроме того, Java используют для создания и обслуживания сложных банковских систем, трейдинговых приложений и программных средств. Код на Java пишут в таких известных компаниях как Google, Netflix и Amazon.

Главная особенность Java в том, что написанное на нем приложение можно открыть на любом устройстве. Это возможно благодаря виртуальной машине Java (JVM) — программе, которая компилирует, то есть переводит код, понятный человеку, в код, близкий к машинному (байт-код).

Java унаследовал многое от языков C, в том числе синтаксис, но также продвигал принцип безопасного программирования. Это значит, что разработчики, у которых нет доступа к коду, не могут его изменить — ведь он выполняется виртуальной машиной, пресекающей любые несанкционированные операции.

JavaScript

JavaScript (JS) — это многофункциональный язык программирования. Разработчики создали его для повышения интерактивности страниц веб-приложений, и сделали это всего за 10 дней, предвидя скорое развитие динамического функционального веба. На синтаксис JS сильно повлияли языки C и Java, а благодаря популярности последнего появилось название JavaScript.

Теперь с помощью JS можно не только создавать динамические интерфейсы, но и работать с операционными системами и базами данных благодаря Node.js.

JavaScript используют для разработки и обслуживания:

• Мобильных приложений
• Десктопных приложений
• DevOps
• Баз данных

Чем отличаются Java и JavaScript

1. Java — компилируемый язык программирования. Это значит, что перед запуском приложения его исходный код нужно преобразовывать в машинный. JavaScript — интерпретируемый язык, для воспроизведения программы на нем машинный код не нужен.
2. Java — язык строго типизированный. Это значит, что он не позволяет смешивать в коде различные типы данных и не выполняет автоматические неявные преобразования. Например, в Java не получится вычесть из строки множество. JavaScript — язык с динамической типизацией. Это значит, что он ищет ошибки на стадии выполнения кода. Также в JS ‌можно‌ ‌задать‌ ‌разные‌ ‌типы‌ ‌для‌ ‌одной‌ ‌переменной.‌
3. Java в большей степени ориентирован на разработку бэкенд-приложений, JavaScript — фронтенд-приложений.

Что проще: Java или JavaScript

Язык Java — фундаментальный и углубленный, практически все глобальные системы написаны на нем. За все время его существования у разработчиков накопились огромные базы знаний, появилось большое количество фреймворков, с которыми необходимо работать каждому джависту. Это несомненный плюс для опытных программистов, но разобраться в обилии информации новичкам бывает непросто.

Для упрощения программирования на Java нужно установить специализированные редакторы, например, Eclipse или IntelliJ IDEA. Также для разработки программисты используют Java SE Development Kit — набор библиотек, различных утилит и компилятор Java.

Среди разработчиков популярно мнение, что JavaScript — это легкий язык для старта в программировании. Во многом это действительно так: у JS несложный синтаксис, понятный и ненагруженный код. Условную задачу на Java можно решить в пяти строках кода, а на JavaScript — в одной.

Пример кода на Java:

class HelloWorld  public static void main(String[] args)  System.*out*.println("Hello, World!"); > > 

Код на JS в одну строку выполняет ту же функцию:

console.log('Hello, World!') 

Для работы на JS вам не нужно устанавливать дополнительное ПО — кодить на JavaScript можно и в простом «Блокноте». Результат работы кода можно увидеть в любом современном браузере, так как все нужные инструменты для интерпретации JavaScript уже встроены в Chrome, Opera, Mozilla Firefox и другие.

Однозначно нельзя сказать, какой язык легче: у каждого есть свои нюансы. Однако какой язык вы бы ни выбрали для изучения, найти ответы ответы на вопросы по Java и JavaScript будет несложно благодаря огромной базе знаний и комьюнити разработчиков. Кстати, у Хекслета тоже есть свое комьюнити в Telegram — присоединяйтесь, чтобы находить единомышленников и изучать программирование вместе.

Читайте также: С чего начать изучение JavaScript и как это делать эффективно

Java или JavaScript: что более востребовано

Какой язык популярнее

Существует несколько рейтингов и исследований, которые вычисляют индекс популярности языков программирования.

Исследование Stack Overflow за 2022 год показывает , что 67% опытных программистов пишут свой код на JavaScript, и 33% — на Java. Также программирование на JS выбирают почти 60% начинающих специалистов, а на Java — почти 39%.

Данные индекса TIOBE на октябрь 2022 года показывают другую картину: Java занимает третье место по популярности среди других языков программирования, а JavaScript — седьмое.

По данным индекса PYPL на октябрь 2022 года, Java располагается на втором месте по популярности среди других языков программирования, а JavaScript — на третьем.

Несмотря на то, что данные перечисленных рейтингов разнятся, можно точно сказать, что Java и JS входят в десятку самых популярных языков программирования, а значит, они востребованы.

Сколько зарабатывают разработчики на Java и JavaScript

По данным Хабр Карьеры, медианная зарплата Java-разработчиков в первом полугодии 2022 года составила 180 000 рублей, а JavaScript-разработчиков — 150 000 рублей. По диаграмме заметно, что зарплата Java-программистов выросла по сравнению с данными второго полугодия 2021 года, а гонорар JS-программистов остался неизменным:

По данным этого же исследования Хабр Карьеры, медианная зарплата программистов на Java и JavaScript выше медианной зарплаты на всем IT-рынке — последняя составляет 140 000 рублей.

Java и Javascript: что лучше выбрать

Выбирая, что учить, Java или JavaScript, помните: лучшего варианта не существует, так как один язык не может идеально подходить под все ваши задачи. Для начала решите, что вы хотите разрабатывать, а потом уже смотрите, какой язык больше подходит для ваших целей.

Если обобщать, то для мобильной разработки и разработки серверных приложений больше всего подойдет Java. Если вам по душе фронтенд-разработка, создание и доработка сайтов, то выбирайте JavaScript.

Советуем не зацикливаться на выборе одного языка: изучайте тот, который вам интересен сейчас. Если вы поймете, как работают алгоритмы и функционируют системы, то сможете без проблем выучить другой язык в будущем. Главное — больше практикуйтесь, и у вас все получится.

Никогда не останавливайтесь: В программировании говорят, что нужно постоянно учиться даже для того, чтобы просто находиться на месте. Развивайтесь с нами — на Хекслете есть сотни курсов по разработке на разных языках и технологиях.

Разница между Java и JavaScript

Узнайте разницу между Java и JavaScript: история, назначение, синтаксис, среда выполнения и подход к ООП.

Алексей Кодов
Автор статьи
9 июня 2023 в 16:31

Java и JavaScript — два популярных языка программирования, которые часто вызывают путаницу у новичков из-за своего названия. Однако, на самом деле, они имеют довольно существенные различия. В этой статье мы рассмотрим основные различия между Java и JavaScript. ��

История и назначение

Java был создан в 1995 году компанией Sun Microsystems (теперь принадлежит Oracle). Java — это мощный, объектно-ориентированный язык программирования, который был разработан для создания надежных и масштабируемых приложений. Java используется в различных областях, таких как разработка серверных приложений, мобильных приложений (Android), встроенных систем и многих других.

JavaScript, с другой стороны, был создан в 1995 году компанией Netscape для того, чтобы сделать веб-страницы более интерактивными. JavaScript — это легковесный, интерпретируемый язык программирования, который применяется в основном на веб-страницах для обработки событий, валидации форм и создания динамического контента.

Java-разработчик: новая работа через 11 месяцев
Получится, даже если у вас нет опыта в IT

Синтаксис и структура

Java и JavaScript имеют разный синтаксис. Java основан на языке C++, в то время как JavaScript основан на языке ECMAScript. Вот некоторые отличия в синтаксисе:

• В Java все переменные и методы должны объявляться внутри класса, в то время как в JavaScript это необязательно.
• Java требует, чтобы все переменные были явно типизированы, в то время как JavaScript является языком со слабой типизацией, что позволяет использовать одну и ту же переменную для хранения разных типов данных.

Пример кода на Java:

public class HelloWorld < public static void main(String[] args) < System.out.println("Hello, World!"); >>

Пример кода на JavaScript:

console.log("Hello, World!");

Среда выполнения

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

JavaScript обычно исполняется в браузере, что позволяет взаимодействовать с HTML и CSS на веб-странице. Однако, с появлением Node.js, JavaScript стал доступен и для серверной разработки.

Объектно-ориентированное программирование

Хотя оба языка поддерживают объектно-ориентированное программирование (ООП), их подход к ООП различается. Java использует классический подход к ООП с наследованием на основе классов, в то время как JavaScript использует прототипное наследование, что позволяет создавать объекты без определения класса.

Заключение

Java и JavaScript — разные языки программирования, имеющие различное назначение, синтаксис, среду выполнения и подход к объектно-ориентированному программированию. Java — более мощный и строгий язык программирования, который подходит для создания крупных и сложных приложений. JavaScript — легковесный и гибкий язык программирования, который в основном используется для создания интерактивных элементов на веб-страницах.

�� Если вы хотите углубить свои знания в Java-разработке и стать профессиональным разработчиком, рекомендую вам посетить эту онлайн-школу

JavaScript, Java, какая теперь разница?

На прошлом JPoint пообещал написать статью про использование GraalVM для смешивания Java и JS. Вот она.

В чем проблема? В повседневной практике часто встречаются приложения, состоящие из двух частей: JavaScript-фронтенд и Java-бэкенд. Организация интеропа между ними требует усилий. Как правило, делают их люди с разных сторон баррикад, и при попытке залезть в чужую область они начинают страдать. Еще есть фуллстек веб-разработчики, но про них всё понятно: они должны страдать всегда.

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

Если кто-то из джавистов еще не писал на React, то здесь будет туториал, позволяющий это сделать. Если кто-то из джаваскриптеров не пробовал писать на Java, то в этом же туториале получится к ней прикоснуться (правда, всего одной строчкой и сквозь JS-биндинги).

JS->Java. Тряхнем стариной: Nashorn

Если хочется интероп Java->JS, такая технология в JDK давным-давно была, и называется она Nashorn (читается: «Насхорн»).

Давайте возьмем какую-нибудь реальную ситуацию. Люди из раза в раз, из года в год, продолжают писать «серверные» валидаторы на Java и «клиентские» валидаторы на JS. Особый цинизм тут в том, что проверки зачастую совпадают на 80%, и вся эта активность, по сути, — особая форма бездарно потерянного времени.

Представим, что у нас есть очень тупой валидатор:

var validate = function(target) < if (target >0) < return "success"; >else < return "fail"; >>;

Запустить мы его можем на всех трех платформах:

В браузере это тривиально. Просто встраиваем этот кусок кода куда угодно, и оно работает.

В Node.js надо либо уважать их феншуй по использованию require, либо хакнуть его к чертям вот таким простым кодом:

var fs = require('fs'); var vm = require('vm'); var includeInThisContext = function(path) < var code = fs.readFileSync(path); vm.runInThisContext(code, path); >.bind(this); includeInThisContext(__dirname + "/" + filename);

Готовый пример есть у меня на GitHub.

Готовьтесь к тому, что если вы пользуетесь такими приемами, то довольно скоро коллеги могут начать считать вас чучелом. Нам, джавистам — не привыкать, а вот профессиональные джаваскриптеры могут и оконфузиться.

Теперь долбанем всё то же самое, но под Насхорном в Java.

public class JSExecutor < private static final Logger logger = LoggerFactory.getLogger(JSExecutor.class); ScriptEngine engine = new ScriptEngineManager().getEngineByName("nashorn"); Invocable invoker = (Invocable) engine; public JSExecutor() < try < File bootstrapFile = new ClassPathResource("validator.js").getFile(); String bootstrapString = new String(Files.readAllBytes(bootstrapFile.toPath())); engine.eval(bootstrapString); >catch (Exception e) < logger.error("Can't load bootstrap JS!", e); >> public Object execute(String code) < Object result = null; try < result = engine.eval(code); >catch (Exception e) < logger.error("Can't run JS!", e); >return result; > public Object executeFunction(String name, Object. args) < Object result = null; try < result = invoker.invokeFunction(name, args); >catch (Exception e) < logger.error("Can't run JS!", e); >return result; > >

Как видите, можно дернуть как произвольный код, так и отдельную функцию по ее имени.

Есть, конечно, такие проблемы, которые можно решить только в ручном порядке. Например, можно состряпать полифилл типа такого:

var global = this; var window = this; var process = >; var console = <>; console.debug = print; console.log = print; console.warn = print; console.error = print;

Если хочется, чтобы код валидатора был идеально идентичным и на сервере, и на клиенте, придется для «серверных» методов написать заглушки, которые подпихиваются только в браузер. Это уже детали конкретной реализации.

Кстати, ab на моем ноутбуке ( ab -k -c 10 -n 100 http://localhost:3000/?id=2 ) на такой код показывает 6-7 тысяч запросов в секунду, и не важно, на чем он запущен — на Nashorn или Node.js. Но в этом ничего интересного: во-первых, ab на локалхосте измеряет погоду на Марсе, во-вторых, мы и так верим, что явных ляпов в этих движках нет, они конкуренты.

Понятно, что, если вы живете в «красной зоне» кривой имени Ш., использовать Nashorn без включения мозга и написания бенчмарков нельзя. Если хорошенько подумать, можно написать такой бенчмарк, где Насхорн будет проседать, и правильней будет написать нативный код. Но надо четко понимать, что мир не ограничивается хайлоадом и перформансными темами, иногда удобство написания важней любого перформанса.

Java->JS. Проблема

Попробуем пропихнуть данные в обратном направлении, из Java в JS.

Зачем это может быть нужно?

Во-первых, что самое главное, во многих компаниях существует необсуждаемая аксиома: мы используем Java. В каких-нибудь банках. Во-вторых, по ходу решения повседневных проблем такие задачи возникают постоянно.

Рассмотрим игрушечный случай из реальной жизни. Представьте: нужно сгенерить фронт вебпаком, и хочется вписать в правый верхний угол веб-странички текущую версию приложения. Вполне вероятно, что версию бэкенда можно нормальным способом вытащить только вызвав какой-то джавовый код (легаси же). Значит, нужно создать такой Maven-проект, который будет работать в два прохода: прибить к какой-нибудь фазе Maven Build Lifecycle сборку пары классов и их запуск, которые сгенерят properties-файл с номером версии, который на следующей фазе подхватит вручную вызванный npm.

Приводить пример такого pom.xml я здесь не буду, потому что это мерзко 🙂

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

• Разработчики хотят использовать тот язык, который более всего подходит к решаемой задаче. Очень больно писать на Java веб-интерфейс (по крайней мере до тех пор, пока JVM и OpenJDK не стабилизируются на WebAssembly), а на JS он делается просто и удобно.
• Часто хочется параллельно развивать несколько кодовых баз. Например, есть одна база на JS — фронт, и другая база на Java — бэк. Хочется развивать проекты, потихоньку переписывая всё приложение на Node.JS, включая серверный код — в тех местах, где Java не нужна по смыслу. Не должно быть «дня номер ноль», когда весь Java-бэкенд или JS-фронтенд отправляется на свалку, и пусть весь мир подождет, пока мы напишем новый.
• При пересечении границы языка приходится вручную писать множество мусорного кода, обеспечивающего интероп.

Иногда есть готовые решения — например, переход границы Java/С делается с помощью JNI.

Использование такой интеграции еще и тем хорошо, что, как любят говорить программисты-функционалы, «не сломается то, чего нет». Если мы в своем коде поддерживаем адовейшие pom.xml, properties и xml-файлы и другой ручной интероп, то они имеют свойство ломаться в самых неприятных моментах. Если же эту прослойку написали какие-нибудь реальные боевые ботаны, типа Oracle или Microsoft, оно почти не ломается, а когда ломается — чинить это не нам.

Возвращаясь к предыдущему примеру: зачем нам вставать два раза и делать чудеса с Насхорном, если можно не вставать вообще и писать весь UI только на Ноде?

Но как это сделать, учитывая, что нужно прозрачно посасывать данные из Java?

Первая мысль, которая приходит в голову — продолжать использовать Nashorn. Засосать в него все нужные библиотеки, подпилить напильником, и, может быть, они даже запустятся. Если среди них не будет таких, которым нужны нативные расширения. И вручную сэмулировать всю инфраструктуру Ноды. И еще что-то. Кажется, это проблема. Вообще, такой проект уже был, назывался Project Avatar, и, к сожалению, он загнулся. Если разработчики из Oracle не смогли его довести до конца, то какой шанс, что получится сделать это самостоятельно?

Java->JS. Graal

К счастью, у нас есть еще один довольно новый и интересный проект — Graal.js. То есть часть Graal, ответственная за запуск JavaScript.

Инновационные проекты из мира JDK зачастую воспринимаются чем-то далеким и нереальным. Graal в этом плане отличается — очень внезапно он вышел на сцену как зрелый конкурент.

Graal — это не часть OpenJDK, а отдельный продукт. Он известен тем, что в свежих версиях OpenJDK можно переключить JIT-компилятор из C2 на тот, что идет в составе Graal. Кроме того, в составе Graal поставляется фреймворк Truffle, с помощью которого можно реализовывать разные новые языки. В данном случае разработчики из Oracle Labs реализовали поддержку JavaScript.

Чтобы прочувствовать, насколько это просто и удобно, давайте рассмотрим игрушечный проект-пример.

Представим, что мы делаем рубку НЛО на Хабре.

В первой версии Рубки, НЛО сможет банить рандомных людей, и кнопка будет называться «Забанить кого-нибудь!». Во второй версии кнопка будет банить или троллей, или спамеров, и кого именно мы сейчас баним — будет подгружаться из Java. В целях минимализации примера меняться будет только надпись на кнопке, бизнес-логику прокидывать не будем.

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

Часть 1. Заготовка приложения

1. Качаем «энтерпрайзную» GraalVM (по ссылке) и прописываем обычные для Java переменные окружения.

Энтерпрайзная версия нужна потому, что только в ней есть GraalJS.

Можно, например, в .bash_profile записать вот такое:

graalvm () < export LABSJDK=/Users/olegchir/opt/graalvm-0.33/Contents/Home export LABSJRE=/Users/olegchir/opt/graalvm-0.33/Contents/Home/jre export JDK_HOME=$LABSJDK export JRE_HOME=$LABSJRE export JAVA_HOME=$JDK_HOME export PATH=$JDK_HOME/bin:$JRE_HOME/bin:$PATH >

И потом после перезагрузки шелла вызвать эту функцию: graalvm .

Почему я предлагаю сделать отдельную баш-функцию и вызывать ее по мере необходимости, а не сразу? Тут всё очень просто: после того, как GraalVM попадет в PATH, ваш нормальный системный npm (например, /usr/local/bin/npm в macOS) будет подменён нашей особой джавовой версией ( $JDK_HOME/bin/npm ). Если вы JS-разработчик, такая подмена на постоянку — не самая лучшая идея.

2. Делаем директорию для проекта

mkdir -p ~/git/habrotest cd ~/git/habrotest

3. npm init (заполнить с умом, но можно и просто прощелкать кнопку enter)

4. Устанавливаем нужные модули: Webpack, Babel, React

npm i --save-dev webpack webpack-cli webpack-dev-server npm i --save-dev babel-core babel-loader babel-preset-es2015 babel-preset-react npm i --save react react-dom

Заметьте, что npm может оказаться слегка устаревшей версии (относительно «настоящего») и попросит обновиться. Обновляться не стоит.

5. Создаем директории, в которых будет происходить работа:

mkdir -p src/client/app mkdir -p src/client/public mkdir -p loaders

6. Учим Babel нашим языкам:

7. Настраиваем вебпак:

var p = require('path'); var webpack = require('webpack'); var BUILD_DIR = p.resolve(__dirname, 'src/client/public'); var APP_DIR = p.resolve(__dirname, 'src/client/app'); var config = < output: < path: BUILD_DIR, filename: 'bundle.js' >, entry: APP_DIR + '/index.jsx', module : < rules : [ < test : /\.jsx?/, include : APP_DIR, loader : 'babel-loader' >] > >; module.exports = config;

8. Создаем страничку для нашего приложения:

9. Создаем индекс (чтобы потом пихать в него демонстрационный компонент):

import React from 'react'; import from 'react-dom'; import NLOComponent from './NLOComponent.jsx'; class App extends React.Component < render () < return ( 
Добро пожаловать в рубку, НЛО
 
 ); > > render(, document.getElementById('app'));

10. Создаем компонент!

import React from 'react'; class NLOComponent extends React.Component < constructor(props) < super(props); this.state = ; this.onBan = this.onBan.bind(this); > onBan () < let newBanned = this.state.banned + 10; this.setState(); > render() < return (
Количество забаненных : 
>Забанить кого-нибудь!
 
 ); > > export default NLOComponent;

11. Запускаем сборку: webpack -d

Всё должно успешно собраться и вывести нечто вроде:

joker:habrotest olegchir$ webpack -d Hash: b19d6529d6e3f70baba6 Version: webpack 4.5.0 Time: 19358ms Built at: 2018-04-16 05:12:49 Asset Size Chunks Chunk Names bundle.js 1.69 MiB main [emitted] main Entrypoint main = bundle.js [./src/client/app/NLOComponent.jsx] 3.03 KiB [built] [./src/client/app/index.jsx] 2.61 KiB [built] + 21 hidden modules

12. Теперь можно открыть в браузере ./src/client/index.html и насладиться следующим видом:

Первая часть туториала пройдена, теперь нужно научиться менять надпись на кнопке.

Часть 2. Подсовываем переменные

13. Попробуем внедрить в наш компонент переменную «название кнопки» ( buttonCaption ) и «список вариантов» ( buttonVariants ), о которых ничего не известно в JS. В дальнейшем они будут подтягиваться из Java, но сейчас просто проверяем, что их использование приводит к ошибке:

import React from 'react'; class NLOComponent extends React.Component < constructor(props) < super(props); this.state = ; this.onBan = this.onBan.bind(this); > onBan () < let newBanned = this.state.banned + 10; this.setState(); > render() < return (
Количество забаненных : 
>
 
 ); > > export default NLOComponent;

Наблюдаем честную ошибку:

NLOComponent.jsx?8e83:7 Uncaught ReferenceError: buttonCaption is not defined at new NLOComponent (NLOComponent.jsx?8e83:7) at constructClassInstance (react-dom.development.js?61bb:6789) at updateClassComponent (react-dom.development.js?61bb:8324) at beginWork (react-dom.development.js?61bb:8966) at performUnitOfWork (react-dom.development.js?61bb:11798) at workLoop (react-dom.development.js?61bb:11827) at HTMLUnknownElement.callCallback (react-dom.development.js?61bb:104) at Object.invokeGuardedCallbackDev (react-dom.development.js?61bb:142) at invokeGuardedCallback (react-dom.development.js?61bb:191) at replayUnitOfWork (react-dom.development.js?61bb:11302) (anonymous) @ bundle.js:72 react-dom.development.js?61bb:9627 The above error occurred in the component: in NLOComponent (created by App) in div (created by App) in App

14. Теперь давайте познакомимся с легальным способом подсовывать переменные в Вебпаке. Это лоадеры.

Во-первых, нужно немного переписать конфиг вебпака, чтобы удобно грузить кастомные лоадеры:

var p = require('path'); var webpack = require('webpack'); var BUILD_DIR = p.resolve(__dirname, 'src/client/public'); var APP_DIR = p.resolve(__dirname, 'src/client/app'); let defaults = < output: < path: BUILD_DIR, filename: 'bundle.js' >, entry: APP_DIR + '/index.jsx', module : < rules : [ < test : /\.jsx?/, include : APP_DIR, loader : 'babel-loader' >] >, resolveLoader: < modules: ['node_modules', p.resolve(__dirname, 'loaders')] >>; module.exports = function (content) < let dd = defaults; dd.module.rules.push(< test : /index\.jsx/, loader: "preload", options: <>>); return dd; >;

(Заметьте, что в options лоадеру можно подсунуть любые данные и потом считать с помощью loaderUtils.getOptions(this) из модуля loader-utils )

Ну и теперь, собственно, пишем лоадер. Лоадер устроен тупо: на вход в параметр source нам приходит изначальный код, мы его изменяем по своему желанию (можем и не изменять) и потом возвращаем назад.

const loaderUtils = require("loader-utils"), schemaUtils = require("schema-utils"); module.exports = function main(source) < this.cacheable(); console.log("applying loader"); var initial = "Забанить тролля!"; var variants = JSON.stringify(["Забанить тролля!", "Забанить спамера!"]); return `window.buttonCaption=\"$\";` + `window.buttonVariants=$;` + `$`; >;

Выполняем пересборку с помощью webpack -d .

Всё отлично работает, нет никаких ошибок.

Часть 3. Добавляем Java-код

15. Теперь вы спросите: хорошо, мы выучили один маленький грязный хак Вебпака, но при чем здесь Java?

Интересно здесь то, что наш лоадер выполняется не просто так, а под Граалем. Значит, можно с помощью API, похожего на Nashorn’овский, работать из JS с джавовыми типами.

const loaderUtils = require("loader-utils"), schemaUtils = require("schema-utils"); module.exports = function main(source) < this.cacheable(); console.log("applying loader"); //Мы можем получать джавовые типы и содзавать объекты этого типа var JavaString = Java.type("java.lang.String"); var initial = new JavaString("Забанить тролля!"); //Мы можем конвертить данные туда, сюда, и обратно var jsVariants = ["Забанить тролля!", "Забанить спамера!"]; var javaVariants = Java.to(jsVariants, "java.lang.String[]"); var variants = JSON.stringify(javaVariants); //Но интероп не всегда хорош, и тогда приходится городить костыли return `window.buttonCaption=\"$\";` + `window.buttonVariants=$;` + `$`; >;

Ну и конечно, webpack -d .

16. При попытке собрать вебпаком видим ошибку:

ERROR in ./src/client/app/index.jsx Module build failed: ReferenceError: Java is not defined at Object.main (/Users/olegchir/git/habrotest/loaders/preload.js:9:19)

Она возникает потому, что джавовые типы недоступны по умолчанию и включаются специальным флагом —jvm , который имеется только в GraalJS, но не в «обычной» Ноде.

Поэтому собирать надо специальной командой:

node —jvm node_modules/.bin/webpack -d

Так как набирать всё это достаточно муторно, я использую алиас в баше. Например, в .bash_profile можно вставить следующую строчку:

alias graal_webpack_build="node --jvm node_modules/.bin/webpack -d"

Или как-нибудь еще короче, чтобы набирать было приятно.

17. PROFIT!

Результат можно посмотреть в моем репозитории на GitHub. Собранные файлы закоммичены прямо в репозиторий, чтобы посмотреть можно было даже не проходя туториал до конца.

Заключение

Вот таким простым и удобным способом мы теперь можем интегрировать Java и JS. Всё это — далеко не единичный случай, способов применения можно придумать множество.

Напоследок, каплю дегтя в бочку меда. В чем же подвох?

• GraalJS — пока не Open Source, хотя, по слухам, опенсорснуть его хотят; Уже всё в порядке.
• Джавовый npm пока что подтормаживает. Почему — надо изучать. Тормозит именно npm, а не сам JS-движок;
• Под капотом у всего этого находится лютая магия, и при попытке туда влезть придется изучать много всего дополнительно;
• Всё это собрано относительно JDK8. Новых фишек из Java 11 придется дожидаться достаточно долго;
• Graal — экспериментальный проект. Нужно учитывать это при попытке интегрировать его в совсем уж кровавый энтерпрайз без права на ошибку.

Минутка рекламы. Как вы, наверное, знаете, мы делаем конференции. Ближайшая конференция про JavaScript — HolyJS 2018 Piter, которая пройдет 19-20 мая 2018 года в Санкт-Петербурге. Можно туда прийти, послушать доклады (какие доклады там бывают — описано в программе конференции), вживую пообщаться с практикующими экспертами JavaScript и фронтенда, разработчиками разных моднейших технологий. Короче, заходите, мы вас ждём!

• Блог компании JUG Ru Group
• JavaScript
• Java