[[Programing]] > Part1.yaccによるJavascript電卓
つい作ってみたくなりました。とりあえずは、yacc/bison系ツール(kmyacc)を使ったJavascript電卓です。特に、日本語プログラミング言語を作るところまで、たどり着きたいのですが・・・
#contents
*基本的なこと [#v92cda83]
スクリプト言語は、概ねこんな内部構造になっている(はず)。
#ref(summary2.png);
スクリプト言語というソフトウェアは、ソースコードを入れると、ライブラリや入力データと組み合わせて、出力結果を得られるプログラム。その中身は、大きく３つに分かれている。字句解析は、ソースコードの文字を切り分ける。構文解析は、それをコンピュータに分かる命令に変換する。で、それをVM(バーチャルマシン)が実行する。大昔は、リアルなCPUが実行するために、バーチャルマシンではなく、マシン語に変換していたんだけれど、今では、CPUが高性能すぎたり、特定CPUへの依存性をなくすために、こんなふうになっている。
で、スクリプト言語を作るためには、この３つ(字句解析、構文解析、VM)が必要。字句解析は、割と簡単(らしい)。有り物を拾ってくればなんとかなる(だろう)。VMは、他のプログラミング言語でも持っていたり、他の言語自体をVMとして使うとか(つまり、プログラミング言語のトランスレータ／変換器にする)。で、構文解析は、設定ファイルを書くと、yaccが自動変換して構文解析プログラムを作ってくれる。
*kmyaccのサンプルファイルでやってみる [#k25b9d76]
というわけで、スクリプト言語の構文解析プログラムを作るために、yaccの使い方でも覚えてみるかなぁ。ここでは、kmyaccを使って、Javascript製の電卓を作ってみます。
-[[yacc入門:http://www.tokumaru.org/yacc/]]
**実行形式版の入手 [#c7c90e17]
とりあえず、下記からダウンロード。
-[[Flash/Flexで作る俺様言語(kmyacc編)（1）- kmyacc の ActionScript 版を使ってみよう:http://www.hakkaku.net/articles/20080226-154]]
**ソースコード版とサンプルファイルの入手 [#q16522b2]
kmyaccのサンプルファイルは、ソースコード版に収録されている。だから、実行形式版だけ使う場合も、ソースコード版を入手しておいたほうがいいです。
-[[kmyacc - 多言語対応LALRパーサー生成系:http://www005.upp.so-net.ne.jp/kmori/kmyacc/]]
-[[kmyacc ソースコード(4.1.4)>http://www.catch.jp/program/yacc/kmyacc-4.1.4.tar.gz]]
**準備 [#j1e0b713]
kmyaccで、必要なものは以下。
-kmyacc.exe
-cygwin1.dll
-libフォルダ一式
-calc.jsy(Javascript用電卓のサンプルファイル：ソースコード版に収録)
なぜ、電卓を作るのかというと、「3 + 4 * 5」という式があると、掛け算(*)のほうが足し算(+)より、優先順位が高い、というように手頃な例題になるから。ちなみに、kmyaccのJavascriptサンプルには、字句解析のコードも含まれている。
**変換する [#oa2b135d]
では、kmyaccで、サンプルファイル(calc.jsy)を実際の電卓プログラムに変換します。Windowsのコマンドラインで、次のように実行する。
> kmyacc calc.jsy
これで、calc.jsファイルが生成されました。
なおkmyaccは、設定ファイルの拡張子から、以下のルールに従ってホスト言語を推定します。
|yacc拡張子|ホスト言語|出力ファイル拡張子|
|.y|C|y.tab.c|
|.jy|Java|.java|
|.jsy|JavaScript|.js|
|.ply|Perl|.pl|
-[[KMyaccユーザーズガイド:http://www005.upp.so-net.ne.jp/kmori/kmyacc/kmyacc.html]]
**実行してみる [#f0645956]
この「calc.js」ファイルには、Javascript以外にも、すでに必要なコードとかhtmlが組み込まれているので、これを「calc.html」とファイル名を変更してブラウザで開くと、計算できます。ちゃんと、優先順位やカッコも認識してくれる。ただし、整数だけ。
-[[サンプルページ:http://www.catch.jp/program/yacc/calc.html]] 例：1+2*3
計算には、次の記号が使えます。
- + 足し算
- - 引き算
- * 掛け算
- / 割り算
- (...) カッコ内を先に計算する
yaccソースファイルは、こんな感じ。これは、kmyaccのサンプルファイルそのまま(パブリックドメイン)。構文定義の前後に、出力するhtmlファイルやjavascriptも含まれています。
-[[yaccソースファイル:http://www.catch.jp/program/yacc/calc.jsy]]
原理などは、下記が参考になります。
-[[プログラミング言語を作る/yaccとlex:http://kmaebashi.com/programmer/devlang/yacclex.html]]
-[[Bison 1.28マニュアル::http://www.bookshelf.jp/texi/bison/bison-ja.html]] 1章と2章が、よくまとまっている。
*電卓練習 [#l338068d]
上記のサンプルを改良して、いろいろな電卓を作ってみます。
**逆ポーランド記法の電卓 [#sb2fe985]
上記のBison 1.28マニュアルに記載されているサンプルコードを元にして、[[逆ポーランド記法:http://ja.wikipedia.org/wiki/%E9%80%86%E3%83%9D%E3%83%BC%E3%83%A9%E3%83%B3%E3%83%89%E8%A8%98%E6%B3%95]](reverse polish notation)の電卓を作ってみた。
-[[サンプルページ:http://www.catch.jp/program/yacc/calc_rp.html]]
-[[yaccソースファイル:http://www.catch.jp/program/yacc/calcrp.jsy]]
-[[yaccソースファイル:http://www.catch.jp/program/yacc/calc_rp.jsy]]
例：1 5 + 2 3 + *
> 30
この例は、(1+5)*(2+3)と同じになります。
**べき乗と剰余を追加 [#yb48cb07]
最初のサンプル電卓に、べき乗(累乗：^)と剰余(割り算の余り：%)を追加。
-[[サンプルページ:http://www.catch.jp/program/yacc/calc2.html]]
-[[yaccソースファイル:http://www.catch.jp/program/yacc/calc2.jsy]]
2 ^ 3 => 8
7 % 2 => 1
**複数行電卓 [#ua682cbe]
電卓(べき乗と剰余付き)を複数の行で同時に計算できるようにしてみました。
クリアボタンで、計算式と計算結果を消します。
-[[サンプルページ:http://www.catch.jp/program/yacc/calc3.html]]
-[[yaccソースファイル:http://www.catch.jp/program/yacc/calc3.jsy]]
**変数付き複数行電卓 [#teeedb82]
さらに、変数を使えるようにしてみた。わーい、わーい!
変数名には、先頭に半角英字(a-z、A-Z)、2文字目以降に半角英数字(a-z、A-Z、0-9)が使えます。
字句解析も少し修正。
-[[サンプルページ:http://www.catch.jp/program/yacc/calc6.html]]
-[[yaccソースファイル:http://www.catch.jp/program/yacc/calc6.jsy]]
a = 10
b = 20
a * b => 200
**組み込み関数を追加した電卓 [#m3b7f7d2]
また電卓。次の組み込み関数を追加しました。
-test() 引数をそのまま返す
-sqr() 引数の平方根を返す
-rnd() 乱数を引数倍して返す
-[[サンプルページ:http://www.catch.jp/program/yacc/calc7.html]]
-[[yaccソースファイル:http://www.catch.jp/program/yacc/calc7.jsy]]
使い方は、こんな感じ
test(123) > 123
sqr(4) > 2
rnd(10) > 6.290423613972962
カッコ内に、引数を数値で一個だけ書けます。
2個以上の引数の関数は組み込めません。(num1, num2)とか(num1 num2)といった記法に対応していないためです。
実装的には、組み込んだ関数名をメソッドとして呼び出せるようにしています。
----
[[Part2.yaccによるWebスクリプト言語>making_script02]]に続く
*ソース [#qed12373]
-[[ycatch/dandori.js - GitHub:https://github.com/ycatch/dandori.js]]
*参考資料 [#l1457785]
-[[八角研究所 : Series: Flash/Flex で作る俺様言語(kmyacc編) «:http://www.hakkaku.net/series/flashflex%e3%81%a7%e4%bd%9c%e3%82%8b%e4%bf%ba%e6%a7%98%e8%a8%80%e8%aa%9ekmyacc%e7%b7%a8]]
--[[Flash/Flexで作る俺様言語(kmyacc編)（1）- kmyacc の ActionScript 版を使ってみよう:http://www.hakkaku.net/articles/20080226-154]]
--[[Flash/Flexで作る俺様言語(kmyacc編)（2）- kmyacc で BASICっぽい言語を作ってみよう:http://www.hakkaku.net/articles/20080307-158#more-158]]
--[[Shibuya.abcより、携帯電話で遊べる俺様言語を作ってあそぶ(1):http://www.hakkaku.net/articles/20080317-170]]
-[[ParserGenerator - catch.jp:http://www.catch.jp/wiki/index.php?ParserGenerator]]
-[[Rubyで作る奇妙なプログラミング言語~Esoteric Language~:http://www.amazon.co.jp/gp/product/4839927847?ie=UTF8&tag=plaseboeffect-22&linkCode=as2&camp=247&creative=7399&creativeASIN=4839927847]] Amazon
--あなたは「+-><.,[]」の8つの記号しかないプログラミング言語や、空白だけで構成されるプログラミング言語があるのをご存じだろうか。本書では、そんな奇妙な言語(Esoteric Language)を題材にプログラミング言語の作り方を解説します。
-[[Rubyを256倍使うための本_無道編:http://www.amazon.co.jp/gp/product/4756137091?ie=UTF8&tag=plaseboeffect-22&linkCode=as2&camp=247&creative=7399&creativeASIN=4756137091]] Amazon
--Ruby+Raccなら、プログラミング言語開発だって楽しくなる!パーサジェネレータという硬派なネタを256倍流に完全解説。コレさえあれば、キミも今日から言語開発者だ!
-まつもと直伝 プログラミングのオキテ 第6回 メタプログラミング
--http://itpro.nikkeibp.co.jp/article/COLUMN/20070604/273453/
--まとめてみると，Rubyは非常にDSL向きな言語だと分かります。
-Racc で遊ぼう
--Raccで電卓をいろいろ作るチュートリアル
--http://www.mnet.ne.jp/~tnomura/racc.html
-極めよRuby道：第5回 Rubyで書くフロントエンドとパーザ
--http://www.notwork.org/~gotoken/mag/cmagazine/gokudo/5th/
-[[プログラミング言語を作る:http://kmaebashi.com/programmer/devlang/index.html]]
-[[ウノウラボ by Zynga Japan: 1時間で作る簡易スクリプト言語(JavaScript):http://labs.unoh.net/2007/03/1javascript.html]]
-[[Route 477 - Rubyで広がる日本語DSLの世界！！:http://route477.net/d/?date=20081020]]
-[[Groovyの日本語DSL - Grな日々(uehajの日記):http://d.hatena.ne.jp/uehaj/20091017/1255747730]]
-[[Groovyで日本語DSL再び(＋GEP3の解説) - Grな日々(uehajの日記):http://d.hatena.ne.jp/uehaj/20100919/1284906117]]
-[[人気の言語を作るには - Being Popular:http://practical-scheme.net/trans/being-popular-j.html]] ポール・グレアム
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
