ろばQ日記2003年07月RobaQ's Diary 2003-07

07月04日

7月になったら思いつきで更新を再開しようと前々から思っていたので再開 (結局どっちよ)。

window.onload に後から関数を付け足そうとしてあれこれ考えてみる

やりたいこと

  1. javascript で DOM を使って HTML 文書を処理したいが、文書読み込み中だと処理が正常に終了しない。
  2. window.onload を使って文書読み込み完了後に処理を開始する場合、複数の外部ファイルで window.onload を記述すると、次々上書きされて最後に代入された関数しか実行されない。
  3. 試しに window.onload = window.onload + appendFunction; とか window.onload += appendFunction; とかして見たが駄目だった。
  4. 対策として特定の関数を定めて window.onload に代入する方法を思いついたが、これはこれで使用する javascript の組み合わせ毎に特定の関数を記述する羽目になり、無駄も多ければ保守性も極めて悪い。
  5. で、エントリポイントに関数の名前だけ予約 (?) しておいて、実際処理する時に同名関数で上書きする方法を考えたが、新しい関数を追加する度にエントリポイントの編集が必要となるなどあまり保守性に優れていなかった。

と言う訳で (長いぞ!) 要するにある関数別の関数を足す関数を作ってみました。

function appendFunction(oldFunction, addFunction){
    return function(){
        if(typeof(oldFunction) != "undefined" && oldFunction !== null){
            oldFunction();
        }
        addFunction();
    };
}

しかし、もっと手際の良いやり方は無い物か……。例えばwindow.onload.appendFunction(addFunciton);みたいな感じで (Object や window に直接メソッドは追加出来ない様なのでこの例は無理っぽいですが)。 < Objectにプロパティなどを追加するのは可能。出来ない様なのでは筆者の誤り。

あと、本題とは関係有りませんが、windows.onload の初期値を Mozilla は未定義型、InternetExplorer は Null 型としておりどちらが正しいのかわからないのでとりあえず両方とも対応 (いい加減)。

むぅちゃんと宇宙と超多胞体

むぅちゃん曰く宇宙の外は同一の宇宙で充填されてる……らしい。

  1. 宇宙は無から生まれた。
  2. 無にはあらゆる条件、状態が無い。全ての無は同一視出来る。したがって無があると同一の宇宙が生まれる。
  3. 無から宇宙が生まれたとき、単一の宇宙で無が充填 (?) されないなら、残りの無 (?) が有る限り同一宇宙が発生する。
  4. 無が充填されつくされるまで完全同一の宇宙が発生するので宇宙の外は同一の宇宙で充填されている。

そもそも時空が存在しない無は充填するような対象なのか、無に我々の認識する再現性は存在するのか、って言うかそもそも宇宙に外が有るのか。

解かったような、解からんような。どうも途中から時空が存在しないが充填可能な4次元以上の空間扱いになってる辺りがどうも嘘臭い。

07月05日

昨日間違えてろばQ屋本舗のルートディレクトリ (https://robaq.info/) に index.xhtml を置いてしまいました。が、間違いなので再び削除。

影響を受けた方がいらっしゃったら申し訳ないです。

javascript の正規表現の覚書

ろばQ屋本舗のルートディレクトリインデックスを判定する為に javascript を使って正規表現で "^http:\/\/(.+@.+:)?www\.netlaputa\.ne\.jp\/~robaq\/(index.html)?[\?$]" と書いたら、Mozilla Firebird 0.6Internet Explorer for Windows 6も末尾のパタンをマッチしてくれない。

2つのJavaScriptエンジンが両方ともマッチしないって事は恐らく自分の間違いだろう、と今度は "^http:\/\/(.+@.+:)?www\.netlaputa\.ne\.jp\/~robaq\/(index.html)?(\?|$)" と書いたら Firebird は意図通りのマッチングをしてくれるが、今度は IE正規表現で構文エラーがありましたと言い出した。

どうもエスケープ周りが怪しい (ろばQの)。

07月06日

暗黒星雲のこちら側から電波を送ってくださる名状し易いモノ様を果たしてなんとお呼びすれば良いやら検討していたら一日過ぎてしまいました。

ちなみに嘘ですが (この様にろばQはちなみにを間違って使いますので注意が必要と言うお話 < ハァ?)。

RPG じゃないけど RPG

最近 Game Boy ADVANCE で MOTHER 1+2 をやっておりまして、やっぱり名作だなぁ、と思うろばQであります。

所で MOTHER のどこら辺が名作なのか。これが 2 のプレイ当時なら名作 RPG とか言っちゃってた訳ですがその後那珂川さんを初めとして色々な所で色々と影響を受けまして、RPG の定義とかに拘る用になってしまいましたので今更名作 RPG とは言えないろばQであります。

そもそも MOTHER シリーズはロールプレイングゲームか、と聞かれると答えに詰まるろばQであります。ロールプレイング以前に、ゲームか、と聞かれても、怪しいな、と思うろばQであります。MOTHER はユーザの判断を必要とするので本の頁をめくる様に何にも判断せずにボタンを押して行けば物語が進行するか、と言われればそれは違います。プレイヤは今まで手に入れた情報を元に行動を起こして物語を進行させますので、ゲーム性とか、或いはパズル性が皆無か、と言われれば皆無ではないのでありますが、でもゲームの部分が娯楽性とかその他優れている訳でもなく、ゲームとしては評価出来ないほど評価は低いと言わざるを得ないのであります。念の為に申し上げますと、それはゲームバランスの調整に失敗しているとかプログラマがヘッポコとか言うわけではなく寧ろその様な意味では一流の仕事がなされていると思うですが、それ以前の次元としてゲームとしてはどうか、と思っちゃうろばQであります。

じゃあ、例えゲーム性が低くても、物語部分が優れているあたりが名作なのか、と聞かれるとやっぱり答えに詰まるろばQであります。ろばQは MOTHER の物語の部分を非常に高く評価しております。と言うか名作とろばQが評価している部分の大部分であります。例えば同じシステムに同じ絵描きが絵を提供して、同じ作曲家が作曲した曲を乗っけても糸井重里以外の人がシナリオライタをやっていたら多分駄目なのであります。勿論 MOTHER より優れた物が出来るかも知れないのですが、少なくともそれは MOTHER ではないのであります。でも、じゃあ、糸井重里原作で小説が書かれたとしたらそれは MOTHER ですか、と聞かれると、それは多分 MOTHER になると思うのですが、でも何か違うのであります。例えば音がない。ないので小説化案を棄ててラジオドラマ化案だと思うことに致しますと今度は絵が無い。そんでじゃあアニメ化しましょう、インタラクティブ性を付けましょう、初期のウルティマみたいなインタフェースを付けましょう、所期のウィザードリィみたいな戦闘画面を付けましょう、と為ると、結局ファミリィコンピュータ用、或いはスーパーファミコン用、そしてその移植版の Game Boy ADVANCE 用ソフト MOTHER に為ってしまうのであります。そしてその様なメディア或いはインタフェースで提供される作品は一体なんですか、と聞かれると定義とは違うんだけれど、やっぱり RPG という事になってしまうのであります。少なくともプロデューサの糸井重里さんや販売元の任天堂や流通業者や小売業者や報道や多くの消費者はそれを RPG と呼ぶのであります。っていうかその、定義上 RPG とは呼び難いのだけれども RPG と呼ばれている物の RPG 以外の呼び方をろばQは存じ上げないのであります。

しかし、区別したい。少なくともここに区別の必要性を感じて新名称を必要としているろばQが1人居るのであります。もし世界が100人のろばQの村だったらなんと100人が100人とも必要としているのであります。ネタが古い上に面白くもなんともないのであります。そこでコンピュータゲームとか家庭用ゲームとか、或いは電子絵本とか、インタラクティブアニメとか色々考えてみたのですがどうもしっくり来ません。どうもろばQにはこの手の命名センスが無いようなので、第三者のセンスを取り入れましょう、と言う事で、第三者とか言っておきながら身内で申し訳ないのですが、ろばQが幼少の頃に母親が言っていた命名を採用して MOTHER は名作 RPG ですというろばQの評価を RPG の定義に抵触しない形で言い直して見たいとおもいます。

MOTHER は名作ピコピコです。

これだけの字数を費やして、結局拙者のお頭の悪さしか読者に伝わりそうに無いのが大変に残念無念な今日この頃。

07月07日

HTML と XML の ID の値

とある場所で ID の値の文法違反を見つけたので定期的に pop する ID の1文字目に数字使っちゃ駄目、と言う話題をば。

ってな訳で詳しい方は読み飛ばし可、若しくは突っ込み歓迎と言う事で。

HTML 4.01 の ID 及び NAME 要素の値

ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").

と言う訳で HTML 4.01 及びその互換 (?) XML (要するに XHTML 1.0 と XHTML 1.1) では ID の一文字目は大文字または小文字の1Byteのアルファベットでなければなりません。

XML 1.0 (Second Edition) の定義

Values of type ID must match the Name production.

Namespaces in XML の定義

An XML document conforms to this specification if all other tokens in the document which are required, for XML conformance, to match the XML production for Name, match this specification's production for NCName.

XML の場合 XML 1.0 (Second Edition) の定義を Namespaces in XML が上書き (仕様間の細かい上書き順序には疎いのでこの部分間違っていたら突っ込んで下さい (そんなあやふやな知識で他人に誤りを指摘するような文章かくなよ > 拙者)) しておりまして、最終的には NCName ::= Letter | '_') (NCNameChar)* /* An XML Name, minus the ":" */となっておりまして、要するに一番厳しい HTML の [a-zA-z] にして置けば無難でありゃーす (ろばQさん、解説になってません!)。

つうか、一度と言わず二度三度、勉強しなおせ > 俺。

07月15日

色々立て込んで参りまして、色々立て込んでおります。再開した物の日記の更新も疎ら。あとまぁ、風邪を引いて土日を潰したり、月曜日会社を休んだりとか。

コーディングが開始されているのに (スパイラルとか反復型とか言うレベルではなく) 機能そのものが丸ごと追加されたり、データベースの構造が2転3転するのは如何な物か。

正規表現のエスケープ

ソフィアさんより正規表現リテラルを使うかバックスラッシュをエスケープするか。と言うご助言を頂きまして処理上は解決致しました。ありがとうございます。とりあえず現在 Boolean(document.URL.match("^http://www\.netlaputa\.ne\.jp/~robaq/(index\.x?html)?(\\?|$)")) で意図通りの判別が可能に為りました。

なんですが……どうしてエスケープ文字をエスケープすると解決するのかよく解かってません。

まず前回の"^http:\/\/(.+@.+:)?www\.netlaputa\.ne\.jp\/~robaq\/(index.html)?(\?|$)"の通常のスラッシュをエスケープしようとしているのはご愛嬌として (< ご愛嬌で済ませるなよ) 正しくは (といってもこの段階では意図通りの結果がでませんが) "^http://(.+@.+:)?www\.netlaputa\.ne\.jp/~robaq/(index.html)?(\?|$)"

でまぁ、ルートディレクトリ ("^http://(.+@.+:)?www\.netlaputa\.ne\.jp/~robaq/") 迄は良いとして (……あ、プロクシ経由とか考慮してねぇや……これはこれで直さねば) 問題はディレクトリインデックスの部分。.htaccess の記述は DirectoryIndex index.xhtml index.html なので"(index\.x?html)?" があって (あ、拡張子の"x?"が抜けてた) そこで行末になるか、或いはパラメタの ? が来ればルートディレクトリィ確定って事で "(?|$)" と書きたい所を ? はメタキャラクタなのでエスケープして "(\?|$)" で上手く行かず (ここ迄が前回の状態)、助言に従って更に \ をエスケープさせ (\\?|$) とすると上手く行く。……でも "\\?" だと \\ が \ になって \ が0か1文字と言う解釈になってしまうのでは有るまいか…… (でも前方参照を用いて "\\?" を取り出せば、しっかり "?" にマッチしているのであった)。

うーん、一応リファレンスとか読んで見たんですが解かんねぇなぁ…… (こう言う場合、実はちゃんと読んでいなかったが殆どの原因)。

window.onload に後から関数を付け足そうとしてあれこれ考えてみるその2

  1. 複数の外部 javascript に分かれた複数の関数を window.onload で実行 (1)

  2. Re: 複数の外部 javascript に分かれた複数の関数を window.onload で実行

  3. 複数の関数を window.onload で実行

  4. 2003/07の Past topics 9th day

  5. 複数の外部 javascript に分かれた複数の関数を window.onload で実行 (2)

  6. 2003/07の Past topics 10th day "一意な関数名"

  7. javascript と closure

ねこめしにっきに取り上げて頂いたお陰で (直接ろばQに、という訳では有りませんが) さとみかん方面から反応が。

一番目から鱗だったのは、ご本人は古いブラウザじゃ動かなかったりするのが鬱なので今回の件では選択肢に入らないと、流している window.addEventListener("load'", func, false)。アレ、こんなの DOM にあったっけ? などと阿呆な事を思ったのですが、そう言えばろばQが普段読んで解かった気になっているのは DOMDOM でも DOM Core のみ。せいぜい DOM XML 1.0 とか DOM HTML 止まりで (つまり Level 1 相当の構成) DOM Events とか全然知らない事を自覚。これは勉強せねば、とDOM Activity Statementを読んでみるも、その種類のあまりの多さに見なかった事に (いえ、その内勉強しますが……)。

このお話、最終的にはこの DOM2 Events を用いるか、或いは PaGe さんの示した例のように自分で関数追加関数を用意するか、という事になりそうなのですが、ろばQとしてはとりあえず皆様の例を参考しつつ、既に DOM2 を使っている関数に関しては DOM Events を利用、そうでない場合は拙作関数追加関数にて既存の windlow.onload に関数を追加で対応していく事に致します。

なにはともあれ有難う御座いました > 各位。(ろばQの用途だと) たかが日記を書く程度に勉強する事だらけだなぁ……。

Document Object Model を使うと何がうれしいのか

本日の日記で色々素人っぷりを発揮しているろばQで御座いますが、ろばQの理解している範囲できょ~そさんの2003年07月08日の日記の "DOM" に反応。

えーと、なんか、これ使うと便利らしいです。まだぜんぜんよくわかってません。何が出来るの? なレベル。更新やサイト管理が楽になればそれでいいんですが、今日は一日これだなー

結局 javascript をイチから学ばねばならないらしい。めんどいなあ。

仕事は C なのに、プライベートでは C を書く機会がない。

DOM の大元の発想は、HTML 文書や XML 文書の木構造を documentっつー Object として、いろいろ標準メソッドとか定義して処理出来るようにすれば便利じゃね? ってな事で (……だと思う……) HTML や XML 文書を Document と言う Object の型 (Model) として扱えます。……っていうかそのままです。……説明になってないです > 俺。

んで、何が出来るか、と言うと document を object ととして扱える訳で………えーと………例えばろばQは meta 要素で記述していて人間がわざわざ body 要素内に再記述するのも面倒な部分の再記述作業を javascript + DOM に任せたりしております (以下、そんな感じの javascript + DOM)。

function writeCopyright(){// Copyright の記述
    if(document.getElementById("copy")){// copy という Id を持った要素の判別
        var copySection = document.getElementById("copy");// あればそれをcopySectionを看做す(それがsectionになりえない要素かも、と言うのはとりあえず考慮しておらず)
    } else {
        var copySection = document.createElement("DIV");// なければcopySectionとして DIV 要素を作る
        copySection.setAttribute("ID", "copy");// 作ったcopySectionにID属性としてcopyを設定
        document.getElementsByTagName("BODY")[0].appendChild(copySection); // copySection を BODY 要素の子要素に加える
    }

    var metaElements = document.getElementsByTagName("META");// meta 要素の node list を作成

    for(var i = 0; i < metaElements.length; i++){// metaElements の中を探索
        if(metaElements[i].getAttribute("name") == "copyright"){// meta の name 属性が copyの物を探す
            var addressElement = document.createElement("ADDRESS"); // copyright を記載する address 要素を生成
            addressElement.appendChild(document.createTextNode(metaElements[i].getAttribute("content"))); // address 要素の内容として、meta 要素の content を設定
            copySection.appendChild(address); // copySection の子要素として、addressElement を設定
        }
    }
}

まぁ、覚えるといろいろ文書を加工したり、機械的な変換が出来ますよ、と。

なお、DOM は飽くまで文書を document と言う object として扱う為の規格なのでオブジェクト指向言語との相性が良く、JavaScript に限らず、JAVA やら C# などでも使えます。

正しい HTML で文書を書かねばならない理由必ずしも 正しい HTML 文書でなければならないのか

HTML であるならばそれは仕様に従った正しい HTML である必要があると思いますが、そもそも HTML である必要がなく、それ故に正しい HTML にする為に文書を markup するのが面倒な場合、そもそもHTML文書である事を辞めるのが良いのではないかと。

当初、見出しと内容の乖離が激しかったので見出しを改めました。

07月16日

これでMozillaはあと2年は戦える?

Mozilla.orgによれば独立非営利組織 Mozilla 財団Foundationが設立され、To help launch the new organization, America Online has pledged $2 million in cash to the Mozilla Foundation over the next two years. (ろばQ訳: AOLは Mozilla 財団Foundation 設立の援助金として2年で200万アメリカドルの出資を約束) だそうです。

AOLとMicrosoftの和解により (Mozilla のソースから作られる) Netscape はもうおわりなのかなどと言われていた訳ですがとりあえず資金面での目処が立った模様 (いつかなくなりますが)。また、組織体制に変化が発生しつつありますが (参考: AOL、Netscape従業員の10%をレイオフ) 当面は現状通りの成果物を期待出来そうです (酷い話ですが、ろばQが興味が有るのはその成果物であってオープンとかフリーとか、或いは Anti Microsoft という部分にはあまり興味が無い。勿論、オープンだったりフリーだったりする事による成果物に関してはその開発手法や思想を含めて評価しますが)。

話は逸れますが、久しぶりに Mozilla.org を見たらデザインがやたらハイカラに成っていて吃驚。ボーダーレスな白い (明るい) 画面には非常に好感が持てます。また (初めての人が恐らく一番評価する) スクリーンショットが前面に出ている点も良 (参考: Mozilla.org 2003年07月16日のスクリーンショット (但し 256色に減色済))。しかし、その中身はtableレイアウト。どうも、標準規格準拠の旗手として自覚が足りないのでは?

当初 Mozilla FoundationMozilla 財団と訳したのですがもじら組の訳ではそのまま Mozilla Foundation となっていたので、モジラ組みに合わせて修正。

エスケープのエスケープ

正規表現のエスケープ

どうしてエスケープ文字をエスケープすると解決するのかよく解かってません。とのこと。それは正規表現型ではなくてString型だからです。そのStringが正規表現に変換される際に、バックスラッシュはエスケープ文字として消費されます。ですからhttp://www$netlaputa$ne$jp/~robaq/index$html こんな文字列もマッチしてしまうはずです。多分。

唖々。納得。

最初に正規表現リテラルを使うかと仰っている所を無視して何が解かってませんだ > 俺。

ありがとうございました。

07月18日

独りウォークスルー

ウォークスルー [walk through]

元は演劇用語で演者が監督や演出者に助言を仰ぐ立ち稽古の事で、プログラミングでは問題の早期発見や品質の向上などを目的とした (一般的に) 少人数、短時間のレビューを言う。

一般的に少人数、短時間であり、また管理者を含まない非公式な場合も多い。

先日の正規表現の事も有るので、独りウォークスルーことおもちゃのアヒル法(或いは、あひるたいちょー法)) で拙作 javascript の debug とパフォーマンスアップ作業。

問題点、出るわ、出るわ

一から書き直せとか、ボケとか、アホとか、死ねとか、兎に角我が家のあひるたいちょーはクチが悪いのが特徴です。やっぱりティムバートン作品だからか?

07月19日

第4の方法

re: 2003/07の Past topics "19th"

var value = "value is GLOBAL";

function Constructor() {
    var value = "value is LOCAL";
    this.func4 = new Function("alert(value);");
}

var instance = new Constructor();
instance.func4(); // popups "value is GLOBAL"

動的に Function を new してみたら、やっぱり GLOBAL でした 。これが一体どんな時に役立つかと申しますと……思い付きでやってみただけなので良く解りません。ローカルな所からグローバルな値を取り出すときに使えない気がしないでもないですが、new するとその都度メモリ領域が確保されるので度々実行されるような場合は駄目だろうなぁ、やっぱり。

あひるたいちょーに相談してみるか……。

07月30日

javascript にはカプセル化が無い事に関する対応

一見先日の第4の方法の続きの様で実は殆ど別の話。

で、結論から言うと、自分しては特にメンバ変数のカプセル化には拘らない方向で。つまり、関数外から object.property = value; として本来 (C# で言う所の) private で在るべきプロパティが変更されてしまうかもしれない憂いを絶つ事よりも、その時々の可読性などを大事にする方向で。

例えば piro さんのように XUL でアプリケーションのインタフェースを作ったり、それを公開したりしている場合にはこの種の問題は憂慮すべきと思うのですが、ろばQみたいな自分管理のweb siteが UA で開かれたとき、該当 window オブジェクト内の局所変数としてのオブジェクトのプロパティの公開だったら最悪でも UA がフリーズしたり強制終了起こす程度なので (それはそれで大問題ですが) コーディング上の利便性や可読性を優先する方向で。

と、非常に可読性の悪いスパゲッティコードを書きなぐっている奴が結論しても説得力は全く有りませんが。

ちなみに、局所変数化可能なものまでわざわざ可読性の為にオープンにしろ、とか、そう言うつもりは毛頭有りませんので。念のため。

最近の買い物

R-TYPE FINAL

プレイ時間 25 時間ほどで開発済み機体は約70機。バイド図鑑コンプリート。AI 対戦は殆どやってない (機体出し優先)。

全ステージクリアするだけなら) 恐らく R-TYPE シリーズ中最も難易度の低い (けれど、ろばQ程度の実力ではコンティニュでゴリ押ししないとBABYモード (最も難易度が低い) のクリアもままならず)。

net上で機種限定AI戦など出たら面白そう。

Visual C# .NET 2003

購入後に自分の需要はEclipseで十分満たせるような気がしてきたのは気のせいと言う事で。

これで自宅でも仕事が……したくない……。

JavaデベロッパーのためのEclipse導入ガイド (ISBN4-7973-2411-2)

と言う購入。Java 開発技術者でもないくせにJavaデベロッパーのためのEclipse導入ガイド。途中で投げ出す気満々。

Happy Macintosh Developing Time (ISBN4-8936-9977-6)

実際にMacで何か書くかどうかは別として……。と言うかScript覚えるほうが先の気もする > 俺。

プログラマ向けの HTML の class 属性に物理的な値を格納しない方が良いです、と言う話

例えばC#で要素数10の配列 myArray を宣言すると以下の要な感じ。

int [] myArray = new int [10];

この時myArrayの要素数 = 10と言う数字を各所で使いまわす為に定数化するとするなら次の内、どちらの方がいいだろうか。

  • private const int TEN = 10;
  • private const int MY_ARRAY_LENGTH = 10;

これは、myArrayの要素数が10以外の値になる可能性を考えれば明白だが、定数の名前は TEN よりも MY_ARRAY_LENGTH の方が相応しい。

また、名前は別にして値が10となる場所に無秩序に上記の定数を使うと、その内1つが10以外の値を取る事になった場合、プログラマが一つ一つ変更すべき値と、変更すべきでない値を改めて判断する必要が生じ、保守性に致命的な問題を発生させる。仮に5種類の定数10が有るならば5つの定数が宣言されるべきである。

HTML の class もこれと同じで、たまたま赤い字 (CSS で言う所の color:red;) だからと言って class名を RED などとすべきではない。また、たまたま同じ設定だからと言って、異なる意味合いの要素に対して同じclass名をStyleSheetsのセレクタとして使い回すべきではない。

逆に言えば、必ずであり、そのものに意味があり、文書としてと言う情報が失われるべきではない場合、下手に class="red" などとするくらいなら、いっそ物理要素や物理属性、或いは直接 sytle 属性を記述すべきである。少なくとも CSS ファイルとの分離により意味が失われる危険は回避される。例えば水分子を表すH20 の下付き文字 "2" は、下付き文字で有る事に意味が有るのだから下付き文字の要素 sub を用いて H<sub>2</sub>O と書かれるべきであって H<span class="sub">2</span>O とするべきではない。