Среда IDE NetBeans, начиная с версии 6.1, содержит расширенные возможности по внесению изменений в JavaScript, смоделированные с поддержкой языков Java, Ruby и других. В этом руководстве представлен обзор этих возможностей.
В этом разделе будут рассмотрены основные возможности внесения изменений в JavaScript в среде IDE.
Создание новых файлов
С помощью мастера создания файла в любом проекте можно создать новый файл JavaScript. Для перехода к мастеру выберите "New->Other". В мастере откройте категорию "Other" и выберите файл JavaScript. Новый файл JavaScript создается по шаблону.
При необходимости файл JavaScript можно вывести на экран в редакторе проекта. Для этого создайте файл JavaScript в соответствующей подпапке проекта, например "src".
По умолчанию шаблон JavaScript содержит только информацию о лицензии. Для добавления в шаблон содержимого выберите "Tools -> Templates" и откройте шаблон JavaScript в среде IDE.
Синтаксическая подсветка
В среде IDE для различения методов и переменных применяется автоматическая семантическая подсветка.
Свертывание кода
Код методов может быть свернут или развернут. В редакторе щелкните расположенный рядом с методом значок , и код будет свернут. Щелкните расположенный рядом со свернутым методом значок , и код будет развернут. Свернутый код обозначается кнопкой многоточием в скобках. Удерживайте курсор на многоточии в скобках, и на экран будет выведен полный код метода.
Для свертывания или развертывания всех методов выберите "View -> Code Folds".
Переходы
Вкладка "Navigator" в среде IDE содержит структуру файлов JavaScript. На этой вкладке определения классов распознаются по стилю прототипа и отображаются как классы с методами.
Фоновый синтаксический анализатор
Синтаксический анализатор выполняется в фоновом режиме и выводит подробные сообщения об ошибках.
Соответствие скобок
Скобки закрываются автоматически. При вводе ',", [, (или { автоматически вставляется соответствующий закрывающий символ. Вводимый пользователем закрывающий символ заменяет вставленный символ. При удалении открывающего символа автоматически удаляется соответствующий закрывающий символ.
Форматирование
При переходе на новую строку в зависимости от того, где будет находиться следующая строка, будет вставлен отступ от курсора. После ввода } строка будет смещена влево. В результате изменения формата выбора или всего буфера весь файл будет смещен вправо.
Поддержка формата JSON
Файлы JSON обрабатываются как JavaScript. Фоновый синтаксический анализатор для JSON выполняется в специальном режиме, допускающем для объекта только литеральные выражения, без функций и т.д.
Семантическая подсветка
Объявления метода выделяются полужирным шрифтом (включая объявления метода по стилю прототипа в литералах объектов), глобальные переменные – зеленым, неиспользуемые переменные – серым с подчеркиванием.
Выделение случаев использования
Курсор, помещенный на символ, выделяет другие случаи использования этой переменной или ее вызовы. Более того, установка курсора на ключевом слове функции приводит к выделению всех возвращаемых этим методом данных (return, throw). Такого результата можно добиться также помещением курсора на оператор "return".
Быстрое переименование
Нажатием клавиш Ctrl-R/Command-R с курсором, установленным на локальной переменной, выбранный символ можно переименовать сразу во всем файле.
Реорганизация
Существует возможность поиска всех случаев использования переменной или операции в программе. В обнаруженных случаях можно переименовать все совпадающие переменные или операции и реорганизовать их в программе. Перед реорганизацией в режиме предварительного просмотра на разделенном экране графического интерфейса отображаются результаты изменений.
Поиск и переименование всех вхождений переменной или операции:
Выберите в редакторе необходимую переменную или операцию.
Выберите "Edit->Find Usages" (Alt-F7). Поиск можно выполнять как в комментариях, так и в активном коде. Откроется окно "Usages" с деревом всех случаев использования переменной или операции.
Снова выберите переменную в редакторе, а затем выберите "Refactor -> Rename" (Ctrl-R/Command-R). Откроется диалоговое окно, в котором необходимо ввести новое имя.
Нажмите кнопку "Preview". Откроется окно "Refactoring" с деревом замен слева и разделенным экраном с первоначальным и реорганизованным файлом справа.
Возможно, в некоторых случаях переименовывать переменную или операцию не потребуется. Отменить переименование для отдельного вхождения можно в дереве слева.
После просмотра нажмите кнопку "Do Refactoring", после чего все файлы будут реорганизованы.
Быстрое исправление и семантические проверки
В среде IDE неоднократно выполняются семантические проверки кода JavaScript и предлагаются варианты быстрого исправления. Для отображения режима быстрого исправления выберите "Source -> Fix Code" (Alt-Enter). Семантические проверки обнаруживают следующие ошибки:
переназначение параметра;
анонимная функция не всегда возвращает значение;
переменная скрывает аргумент;
код не имеет побочных эффектов (отсутствие вызовов, назначений).
Назначение в условном выражении (если x = y). Эта семантическая ошибка имеет несколько вариантов быстрого исправления, связанных, например, с преобразованием в выражение "==" и добавлением двойных круглых скобок для отключения предупреждения.
Противоречивые данные, возвращаемые функцией (некоторые выражения return возвращают значения, а некоторые нет)
Список задач
В список задач интегрированы фоновый синтаксический анализатор и предупреждения с вариантами быстрого исправления. Для просмотра ошибок в любом из связанных с JavaScript файлов откройте список задач ("Window -> Tasklist"). Дважды щелкните любую задачу в этом списке, после чего в редактор будет выполнен переход на соответствующую строку.
Автозавершение кода и анализ типов
Возможности автозавершения кода JavaScript позволяют выбрать встроенные базовые классы JavaScript среды IDE для вставки в код. Например, можно ввести:
x = "foo"; y = x; y.
После этого на экране появятся методы, доступные для строк JavaScript. Автозавершение кода поддерживает все типы литералов в JavaScript. Более того, механизм анализа типа и автозавершения кода определяет классы по стилю прототипов (только для стандартных функций) и выбирает новый оператор для их создания.
Среда IDE NetBeans обращается к параметрам типа для получения параметров функции и типов возврата (@type, @param). Эти типы отображаются как варианты автозавершения кода: в списке, в документации и подсказках по вводу параметров (Ctrl-P). В диалоговом окне автозавершения кода после имени функции через двоеточие выводятся также типы возвращаемых значений.
Метод, отмеченный как @deprecated, перечеркивается в окне "Navigator" и в вызовах этого метода функцией автозавершения кода. Сопутствующее устаревшее описание представлено в отдельном разделе в документации автозавершения кода и выделено контрастным фоном.
В среде IDE NetBeans можно также определить тип возвращаемого для нескольких функций. Эта функция важна для поддержки JSQuery. Например, методы, возвращающие значения "true" или "false", имеют тип возврата "Boolean"; методы, возвращающие числа, имеют тип "Number", и т.д. В среде IDE типы не только отображаются на экране; объявленные типы также явно отслеживаются в комментариях. Отсюда следует важный вывод: в среде IDE типы отслеживаются посредством вызовов. Если имеется код наподобие следующего:
Сначала foo считается в NetBeans строкой, поэтому из строкового класса берется метод big(). Строковая функция charCodeAt(50) имеет тип Number, поэтому в окне автозавершения кода будут представлены методы, доступные только для типа Number.
Примечание: Просмотр типов возвращаемых значений предполагает долгий поиск по значению, поэтому в течение анализа типа в среде IDE учитывается время, и через несколько секунд вычисление типа прерывается. Это может оказаться существенным для крупных функций, маломощных систем или производительных компьютеров с большой рабочей нагрузкой.
Переход к объявлению
Нажмите клавишу Ctrl и удерживайте курсор на строке кода. Щелкните левой кнопкой мыши имя переменной. Если тип переменной (и, следовательно, целевой функции) невозможно определить однозначно, в среде IDE появляется меню со всеми объявлениями переменной в текущем проекте:
Документация
В данных автозавершения кода также показана документация по интерфейсам API как для базовых интерфейсов API JavaScript, так и для интерфейсов API DOM. Можно также просматривать документацию для собственных функций. Установка курсора на вызовах и одновременным нажатием клавиши Ctrl также приводит к выводу документации (в качестве подсказки).
Автозавершение встроенного кода
Автозавершение кода по идентификаторам элементов в HTML работает для функции Prototype.js $("..."). Для вызова автозавершения кода по идентификаторам элементов нажмите Ctrl-Space с курсором внутри кавычек. Например, в случае добавление переменной = $("f|") и нажатия Ctrl-Space с курсором (|) сразу после f функцией автозавершения кода выводятся все идентификаторы элементов HTML в документе, начинающиеся с f.
Совместимость с обозревателями
Можно выбрать обозреватели, которые будут поддерживаться кодом JavaScript. В среде IDE варианты автозавершения кода, которые не поддерживаются выбранными обозревателями, перечеркиваются.
Следует также отметить, что в документации показаны значки для каждого обозревателя, который поддерживает документированный элемент интерфейса API.
В среде IDE в следующем диалоговом окне автозавершения кода перечеркнуты несколько вариантов выбора, так как они не поддерживаются выбранным обозревателем (только Opera).
Встраивание
Возможности внесения изменений в JavaScript работают для JavaScript, встроенного в файлы RHTML, HTML и JSP.
Открытие типа
Нажмите Ctrl-O/Command-O и перейдите к любой из функций в файлах.
Поддержка JSDoc
Метод, аннотированный как @private, обозначается в окне "Navigator" значком блокировки. Функция, аннотированная как @constructor, обозначается как конструктор (и добавляется в автозавершение кода после ключевого слова "new"); для четкого присвоения функций классам можно использовать следующие: @class и @namespace (зачастую анализатор типов присваивает эти функции автоматически). Отмеченные аннотацией @ignore функции не обнаруживаются в автозавершении кода, но добавляются в индекс и могут использоваться при переходе к объявлению.
Базовая фильтрация вставки файлов
Автозавершение кода в HTML содержит код только из вызванных файлов JavaScript. Рассмотрим проект, в котором файл foo.js определяет функцию foo(), а файл bar.js определяет функцию bar(). Если файл hello.html содержит только <script src="bar.js"></script>, в автозавершении кода для hello.html отображается только функция bar().
Дополнительные сведения об использовании среды IDE NetBeans для внесения изменений в код на языках, отличных от Java, приведены в следующих материалах:
Оставить комментарии и предложения, обратиться за поддержкой и получить информацию о последних достижениях в области функциональных возможностей разработки для Java EE с помощью среды IDE NetBeans можно в списке рассылки .