JavaScript в QML

JavaScript – это лингва франка в разработке веб-клиентов. Он также начинает набирать обороты в разработке веб-серверов, в основном с помощью node.js. Таким образом, он является подходящим дополнением в качестве императивного языка к декларативному языку QML. Сам QML как декларативный язык используется для выражения иерархии пользовательского интерфейса, но ограничен в выражении операционного кода. Но иногда вам нужен способ выражения операций, и здесь в игру вступает JavaScript.

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

Вот краткий пример того, как выглядит JS, используемый в QML:

Button {
  width: 200
  height: 300
  property bool checked: false
  text: "Click to toggle"

  // JS функция
  function doToggle() {
    checked = !checked
  }

  onClicked: {
    // это тоже JavaScript
    doToggle();
    console.log('checked: ' + checked)
  }
}

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

import "util.js" as Util // импорт чистого модуля JS

Button {
  width: 200
  height: width*2 // JS справа в привязке свойства

  // отдельная функция (не совсем полезная)
  function log(msg) {
    console.log("Button> " + msg);
  }

  onClicked: {
    // это JavaScript
    log();
    Qt.quit();
  }
}

В QML вы объявляете пользовательский интерфейс, а в JavaScript вы делаете его функциональным. Итак, сколько кода на JavaScript вы должны написать? Это зависит от вашего стиля и того, насколько вы знакомы с разработкой JS. JS – это язык со слабой типизацией, что затрудняет обнаружение дефектов типов. Кроме того, функции ожидают все варианты аргументов, что может быть очень неприятной ошибкой. Способ обнаружения дефектов – тщательное модульное тестирование или приемочное тестирование. Поэтому, если вы разрабатываете в JS настоящую логику (а не какие-то связующие строки кода), вам следует начать использовать подход «сначала тесты». Обычно смешанные команды (Qt/C++ и QML/JS) очень успешны, когда они минимизируют количество JS во внешнем интерфейсе в качестве бизнес-логики и выполняют тяжелую работу на Qt C++ в бэкэнде. Затем серверная часть должна пройти тщательное модульное тестирование, чтобы разработчики внешнего интерфейса могли доверять коду и сосредоточиться на всех оставшихся небольших требованиях к пользовательскому интерфейсу.

Теги