実現したいこと

次のような形で，JSON形式の抽象構文木が文字列の形で得られるのを，文字列としてのJSON形式でなく，中身としてのJSON形式で得たいです．
「該当ソースコード」の部分でいう，programにこの文字列が入っています．

JavaScript
1'{
2    "Token": {
3        "Token": {
4            "type": "LOOP",
5            "literal": "loop"
6        }
7    },
8    "Expression": {
9        "Token": {
10            "Token": {
11                "type": "LOOP",
12                "literal": "loop"
13            }
14        },
15        "Condition": {
16            "Token": {
17                "Token": {
18                    "type": "INT",
19                    "literal": "10"
20                }
21            },
22            "Value": 10
23        },
24        "Consequence": {
25            "Token": {
26                "Token": {
27                    "type": "LBRACE",
28                    "literal": "{"
29                }
30            },
31            "Statements": [
32                {
33                    "Token": {
34                        "Token": {
35                            "type": "IDENT",
36                            "literal": "play"
37                        }
38                    },
39                    "Expression": {
40                        "Token": {
41                            "Token": {
42                                "type": "LPAREN",
43                                "literal": "("
44                            },
45                            "Function": {
46                                "Token": {
47                                    "Token": {
48                                        "type": "IDENT",
49                                        "literal": "play"
50                                    },
51                                    "Value": "play"
52                                }
53                            }
54                        },
55                        "Arguments": [
56                            {
57                                "Token": {
58                                    "Token": {
59                                        "type": "INT",
60                                        "literal": "60"
61                                    }
62                                },
63                                "Value": 60
64                            },
65                            {
66                                "Token": {
67                                    "Token": {
68                                        "type": "FLOAT",
69                                        "literal": "0.1"
70                                    }
71                                },
72                                "Value": 0.1
73                            }
74                        ]
75                    }
76                }
77            ]
78        }
79    }
80} '

困っていること・試したこと

JSON.JSON.stringifyでJSON形式を得ようと思ったのですが，この関数を使用すると，
JSON.JSON.stringify("{true}"); // '"{true}"'
のような形で得てしまっているのですが，ほしいのは'{true}'なのでずれが生じてしまっています．
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify

5/4

追記部分のJSONparseの出力結果で，先頭部分にToken.Token.typeにLOOPがあることを想定してJSを書いているのですが，ログを見てみると最初からINTが見えていて，それが原因でif文に入っていないのでは，でもなぜ無くなっているのか分からない，というのが現状です．

該当のソースコード

下部の追記にリポジトリとして関係するファイルはすべて置かせていただいております．
ここに記載していたコードは，追記にて修正を行ったので，質問文の簡潔化を図るために省略しております．

追記

~~JSON.parse(program)にしたときのエラー内容~~
正しい手順かわかりませんが，JSON.stringifyを通したらエラーは消えました．

VM2756:1 Uncaught SyntaxError: "[object Object]" is not valid JSON
    at JSON.parse (<anonymous>)
    at makeAST (script.js:404:24)
    at HTMLButtonElement.onclick (index.html:74:349)

条件の修正

JavaScript
1function traverseAST(node) {
2    let xml = '';
3    // Handle different types of nodes in your AST
4    if (node.Token && node.Token.Token && node.Token.Token.type === "LOOP") {
5        xml += '<block type="controls_repeat_ext" id="T,:lx`qH6`%re*cN8lOx" x="-5" y="23">';
6        xml += '<value name="TIMES">';
7        xml += `<shadow type="math_number" id="GamoPT;mPC@7[FE#B4W!"><field name="NUM">${node.Expression.Condition.Value}</field></shadow>`;
8        xml += '</value>';
9        xml += '<statement name="DO">';
10        xml += traverseStatements(node.Expression.Consequence.Statements);
11        xml += '</statement>';
12        xml += '</block>';
13    }
14    // Add handling for other types of nodes as needed
15    return xml;
16}
17
18// Function to traverse statements inside a block
19function traverseStatements(statements) {
20    let xml = '';
21    statements.forEach(statement => {
22        if (statement.Token && statement.Token.Token && statement.Token.Token.type === 'IDENT') {
23            xml += `<block type="${statement.Token.Token.literal}" id="${generateUniqueId(24)}" x="-5" y="23">`;
24            xml += '<field name="Note No.">';
25            xml += statement.Expression.Arguments[0].Value;
26            xml += '</field>';
27            xml += '<field name="during">';
28            xml += statement.Expression.Arguments[1].Value;
29            xml += '</field>';
30            xml += '</block>';
31        }
32        // Add handling for other types of statements as needed
33    });
34    return xml;
35}

ログ確認

JavaScript
1function makeAST(){
2  var scriptdata = document.getElementById("codeInput").value;
3  scriptdata = changeBackSlashIntoSpace(scriptdata);
4  // console.log(scriptdata);
5  const l = newLexer(scriptdata);
6  const p = newParser(l);
7  const program = p.parseProgram();
8  checkParserErrors(p);
9
10  console.log(typeof(program));
11  console.log(program);
12
13  const JSONobj = JSON.stringify(program)
14  console.log(typeof(JSONobj));
15  console.log(JSONobj);
16  const JSONparse = JSON.parse(JSONobj)
17  xml = makeXML(JSONparse);
18  console.log(xml);
19  return;
20}

console.log(typeof(program));の結果はobjectでした．
console.log(program)の結果

console.log(typeof(JSONobj));の結果はstring
console.log(JSONobj);の結果は次のようになっています．

{"Statements":[{"Token":{"Token":{"type":"LOOP","literal":"loop"}},"Expression":{"Token":{"Token":{"type":"LOOP","literal":"loop"}},"Condition":{"Token":{"Token":{"type":"INT","literal":"10"}},"Value":10},"Consequence":{"Token":{"Token":{"type":"LBRACE","literal":"{"}},"Statements":[{"Token":{"Token":{"type":"IDENT","literal":"play"}},"Expression":{"Token":{"Token":{"type":"LPAREN","literal":"("},"Function":{"Token":{"Token":{"type":"IDENT","literal":"play"},"Value":"play"}}},"Arguments":[{"Token":{"Token":{"type":"INT","literal":"60"}},"Value":60},{"Token":{"Token":{"type":"FLOAT","literal":"0.1"}},"Value":0.1}]}},{"Token":{"Token":{"type":"IDENT","literal":"play"}},"Expression":{"Token":{"Token":{"type":"LPAREN","literal":"("},"Function":{"Token":{"Token":{"type":"IDENT","literal":"play"},"Value":"play"}}},"Arguments":[{"Token":{"Token":{"type":"INT","literal":"0"}},"Value":0},{"Token":{"Token":{"type":"FLOAT","literal":"0.0"}},"Value":0}]}},{"Token":{"Token":{"type":"IDENT","literal":"play"}},"Expression":{"Token":{"Token":{"type":"LPAREN","literal":"("},"Function":{"Token":{"Token":{"type":"IDENT","literal":"play"},"Value":"play"}}},"Arguments":[{"Token":{"Token":{"type":"INT","literal":"0"}},"Value":0},{"Token":{"Token":{"type":"FLOAT","literal":"0.0"}},"Value":0}]}}]}}}]}

console.log(JSONparse);の結果は次のようになっています．

リポジトリ

コードの細かい部分は以下のリポジトリとして置かせていただきます．
https://github.com/snym-yt/testLanguageSettings
index.html, JSPMusicフォルダ, script.js, ASTtoXML.jsが該当ファイルとなります．
「ブロック化」というボタンを押すだけで今回試したいことが実行されるようにしております．

Lhankor_Mhy

2024/04/25 02:21

JSONは文字列なので、『JSON形式』という言葉は文字列を想起させると思います。そのため質問の意図が読み取れず、何度も読み返してしまいました。

otn

2024/04/25 05:11 編集

文字列以外のJSONは世の中に存在しません。おそらくオブジェクトのことを言いたいのでしょうね。 JSON・・・・・'{"aaa": 1, "bbb":2}' オブジェクト・・・{"aaa": 1, "bbb":2} JSONという単語の意味の理解を間違っているのでリファレンスが正しく読めてないのでしょう。 JSONからオブジェクトへの変換は回答のあるとおり、JSON.parseです。stringifyは文字通り「文字列に変換する」です。

juner

2024/04/25 04:29

JSON 上の文字リテラルは " ダブルクォートによって囲うことのみ許可されているので求めているそれはJSONではない何かなのでは？ > 文字列（バックスラッシュによるエスケープシーケンス記法を含む、ダブルクォーテーション"でくくった文字列） https://ja.wikipedia.org/wiki/JavaScript_Object_Notation

juner

2024/04/25 04:37 編集

もしも JSON.stringify({true}); と書いて、エラーになったから JSON.stringify("{true}"); と書いたのでしたらそれは {true} が { true } と認識されているからです。 JSON.stringify({true:true}); であれば動くと思います。それともほしい形は `{true:true}` ではなくて `[true]` だったりしますでしょうか？

aaaa____

2024/04/29 11:30

@Ljankor_Mhy 様分かりにくい表現で申し訳ございません．私の表現したい「JSON形式」というものは， { "Token": { "Token": { "type": "LOOP", ... のように，JSONを書く時に使用する形式のことでした．＠otn 様おそらく私が欲しいのはオブジェクトではなく文字列の方なのですが，なぜ現在の状態でこのような質問をしているのかというと，今の状態でmakeXMLに渡すと <xml xmlns="http://www.w3.org/1999/xhtml"></xml> のように中身のないものが出てきてしまうため，JSONとして想定通り得られていないのではないかと考えていたからです． stringifyではなくparseするというのは私も既に行っていたのですが，そうするとエラーが出てしまって適切に動かなくなってしまったので，欲しいのは文字列だと判断しています．＠juner様本文に書いてあるJSON上の文字リテラルは，仮に表現したものなので，ダブルクォートかどうかは気になさらないでいただけると幸いです．また，実際に使用しているコードもJSON.stringify({true});ではなく，本文に記載したものであります． trueのものは簡単なもので表現するための代替的なものとなっております．

行動規範の内容に同意します

回答2件

ベストアンサー

~~JSON(オブジェクトの文字列表現)を得たいのでしたら、何もしなくてもよいのでないでしょうか。~~

js
1  const JSONobj = program;

~~ただ、コードの雰囲気から察すると、ほしいものは JSON をパーズした JavaScript オブジェクトだと思います。その場合は、パーズしましょう。~~

js
1  const JSONobj = JSON.parse(program);

次のような形で，JSON形式の抽象構文木が文字列の形で得られるのを

ここから間違っているようです。
コンソールのスクリーンショットを見る限り、program の内容はJSONではなく、Program 型の JavaScript オブジェクトです。この問題に JSON は一切関係ないようです。
おそらく、

js
1xml = makeXML(program.Statements[0]);

なんじゃないでしょうか。

投稿2024/04/25 01:55

編集2024/05/04 22:02

int32_t

総合スコア21929

aaaa____

2024/04/29 11:33

現状の const JSONobj = JSON.stringify(program) ですと，うまくXMLに追加されず， <xml xmlns="http://www.w3.org/1999/xhtml"></xml> としかならないため，こちらの想定通りにprogramをJSONobjに入れられてないのではと考え質問した次第です． const JSONobj = JSON.parse(program); とは，質問をする前の時点で試してみてはいたのですが，stringifyの代わりにこうすると，エラーが出てしまいそもそもJSが動かなくなってしまうのでstringifyが適切なのではないかと考えていました．

int32_t

2024/04/29 12:09

JSONが質問文のとおりならば、 if (node.Token && node.Token.type === 'LOOP') { ではなく if (node.Token && node.Token.Token && node.Token.Token.type === 'LOOP') { としないと出力が空になります。

aaaa____

2024/05/04 01:28

追記にも記載させていただきましたが，ご指摘なさった通り，確かに階層が間違っていたのでご指摘のように修正いたしましたが，変わらず空が返ってきていました．他の部分でif文に入らない要因は見当たらず，他にも何か考えられる要因等ありましたらご指摘いただけると幸いです．

int32_t

2024/05/04 01:40

これ以上は再現できる環境がないと助言するのは難しいかもしれません。とにかく、ふつうにデバッグするしかないでしょう。ステップ実行するとか、要所要所で console.dir() で変数の内容を確認するとか。

aaaa____

2024/05/04 11:41

こちらでも引き続き標準出力によって原因を探しますが，追記の箇所に今回の質問に関するファイルをまとめたリポジトリを追加させていただきましたので，もしよろしければご助力いただけますと幸いです．

int32_t

2024/05/04 22:02

回答を更新しました。

aaaa____

2024/05/05 11:20

ご指摘の通りに修正したみたところ，想定通りに動かせることができました． Program型のJSオブジェクトというのは，初めて遭遇したのでまだ理解できておりませんが，調べてみようと思います．丁寧なご回答ありがとうございました．

行動規範の内容に同意します

おそらく私が欲しいのはオブジェクトではなく文字列の方なのですが，なぜ現在の状態でこのような質問をしているのかというと，今の状態でmakeXMLに渡すと
<xml xmlns="http://www.w3.org/1999/xhtml"></xml>

自分の書いたプログラムを読んでない（理解していない）ということですかね？
先を急がず、何をしているのかをちゃんと理解すれば良いのでは？という気がするのですが。

お書きのtraverseAST()は、

if (node.Token && node.Token.type === 'LOOP') {

のif文条件が偽なら空文字列を返します。Token.typeがあることが前提ですが、掲載されているJSONをみると、表しているのは{"Token":{"Token": {"type": "LOOP", "literal": "loop"}}, ～というオブジェクトで、Token.typeはありません。あるのはToken.Token.typeですね。

if (node.Token && node.Token.Token.type === 'LOOP') {の書き間違いなのか、データのJSONの方が間違っているのか、どちらか分かりませんが。

JSON.parse(program)にしたときのエラー内容
VM2756:1 Uncaught SyntaxError: "[object Object]" is not valid JSON

これは、何かやり方を間違ったのでしょうね。正しくparseするとそんなエラーは出ません。
JSON.parse(program)の直前に、console.log(typeof(program));console.log(program);を入れてみましょう。parseしようとしたものがJSONじゃないことが分かるかと思います。

サンプル

JavaScript
1let json_string = `
2{
3    "Token": {
4        "Token": {
5            "type": "LOOP",
6            "literal": "loop"
7        }
8    },
9    "Expression": "後略"
10}`;
11function test(node) {
12    if (node.Token && node.Token.Token && node.Token.Token.type === "LOOP") {
13        return "OK";
14    }else{
15        return "NG";
16    }
17}
18console.log( test(JSON.parse(json_string)) );

投稿2024/04/29 13:21

編集2024/05/04 07:19

otn

総合スコア86295

aaaa____

2024/05/04 02:13

ご回答ありがとうございますおっしゃる通り，あまりコードの内容を理解できていない状態での質問となってしまっていました． JSONの階層はおっしゃる通り間違っていましたので，条件文の方を修正し，質問本文に追記させていただきました．しかし，それでもif文には入っていないようで，空が返ってきてしまいました． parseにつきましては，標準出力を確認し，質問本文に追記させていただきました． JSONstringifyを通した後にparseしてみても返ってくるのは変わらず空となっていました． if文に想定通り入らない要因として他に考えられることはありますでしょうか．よろしくお願いいたします．

otn

2024/05/04 10:57 編集

質問修正部分を見ましたが、みなさんの回答内容が理解できていないようです。「理解しないままで先に進む」ということを止めて、「理解できるまで先に進まない」にしたほうがいいですね。「とりあえずやってみよう」を一旦やめましょう。サンプルを追記しておきます。たとえばこのようなサンプルを自分でゼロから作ってみて、自分の理解の何処が間違っているのか探ります。

aaaa____

2024/05/04 12:07

サンプルとして追記していただいた部分や，基本的なアルゴリズムは質問を通して理解できたと感じてはいますが，追記として掲載させていただいた画像のような，parseしたものの理解がまだ足りていないと感じでおります．今回if文に想定通り行かないのは，この画像の先頭部分に`LOOP`に当たる部分がなぜか無いからなのかもしれないのですが，なぜ無いのかわからないので調べてみようと考えております．

otn

2024/05/04 12:38

オブジェクト ==(stringify)==> JSON文字列 JSON文字列 ==(parse)==> オブジェクトが、きちんと理解できているということが、追記から読み取れませんが、大丈夫ですかね？

aaaa____

2024/05/05 11:33

その部分の遷移についてはおっしゃっているものとして理解しております．試行錯誤の一つとしてあえてstringifyを噛ませているようなかたちになっております．今回の問題については，int32_t様の回答によって原因が特定されました．様々なご指摘ありがとうございました．

otn

2024/05/05 12:13 編集

自力で解決できなかった原因分析は出来ていますか？（＝何が理解できていれば自力解決できたか）結局、JSON以前の問題として、「オブジェクトとは何か」がよく分かってなかったということですかね？

aaaa____

2024/05/12 01:24

はい，理解できていなかったのはオブジェクトが何かというもので，どこに自分が求めていた情報が入っていたのかというものでした．