Как запустить файл js с помощью узла js

Обновлено: 21.11.2024

Иногда вас сбивают с толку очевидные вещи... Я прошел процесс установки и настройки Node js, создал свое первое приложение Node, и все было в порядке. Когда я вернулся к этому проекту несколько недель спустя (я периодически использую Node.js), я не мог вспомнить, как запустить сервер Node js. Погуглив «как запустить файл Node js», я нашел множество других, задающих тот же вопрос. Итак, если вы хотите запустить свой файл Node js в терминале, или в Command, или в терминале Visual Studio Code, вот как это сделать. Это. В этом посте также рассказывается, как проверить, установлен ли Node js, и как проверить версию Node js, если она установлена.

  1. Откройте окно Terminal / Command / Git Bash / Visual Studio Code Terminal
  2. Измените расположение на свой проект узла.
  3. Введите узел имя файла.js

И на этом все. Поэтому, если ваш файл называется app.js, вы должны ввести node app.js. Если ваш файл называется search.js, введите node search.js.

Если вам нужна дополнительная информация, чтобы настроить проект и запустить файл Node js, ознакомьтесь с информацией здесь. Однако это по-прежнему предполагает, что у вас уже установлен Node…..

Как проверить, установлен ли Node js и проверить версию Node js

Да, мне тоже не раз приходилось это делать. Чтобы проверить, установлен ли у вас Node js, или как проверить версию Node js, выполните следующие действия:

  1. Откройте инструмент командной строки (как указано выше, Терминал, Command, Git Bash и т. д.)
  2. Введите node -v
  3. Это напечатает номер версии, если у вас установлен узел

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

Поэтому, чтобы запустить файл node js в терминале / command / git bash, вы просто вводите «node», затем имя файла и включаете расширение .js:

Код отлично работает в окне консоли, но как указать путь в среде Windows.

в Unix, я думаю, отображается $ node hello.js

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

> узел C:\abc\zyx\hello.js ---- не работает

> C:\abc\zyx\hello.js -- не работает

ОБНОВЛЕНИЕ1:

Добавлен node.exe в папку, где находится файл hello.js.
Добавлен путь к папке c:\abc\zyx\, и я получаю сообщение об ошибке

ReferenceError: приветствие не определено

просмотреть содержимое hello.js

ОБНОВЛЕНИЕ 2:

До сих пор я пробовал все эти версии, и ни одна из них не работает. Может быть, я делаю что-то совершенно неправильно.

См. мою файловую структуру

РЕШЕНО. Вместо запуска node.exe попробуйте запустить в командной строке следующий параметр, и это сработало.

Не могли бы вы предоставить немного больше информации? Насколько мне известно, официальной ноды для Windows не существует, поскольку объявление о запуске переноса было сделано всего несколько недель назад. Используете ли вы node.js под Cygwin или есть какие-то другие разветвления окон узлов (если они есть, я не слышал об этом). РЕДАКТИРОВАТЬ: я не знал, что доступна предварительная сборка. Приношу свои извинения.

я не знаю, что такое c:>, но из командной строки, как вы сказали, мне помогло "узел c:\users\me\desktop\helloworld.js".

У меня были те же проблемы, что и у вас, это забавно, потому что даже сегодня, в 2016 году, я нашел десятки руководств, пытающихся научить nodejs, но ни один из них не учит шаг за шагом, как запускать основную команду, кроме '$ node filename.js '. Я не могу понять, как все предполагают, что нам нужно использовать для этого корневую папку. Кто использует корень диска для размещения файлов?

17 ответов 17

Вот и все. Это было сделано в Windows XP.

Это ужасно, НЕ копируйте исполняемый файл узла в корень жесткого диска. Вот для чего предназначены пути, см. ответ @kcbanner. Кроме того, установка Node в Windows поставляется с командной строкой Node.js, в которой уже правильно заданы пути, если вы не хотите изменять системный путь.

@joshperry - Я думаю, вы немного упускаете суть. Вопрос был сильно отредактирован по сравнению с оригиналом, но основная проблема, с которой столкнулась ОП, заключалась в том, что они пытались выполнить файл из REPL.Ничто в моем ответе не предназначено как решение для долгосрочной установки, и это даже не подразумевается. Инструкции настолько просты, что иллюстрируют разницу между выполнением файла .js и открытием REPL.

Установите файл MSI: перейдите в установленный каталог C:\Program Files\nodejs из командной строки n

C:\>cd C:\Program Files\nodejs введите..

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

Убедитесь, что каталог с node.exe находится в вашем PATH . Затем вы сможете запустить node path_to_js_file.js .

Я добавил node.exe в папку, где находится файл hello.js. Также добавил путь к папке c:\abc\zyx\ и получаю ошибку

О, понятно. Это похоже на проблему внутри вашего файла hello.js. Опубликуйте содержимое этого файла

еще один простой способ

  1. загрузите nodejs в свою систему
  2. откройте блокнот и напишите команду js "console.log('Hello World');"
  3. сохраните файл как hello.js, желательно в том же месте, что и nodejs
  4. открыть командную строку и перейти к местоположению, где находится nodejs
    c:\program files\nodejs
  5. и запустите команду из такого места, как c:\program files\nodejs>node hello.js
  6. если файл js находится в другом месте, укажите путь к файлу c:\program files\nodejs>путь к узлу\hello.js

Я установил узел для Windows. Когда я ищу node.js в меню «Пуск» Windows 7, появляется командная строка node.js. Если вы запустите эту специальную командную строку, вы можете установить что угодно в любом месте, не устанавливая путь или копируя node.exe везде.

WinXp: я создал файл .bat

Для этого просто запустите my_program.bat из проводника или в окне cmd

Перейдите к cmd и введите: node "C:\Path\To\File\Sample.js"

Windows/CMD не знает, где находится файл узла. Вы можете ввести вручную:

каждый раз, когда вы открываете новое приглашение cmd.exe

ИЛИ (в Windows 10),

  1. щелкните правой кнопкой мыши Этот компьютер -> свойства .
  2. Нажмите «Дополнительные параметры системы» -> «Переменные среды» (внизу справа).
  3. Выберите «Путь» и нажмите «Изменить» .
  4. Нажмите "Создать" и введите C:\Program Files\nodejs.
  5. Перезагрузитесь, и вы сможете запускать узел из любого каталога.

Проблема заключалась в том, что вы открыли реплику Node.js, в то время как все автоматически предполагали, что вы находитесь в командной строке. Для чего вы можете запустить файл javascript из repl с помощью команды .load. Например:

Эту же команду можно также использовать в командной строке, если вы сначала запускаете узел в командной строке, вводя узел без аргументов (при условии, что узел находится в PATH).

Я нахожу удивительным, что 1) все предположили, что вы находитесь в командной строке, а не в repl, 2) кажется, никто не знает о .load и 3) это имеет 273 голоса, что доказывает, что многие другие node.js новички также сбиты с толку.

Node.js – это популярная среда выполнения с открытым исходным кодом, которая может выполнять JavaScript вне браузера с помощью механизма JavaScript V8, который используется для обеспечения выполнения JavaScript в веб-браузере Google Chrome. Среда выполнения Node обычно используется для создания инструментов командной строки и веб-серверов.

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

Кроме того, благодаря поддержке асинхронного выполнения Node.js превосходно справляется с задачами с интенсивным вводом-выводом, что делает его таким подходящим для Интернета. Приложения реального времени, такие как потоковое видео, или приложения, которые непрерывно отправляют и получают данные, могут работать более эффективно, если они написаны на Node.js.

В этом руководстве вы создадите свою первую программу со средой выполнения Node.js. Вы познакомитесь с несколькими концепциями, специфичными для Node, и проложите свой путь к созданию программы, которая поможет пользователям проверять переменные среды в своей системе. Для этого вы узнаете, как выводить строки на консоль, получать ввод от пользователя и получать доступ к переменным среды.

Предпосылки

Для выполнения этого руководства вам потребуется:

Если вы хотите поэкспериментировать с Node.js без использования сервера или локального компьютера, вы можете использовать интерактивный терминал в своем браузере. Нажмите Запустить интерактивный терминал! кнопку ниже, чтобы начать.

Запустите интерактивный терминал!

Шаг 1 — Вывод на консоль

Чтобы написать «Hello, World!» программу, откройте текстовый редактор командной строки, такой как nano, и создайте новый файл:

Открыв текстовый редактор, введите следующий код:

Объект консоли в Node.js предоставляет простые методы для записи в stdout , stderr или в любой другой поток Node.js, которым в большинстве случаев является командная строка.Метод журнала печатает в поток stdout, поэтому вы можете увидеть его в своей консоли.

В контексте Node.js потоки — это объекты, которые могут либо получать данные, например поток stdout, либо объекты, которые могут выводить данные, например сетевой сокет или файл. В случае потоков stdout и stderr любые отправленные им данные будут отображаться в консоли. Одна из замечательных особенностей потоков заключается в том, что они легко перенаправляются, и в этом случае вы можете, например, перенаправить вывод своей программы в файл.

Сохраните и выйдите из nano, нажав CTRL+X , когда будет предложено сохранить файл, нажмите Y . Теперь ваша программа готова к запуску.

Шаг 2 — Запуск программы

Чтобы запустить эту программу, используйте команду node следующим образом:

Программа hello.js будет выполнена и отобразит следующий вывод:

Интерпретатор Node.js прочитал файл и выполнил console.log("Hello World"); вызвав метод журнала глобального объекта консоли. Строка "Hello World" была передана в качестве аргумента функции журнала.

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

Убедившись, что программа работает, давайте сделаем ее более интерактивной.

Шаг 3. Получение пользовательского ввода с помощью аргументов командной строки

Каждый раз, когда вы запускаете Node.js «Hello, World!» программа, она выдает тот же результат. Чтобы сделать программу более динамичной, давайте получим данные от пользователя и отобразим их на экране.

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

Создайте новый файл arguments.js с помощью nano:

Введите следующий код:

Объект процесса — это глобальный объект Node.js, содержащий функции и данные, связанные с текущим запущенным процессом Node.js. Свойство argv представляет собой массив строк, содержащий все аргументы командной строки, переданные программе.

Сохраните и выйдите из nano, нажав CTRL+X , когда будет предложено сохранить файл, нажмите Y .

Теперь, когда вы запускаете эту программу, вы предоставляете такой аргумент командной строки:

Вывод выглядит следующим образом:

Первым аргументом в массиве process.argv всегда является расположение двоичного файла Node.js, на котором выполняется программа. Второй аргумент всегда является расположением исполняемого файла. Остальные аргументы — это то, что ввел пользователь, в данном случае: hello и world .

Нас в основном интересуют аргументы, введенные пользователем, а не аргументы по умолчанию, которые предоставляет Node.js. Откройте файл arguments.js для редактирования:

Изменить console.log(process.arg); к следующему:

Поскольку argv – это массив, вы можете использовать встроенный в JavaScript метод среза, который возвращает выбранные элементы. Когда вы предоставляете функции slice аргумент 2, вы получаете все элементы argv, которые идут после ее второго элемента; то есть аргументы, введенные пользователем.

Повторно запустите программу с командой node и теми же аргументами, что и в прошлый раз:

Теперь результат выглядит следующим образом:

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

Шаг 4. Доступ к переменным среды

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

Используйте nano для создания нового файла environment.js :

Добавьте следующий код:

Объект env хранит все переменные среды, которые доступны, когда Node.js запускает программу.

Сохраните и выйдите, как и раньше, и запустите файл environment.js с помощью команды node.

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

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

Шаг 5. Доступ к указанной переменной среды

На этом шаге вы просмотрите переменные среды и их значения с помощью глобального объекта process.env и выведете их значения на консоль.

Объект process.env представляет собой простое сопоставление между именами переменных среды и их значениями, хранящимися в виде строк. Как и все объекты в JavaScript, вы получаете доступ к отдельному свойству, ссылаясь на его имя в квадратных скобках.

Откройте файл environment.js для редактирования:

Изменить console.log(process.env); в:

Сохраните файл и выйдите.Теперь запустите программу environment.js:

Теперь результат выглядит следующим образом:

Вместо того, чтобы печатать весь объект, теперь вы печатаете только свойство HOME в process.env , в котором хранится значение переменной среды $HOME.

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

Шаг 6. Получение аргумента в ответ на ввод данных пользователем

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

Используйте nano для создания нового файла echo.js :

Добавьте следующий код:

Первая строка файла echo.js хранит все аргументы командной строки, предоставленные пользователем, в константную переменную с именем args . Вторая строка выводит переменную окружения, хранящуюся в первом элементе args; то есть первый аргумент командной строки, предоставленный пользователем.

Сохраните и выйдите из nano , затем запустите программу следующим образом:

Теперь результат будет таким:

Аргумент HOME был сохранен в массиве args, который затем использовался для поиска его значения в среде с помощью объекта process.env.

Теперь вы можете получить доступ к значению любой переменной среды в вашей системе. Чтобы убедиться в этом, попробуйте просмотреть следующие переменные: PWD , USER , PATH .

Получить отдельные переменные — это хорошо, но лучше позволить пользователю указать, сколько переменных ему нужно.

Шаг 7. Просмотр нескольких переменных среды

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

Отредактируйте файл, чтобы вместо него был следующий код:

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

Сохраните и закройте файл. Теперь перезапустите программу с двумя аргументами:

Вы увидите следующий вывод:

Функция forEach обеспечивает печать каждого аргумента командной строки в массиве args.

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

Шаг 8. Обработка неопределенного ввода

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

Вывод будет выглядеть следующим образом:

Первые две строки печатаются, как и ожидалось, а последняя строка содержит только значение undefined . В JavaScript неопределенное значение означает, что переменной или свойству не присвоено значение. Поскольку NOT_DEFINED не является допустимой переменной среды, она отображается как неопределенная .

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

Открыть файл echo.js для редактирования:

Отредактируйте echo.js, чтобы он имел следующий код:

Здесь вы изменили функцию обратного вызова, предоставляемую forEach, чтобы она выполняла следующие действия:

  1. Получить значение аргумента командной строки в среде и сохранить его в переменной envVar .
  2. Проверьте, не определено ли значение envVar.
  3. Если переменная envVar не определена, мы выводим полезное сообщение о том, что ее не удалось найти.
  4. Если переменная среды найдена, мы печатаем ее значение.

Примечание. Функция console.error выводит сообщение на экран через поток stderr, тогда как console.log выводит на экран через поток stdout. Когда вы запускаете эту программу через командную строку, вы не заметите разницы между потоками stdout и stderr, но рекомендуется выводить ошибки через поток stderr, чтобы их было легче идентифицировать и обрабатывать другими программами, которые может определить разницу.

На этот раз вывод будет таким:

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

Заключение

Ваша первая программа отображала на экране «Hello World», а теперь вы написали утилиту командной строки Node.js, которая считывает пользовательские аргументы для отображения переменных среды.

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

Если вы хотите продолжить изучение Node.js, вы можете вернуться к серии статей How To Code in Node.js или просмотреть проекты и настройки программирования на нашей тематической странице Node.

Хотите узнать больше? Присоединяйтесь к сообществу DigitalOcean!

Присоединяйтесь к нашему сообществу DigitalOcean, насчитывающему более миллиона разработчиков, бесплатно! Получайте помощь и делитесь знаниями в нашем разделе "Вопросы и ответы", находите руководства и инструменты, которые помогут вам расти как разработчику и масштабировать свой проект или бизнес, а также подписывайтесь на интересующие вас темы.

Серия руководств: Как программировать в Node.js

Node.js – это популярная среда выполнения с открытым исходным кодом, которая может выполнять JavaScript вне браузера. Среда выполнения Node обычно используется для внутренней веб-разработки, используя свои асинхронные возможности для создания сетевых приложений и веб-серверов. Node также является популярным выбором для создания инструментов командной строки.

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

Чтобы пройти этот курс, вам необходимо знать, как и где вы запускаете код JavaScript. У вас есть несколько вариантов запуска вашего первого приветственного программирования:

Откройте редактор и создайте файл с именем index.js .

Как запустить JavaScript из командной строки

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

Теперь просто откройте командную строку в том же каталоге, где находится созданный вами скрипт index.js (VS Code сделает это автоматически с помощью встроенного терминала).

Как запустить JavaScript из браузера

Когда люди думают о JavaScript, чаще всего они представляют веб-браузер. Вы можете запустить код в браузере, создав файл HTML, который ссылается на скрипт. В нашем случае мы использовали параметр отсрочки, который запустит JS после завершения загрузки HTML-файла.

Запуск скрипта из HTML-файла

Теперь просто откройте этот HTML-файл на локальном компьютере и откройте консоль разработчика (следующий шаг), чтобы увидеть результат.

Проверить консоль браузера

В Chrome вы можете открыть консоль разработчика, нажав Ctrl+Shift+J (Windows) или Ctrl+Option+J (Mac), или вручную из меню настроек, выбрав Дополнительные инструменты -> Инструменты разработчика. Консоль позволяет запускать код в браузере подобно тому, как

Вывод консоли браузера в Chrome

Запуск JavaScript с фреймворком

Стоит отметить, что такие фреймворки, как React, Angular, Svelte и т. д., автоматически позаботятся о создании и запуске вашего приложения и предоставят инструменты и шаги для выполнения кода, специфичные для фреймворка. В реальном мире вы, скорее всего, будете использовать инструменты, предоставляемые платформой, для запуска кода, а не базовые методы, показанные в этом разделе.

Запуск JavaScript в песочнице

В этом курсе StackBlitz используется для запуска примеров кода JS в изолированной программной среде в браузере. Это отличный способ поделиться быстрыми демонстрациями и репродукциями выпусков 💡.

Узнайте, как запускать файлы JavaScript в терминале или из командной строки, используя среду выполнения NodeJs. JavaScript — это язык сценариев для создания интерактивных веб-страниц, что означает, что он интерпретируется только в браузере. Поэтому вы можете запускать js-файл в терминале только в том случае, если на вашем компьютере установлен NodeJs.

Поэтому сначала нам нужно установить его, поэтому откройте эту ссылку, чтобы загрузить среду выполнения NodeJs. Затем откройте загруженный файл .exe и установите его в своей системе глобально. Если он уже установлен в вашей системе, вы можете пропустить этот шаг.

Теперь мы можем запускать код js в терминале, так что давайте приступим.

Пример 1. Запуск сценария JS из командной строки

Оглавление

Сначала создайте новый файл JavaScript и назовите его «helloworld.js». Вы можете просто использовать любой текстовый редактор, который у вас есть, или, если у вас установлен код Visual Studio, используйте его. Главное здесь — убедиться, что вы называете файл с расширением .js.

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

Когда вы запускаете приведенный выше код непосредственно в браузере, вывод будет таким: Меня зовут и возраст: Правосудие 20. Проверьте также, Java или JavaScript: что лучше?

Шаги для запуска кода js в терминале

  • Откройте командную строку или терминал, введя cmd в поле системного поиска. Вы можете открыть его как администратор или нет.

откройте командную строку для запуска js-скрипта

  • Используйте cd, чтобы перейти к пути, по которому вы сохранили указанный выше файл. Если вы проигнорируете этот шаг, это не сработает, потому что ваша система не может найти путь к файлу js.
  • Затем просто введите "node helloworld.js" и нажмите Enter. Если вы сохранили файл под другим именем, используйте это имя. Вы должны увидеть и вывести «Меня зовут и возраст — Правосудие 20», напечатанное на терминале, если все прошло успешно. Вы можете проверить изображение ниже и выполнить шаги, которые я использовал для запуска файла.

запустить файл js из терминала

Пример 2. Запуск файла Js в терминале со средой выполнения NodeJs.

Давайте сделаем еще один простой пример: создайте файл js и назовите его «дополнение.js», скопируйте и вставьте в файл приведенную ниже функцию сложения двух чисел.

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

Теперь ваша очередь, следуйте описанному выше подходу, который я использовал в первом примере, чтобы запустить этот файл в терминале. Помните, что имя файла — «addition.js», и не забудьте сначала перейти по этому пути.

Все, вы успешно научились запускать любой код JavaScript в терминале.

Как запустить файл JavaScript в HTML?

JavaScript – это интерпретируемый язык, разработанный для обеспечения интерактивности веб-страниц. Это не язык программирования высокого уровня, как JAVA и C++, но это не значит, что он бесполезен, вы можете использовать JavaScript для разработки как интерфейсных, так и серверных приложений с помощью NodeJ.

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

  • Выполнение встроенного HTML-кода Javascript

При таком подходе вы можете поместить код JavaScript в заголовок или перед закрывающим тегом body вашего HTML-файла. Для хорошей производительности и для того, чтобы элементы Dom загружались до js, рекомендуется вставлять его прямо перед закрывающим тегом body.

Пример. Создайте новый файл .html, скопируйте и вставьте в него приведенный ниже код. Обратите внимание, где тег размещен аккуратно.

  1. Выполнить внешний файл JavaScript в HTML

Если вы собираетесь разрабатывать большое приложение, в котором будет много кода, я рекомендую вам использовать этот подход. Это лучший вариант, который поможет вам поддерживать чистоту и порядок. Здесь вместо того, чтобы помещать все ваши сценарии JS в один и тот же файл HTML, давайте сделаем что-то другое. Идея состоит в том, чтобы отделить код js от HTML. Короче говоря, мы создадим внешний файл js и свяжем его с нашим HTML.

Пример. Создайте файл JavaScript, назовите его «myexternal.js» и поместите в него приведенный ниже код.

Создайте другой файл и назовите его index.html. Скопируйте и вставьте в него приведенный ниже код, но будьте очень внимательны.

Если вы внимательно посмотрите на приведенный выше код, то увидите, что в открывающем теге "" есть атрибут "src", который указывает на наш файл JavaScript. Это просто означает, что мы делаем наш файл сценария доступным для элемента HTML Dom, чтобы мы могли получить к ним дополнительный доступ, чтобы сделать нашу страницу интерактивной. Это все, что вам нужно сделать, вы можете открыть файл в браузере, и вы должны увидеть всплывающее предупреждение. Я думаю, вы теперь хорошо поняли вопрос? Как запустить файл JavaScript?

Включая JavaScript — HTML и CSS

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

А как насчет CSS? Можете ли вы напрямую связать с ним файл JS?

Короткий ответ: нет, вы можете использовать JavaScript для написания CSS для стилизации вашего элемента Dom, выполнив что-то вроде:

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

Разница в выполнении JavaScript на стороне сервера и на стороне клиента

Основной целью JavaScript было помочь сделать веб-страницы интерактивными. Но разработчики очень усердно работали над созданием фреймворка под названием «Node.Js», который интерпретирует JavaScript на сервере. Так в чем именно разница между ними? Ну, если JS запускается в браузере, то это клиентский скрипт, а если он запускается в терминале, то это серверный скрипт.

Если вы помните, вы знаете, что мы выполнили наш первый скрипт в командной строке с помощью Node.js. Мы не связывали его ни с одним файлом HTML, но смогли успешно его запустить. Почему? Он работает на терминале как сервер. А как насчет последних двух примеров, которые запускаются в браузере? Это клиентский JavaScript, и мы не можем запустить его как серверный скрипт.

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

Как запустить файл js в браузере?

Все файлы JavaScript, связанные с файлом HTML, можно запускать непосредственно в браузере без какой-либо компиляции. В каждом браузере есть движок для интерпретации JS-скриптов. Все, что вам нужно, это убедиться, что ваш скрипт связан с вашим HTML-файлом либо встроенным, либо внешним образом. Затем просто откройте файл в браузере, чтобы увидеть его. Иногда вы можете сделать что-то не так и столкнуться с ошибкой.

В этом случае вы можете открыть «инструмент проверки», который доступен почти во всех браузерах, включая Chrome и Mozilla Firefox. Нажав на консоль, вы можете увидеть, что не так, и предпринять необходимые шаги для исправления ошибки. Консоль также дает вам возможность напрямую писать в ней любой код JavaScript. Я лично предпочитаю делать это, так как я могу выделить свой элемент Dom и посмотреть, на какой из них я могу ссылаться непосредственно для отладки.

Многие IDE, такие как код Visual Studio, и Atom также позволяют напрямую выполнять код JavaScript. В частности, в VS-Code есть встроенный терминал, который вы можете использовать. Он также имеет популярные расширения для предварительного просмотра HTML-страниц, связанных с файлами js, напрямую, без использования браузера.

Заключение. Принципы запуска файлов JavaScript

Вы прошли очень долгий путь и действительно многому научились в этом руководстве. Как я постоянно говорю, я хочу для вас самого лучшего, так что продолжайте практиковаться, и вы освоите все. И всегда помните об этом всякий раз, когда решите чему-то научиться: «Никто не гений, все дело в обучении. Если кто-то кажется вам гением, это просто означает, что он научился большему, чем вы».

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

Например, вы знаете, что говорят, что если вы понимаете объект, значит, вы понимаете JavaScript, верно? Почему, потому что все в JS — это почти объект. Допустим, вы не потратили время на глубокое понимание объекта. Спросите себя, как вы будете использовать данные JSON с сервера?

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

Это небольшой совет для вас. Если оно вам нравится или у вас есть какие-либо дополнения к этому руководству, сообщите мне об этом в поле для комментариев ниже.

Теперь вы научились запускать файлы JavaScript в терминале и в HTML. Есть одна важная вещь, которую вы должны знать, она очень полезна, и вас обязательно спросят об этом на любом из ваших технических интервью. Разница между исходным кодом и объектным кодом — это действительно очень важная концепция, которую вам нужно понять. Большинство рекрутеров задают вопросы об этом, чтобы проверить ваши основы программирования. В противном случае вы будете считаться неопытным, нажмите на нее и не торопитесь, чтобы изучить все пошаговые руководства, которые я предоставил.

Читайте также: