QtでのJavaScriptの実行について

Question

Qtでjavascriptを実行したいと思い下記のコードを書きました。

    QScriptEngine engine;
    QScriptValue global = engine.globalObject();
    engine.evaluate("function cubeaaa(x) {  return x * x * x; }");
    QScriptValue cube = global.property("cubeaaa");
    QScriptValueList args;
    args << 3;
    QScriptValue v=cube.call(QScriptValue(), args);
    qDebug() << v.toNumber(); // 27

これは正しく実行され２７が帰るのを確認しました。そこでJavascriptを改造して
console.log(x);を追記しました。

    QScriptEngine engine;
    QScriptValue global = engine.globalObject();
    engine.evaluate("function cubeaaa(x) {  console.log(x); return x * x * x; }");
    QScriptValue cube = global.property("cubeaaa");
    QScriptValueList args;
    args << 3;
    QScriptValue v=cube.call(QScriptValue(), args);
    qDebug() << v.toNumber(); // 27

これは戻り値nanとなります。
どうもqtのjavascriptにはconsoleがないみたいです。
この状態でデバッグする（Javascript側で出力する）にはどうすればいいのでしょうか？

Answer 1

こんにちは。既に自己解決されておりますが、自分が勝手に親近感を抱きましたので、蛇足すぎる情報を投稿させていただきます。

フリーソフトウェアのDJソフト「Mixxx」でのQtScriptの使用例

MixxxではXMLとJavaScriptによるMIDIコントローラーでのソフト制御とMIDIコントローラーのLEDなどの制御を記述することができます。

Controller Mapping Documentation - Mixxx Wiki
Controller Scripting - Mixxx Wiki

余談: Mixxx Wikiの一部日本語訳について

「Controller Scripting」に関しては、5年前くらいに私が日本語訳したものありますが、Mixxx自身のバージョンアップにより、最新版の原本Wikiドキュメントの翻訳はもちろん、MixxxがQt5に移行したことによって新たな情報がありそうですので、日本語訳は2020-03-16時点では参考にしない方が良いと思います。

---

実際にJavaScriptファイルをどのように読んでいるかは、GitHubで公開されているソースコードではこの辺かなと思います。

src/controllers/controllerengine.h
src/controllers/controllerengine.cpp

QMLがほぼJavaScriptに見える件

既にご承知かとは存じ上げますが、公式ドキュメントを張り付けておきます。
QML Applications - Qt Documentation

上記リンク先の内容を引用すると、

QML is a user interface specification and programming language. It allows developers and designers alike to create highly performant, fluidly animated and visually appealing applications. QML offers a highly readable, declarative, JSON-like syntax with support for imperative JavaScript expressions combined with dynamic property bindings.

JSON-like syntax との事なので、そりゃあ似るかなというのが個人的な感想です。

少し深入りして First Steps with QML - Qt Documentationを少し眺めました。

個人の感想になりますが、
「QMLはWebページで言うところのHTML的なものっぽいわね」
と思いました。

余談: QMLがHTML的なものと考えると……、

また更に個人の感想で恐縮ですが、
「QMLがHTML的なものと考えると、できる限りQMLとJavaScriptは分けて書いた方が行儀がいいのかな」
と思った次第です。
今日のWebアプリはSPAだったりする場合、クライアントのブラウザにJavaScriptを読んでもらって動的にDOM編集していることも多いのでこの限りではないかもしれませんが。

---

QtはECMAScriptに準じています

以下、何らかの情報を得てQtScript（Qtで利用するJavaScript)の情報を漁っている方向けに書き残します。

特に特殊な実装はしていません。ご安心を。

Qt4までの話はこちら。
Qt Script - Qt Documentation

Qt5以降はまとまったドキュメントは見つけられませんでした。代わりに上記リンク先の一文では、

Warning: This module is not actively developed. It is provided for backwards compatibility with Qt 4 only. For new code, use QJSEngine and related classes in the Qt QML module instead.

との事なので、案内通りにQJSEngineの方から掻い摘んで、Qtの提供しているAPIを確認した方が良さそうです。Details Descriptionの章を斜め読みした限りでは、ES2015で新たに追加された仕様（特に import, export といったモジュール機能）も使える様になっていると見受けられるので。

---

以上が、
「C#が本業のスクリプトキディがDJコントローラー（Numark NV）を買ったものの、やっぱり対応していなかったので、Mixxxのスクリプトを暇な時に書いてみた」
限りで得た情報です。

kokawa2003さんはもちろん、他QtScriptの情報、もっと言えばMixxxのコントローラースクリプト開発に取り組もうとしている方の参考になれば幸いです。

Comments

[kokawa2003]

MIDIって言葉を久しぶりに聞いて涙が流れそうですが、それはそうとして、わざわざありがとうございます。

[manzyun]

いえいえ、結局のところこの回答の本心は、
「一緒にMixxxのコントローラーのスクリプト開発しようぜ？」
という不順な動機ですので。むしろ参考になったら感無量です。

Answer 2

その後わかったことは
1.Qtから*.jsの関数は呼べない（少なくとも不明）。
2.ただおなじようなスクリプトである*.qmlは呼べる。
3.qmlから*.jsの関数は呼べる。
4.qmlとJavaScriptは激似。
だから解決は
1.QtからQMLの関数を呼びQMLからJavaScriptを呼ぶ（CとJSの間にQMLをかませる）
2.javascriptをQMLにコピペしても多分OK
のどちらか。
今回安全な１でやった。QTでAJAXとかできればいいと思う。

    {
        QQmlEngine engine;
        QQmlComponent component(&engine, "qrc:/test1.qml");
        QObject *object = component.create();

        QVariant returnedValue;
        QVariant msg = "Hello from C++";
        QMetaObject::invokeMethod(object, "myQmlFunction",
            Q_RETURN_ARG(QVariant, returnedValue),
            Q_ARG(QVariant, msg));

        qDebug() << "QML function returned:" << returnedValue.toString();
        delete object;
    }

import QtQuick 2.0
import "mytestjs.js" as Util // JSファイルをインポート

Item {
    function myQmlFunction(msg) {
        console.log("Got message:", msg);
        var res=Util.debugOutputToConsole(msg);
        return res;
    }
}

.pragma library // ステートレスライブラリにすると追加される

var is_debug = true;
// デバッグ文字列をコンソールへ出力
function debugOutputToConsole(message) {
    if(is_debug){
        console.debug(message);
        console.log("ookawa");
    }
    return "koji";
}

デメリットはスクリプトのエラーが実行時までわからないこと
スクリプトファイルをリソースに入れる必要があることです。
メリットは
JSにブレークポイントがつけられること
console.logがつかえること
履歴にQMLが分かると言えること。
以上
また念のためいっておきますが
QQmlComponent component(&engine, "qrc:/test1.qml");
をJavaScriptに変えたらどうか？はやってみたけどだめでした。
また一応コンパイルする環境なのでそのソースをスクリプトと呼んでいいのかも不明。
JSがスクリプトなのは常識だから....。QMLは知らん。