サポンテ 勉強ノート

サポンテの勉強ノート・読書メモなどを晒します。

JXA で paiza のスキルチェックに挑みたい

はじめに

 JavaScript を勉強中で paiza のスキルチェックを JavaScript で書きたい方向けの記事です。

 提出コードは node.js ですが、macOS なら標準でインストールされている「スクリプトエディタ.app」と「Safari」を使って JavaScriptデバッグができます。

 paiza の下記ページにある JavaScript 用サンプルコードを、JXA で書くと以下のようになるでしょう。

paizaプログラミングスキルチェックの値取得・出力サンプルコード | ITエンジニア向け転職・就活・学習サービス【paiza】

 最初に書きましたが、最終的な提出コードは node.js 向けに再度編集が必要です。

スクリプトエディタ.app を使う場合

 スクリプトエディタ.app を使って開発・デバッグを行う場合は、値の受け取りに標準入力が使えないため以下のようになるでしょう。

 console.log の結果は、Safari の Web インスペクタに出力されます。

debugger;

var lines = 
`2
2 5
3 4`
.split("\n");

var N = lines[0];
for (var i = 0; i < N; i++) {
    var line = lines[i + 1].split(" ");
    console.log("hello = " + line[0] + ", world = " + line[1]);
}

VS Code を使う場合

 VS Code を使うと、入力値のファイルとスクリプトファイルを別々にできます。値の受け取りを、paiza 同様に標準入力から受け取る場合は以下のようになるでしょう。

debugger;

var lines = function () {
    let u = $.NSUTF8StringEncoding;
    let d = $('').dataUsingEncoding(u);
    $.NSFileHandle.fileHandleWithStandardOutput.writeData(d);
    d = $.NSFileHandle.fileHandleWithStandardInput.availableData;
    let _STDIN = $.NSString.alloc.initWithDataEncoding(d, u).js.slice(0, -1);
    let lines = _STDIN.split("\n");
    return lines;
}();

var N = lines[0];
for (var i = 0; i < N; i++) {
    var line = lines[i + 1].split(" ");
    console.log("hello = " + line[0] + ", world = " + line[1]);
}

Safari 側の準備

 あらかじめ、下記の Web サイトを参考に Safari の「開発」メニュー > (自分の Mac の名前) > 「JSContexts の Web インスペクタを自動的に表示」をチェックしておきます。

JXAのデバッグにSafariのWEBインスペクタが使える - DTPab

おわりに

 node.js の環境構築をしないで手っ取り早く JavaScript のコーディングを始めたい方向けです。

 サポンテは環境構築終わっていますが、Apple 信者なのとどうせ JXA は使うので、やり方を考えてみました。

参考

JXAで標準入出力、エラー、パスワード入力、ログ出力 - Qiita

JXAのデバッグにSafariのWEBインスペクタが使える - DTPab

ヒアドキュメントを疑似的に使う | JavaScript逆引き | Webサイト制作支援 | ShanaBrian Website

JXA の基本 - Paepoi