タグ

ブックマーク / nanto.asablo.jp (22)

  • JavaScript の変数と delete 演算子: Days on the Moon

    Kanasan.JS JavaScript 第 5 版読書会 #1 にて delete 演算子の動作が話題に上ったそうです。そこで、それについてちょっとまとめてみようかと思い立ったはいいものの、ずるずると引き伸ばしているうちに年を越してしました。しかし、読書会 #2 の開催も決まり、もうこれ以上引き伸ばしているといつまでたっても書けなさそうなので、いい加減腹をくくって個人的にまとめてみようと思います。 JavaScript の変数 delete 演算子の対象 変数に対する delete 演算子 削除できるプロパティとできないプロパティ 変数の属性 delete 演算子の返り値 JavaScript の変数 delete 演算子の話に移る前に、変数とは何なのかおさらいしておきましょう。JavaScript において、変数とはプロパティの別名です。といっても、すべてのプロパティを変数というわけ

  • JavaScript で構文解析: Days on the Moon

    C++ の特徴のひとつである演算子オーバーロード、その粋を極めたのが Boost Lambda (無名関数) と Boost Spirit (構文解析) ではないかと思っています。JavaScript では無名関数が使えるので Lambda に関しては間に合っているとも言えますが、Spirit はそうも行きません。JavaScript 2 で演算子オーバーロードがサポートされるのならチャレンジしてみようかななどと思ってそれきりになっていました。 しかし、一部でパーサブームが起こっているというのを受け、Perl 6 Rules をつらつらと眺めているうち、正規表現のメタ文字を使えば文法定義をきれいに書けるのではと思い至りました。そこで実際に JavaScript でパーサジェネレータを作り、Spirit にあやかって Gin (ジン) と名づけてみました。 文法定義 正規表現リテラルを使うこ

  • オレオレ言語の MIME タイプ: Days on the Moon

    「OreScript時代の幕開け - yukobaの日記」を筆頭に、JavaScript によるプログラミング言語の実装が流行っているようです。オレオレ言語はその名のとおり各人が好きに作るものですが、それらの言語を識別する MIME メディアタイプ (以下 MIME タイプ) に関してはちょっと違います。他人のつけた MIME タイプと競合してうまく動かないといったことのないよう、意識して設計しなくてはいけません。 MIME タイプの仕様 MIME に関連する規格は多数ありますが、MIME タイプに関して重要なのは RFC 2046 Multipurpose Internet Mail Extensions (MIME) Part Two: Media Types と RFC 4288 Media Type Specifications and Registration Procedure

  • JavaScript で n 進数を扱う: Days on the Moon

    2 進数や 16 進数を使いたいというとき、JavaScript では組み込みの機能を利用できます。使えるのは 16 進数だけではなく、2 進数から 36 進数 (0 ~ 9 および a ~ z を使用) まで扱えます。 n 進数文字列から数値への変換 n 進数文字列から数値へと変換するときは、parseInt 関数を使います。第 2 引数に基数 n を指定することで、第 1 引数の文字列を n 進数であると解釈してくれます。n は 32 ビット整数に変換され、その値が 2 未満または 36 を超えるときは NaN が返ります。ただし、n が 0 になるときは文字列が 10 進数表記であるとして解釈されます。 parseInt(10, 36); // 36 parseInt("10", 0x100000000 + 36); // 36 基数が明示されておらず、文字列が 0 から始まっていた

  • E4X in Firefox 発表資料: Days on the Moon

    Mozilla Party JP 8.0 に講師として参加させていただきました。以下はプレゼンテーション用のスライドです。 E4X in Firefox (PDF) E4X in Firefox (HTML) OnpenOffice.org 2.0 の Impress を使って作ったのですが、私のノート PC のディスプレイ接続がうまくいかず、お借りしたマシンに入っていた OpenOffice.org 2.1/2.2 ではなぜか実行途中にフリーズするので、PDF にエクスポートしたものを用いました。 また、発表は 25 分の枠だったのですが、最初に練習したときは 1 時間かかってしまい、話す内容をいろいろと削ったものの、結局枠ぎりぎりまで使い切ってしまって、質疑応答の時間をとることができませんでした。もし何か聞きたいことがあったという方がいらっしゃれば、このコメント欄にお願いします。 それ

  • 作って納得! DOM 2 Events: Days on the Moon

    ブラウザ上でのプログラミングで避けては通れないのがイベント処理。その仕組みは DOM Level 2 Events にて規定されています。しかし、とりあえず addEventListener メソッドを使ってはいるものの、それがどのような意味を持つか詳しくは知らないといったことはありませんか。そこでここでは、DOM 2 Events のイベントモデルを理解し、ブラウザが裏で何をしているのかを把握するために、実際にそのイベントモデルを実装してみることにします。具体的には、仕様書に定められたインターフェースを JavaScript で実装し、それらを組み合わせてイベントの発生をシミュレートしてみます。 Event インターフェース EventListener インターフェース EventTarget インターフェース DocumentEvent インターフェース DOMException イン

  • 再帰クイックソートの可視化: Days on the Moon

    「いやなブログ - JavaScript でソートアルゴリズムを可視化」より。何も考えずに再帰処理のクイックソートの様子を逐次描画しようとするとこうなります。 function quickSort(data, begin, end, log) { if (begin >= end) return data; var pivotPos = begin; var pivot = data[pivotPos]; for (var i = begin + 1; i < end; i++) { if (data[i] < pivot) { var temp = data[i]; data[i] = data[pivotPos + 1]; data[pivotPos + 1] = data[pivotPos]; data[pivotPos] = temp; pivotPos++; } } log(da

  • Enhanced Feed Preview 0.1 公開: Days on the Moon

    「Another 朝顔日記 - Enhanced Feed Preview」で提案されていた Firefox の拡張機能、Enhanced Feed Preview を作成、公開しました。Firefox 2 ではフィードを表示する際組み込みのプレビュー画面が用いられますが、この拡張を使うとフィードが製作者スタイルシートを持っていればそれを使って表示するようになります。 このバージョン 0.1 はベータ版です。メニュー項目名など改善案があればどんどんお寄せください。ある程度機能、UI が固まったら 1.0 として Firefox Add-ons にも登録するつもりです。なお、現時点では日語ロケールしか含まれていません。 Enhanced Feed Preview 0.1 通知バーのラベルが「このフィードを購読する」となっていますが、「フィードを表示しています」のほうがいいような気がしてきた

  • JavaScript の new 演算子の意味: Days on the Moon

    JavaScript における new 演算子の動作は大まかにいって以下のとおりである。(new F() とした場合。) 新しいオブジェクトを作る。 1 で作ったオブジェクトの [[Prototype]] 内部プロパティ (__proto__ プロパティ) に F.prototype の値を設定する。 F.prototype の値がオブジェクトでないのなら代わりに Object.prototype の値を設定する。 F を呼び出す。このとき this の値は 1 で作ったオブジェクトとし、引数には new 演算子とともに使われた引数をそのまま用いる。 3 の返り値がオブジェクトならそれを返す。そうでなければ 1 で作ったオブジェクトを返す。 ここで「オブジェクトである」というのはプリミティブ値 (文字列、数値、真偽値、undefined 、null) ではないということだ。new Stri

  • 任意の引数の束縛: Days on the Moon

    前回 JavaScript での引数束縛を扱った際には引数リストの先頭からの束縛だったが、ななしさんによる Array#splice を使った方法を応用すれば任意の引数の束縛も比較的簡単な形で書ける。C++ には bind1st 、bind2nd というのがあるそうだが、それと同じようなことができるわけだ。 Function.prototype.bindNth = function (/* n, arg, ... */) { var self = this; var args = arguments; args[0]--; Array.prototype.splice.call(args, 1, 0, 0); return function () { Array.prototype.splice.apply(arguments, args); return self.apply(this,

  • userChrome.js 用スクリプト: Days on the Moon

    userChrome.js にずいぶんお世話になっていると書いたので、現時点で私が使っている userChrome.js 用スクリプトを公開。必要最低限の機能に絞り込める、細かいところに手が届くのがいいところ。 UCJS Loader Sub-Script Loader の改良版。UTF-8 マルチバイト文字、JavaScript 1.7 の機能が使用可能に。Build ID 20070109 以降の Trunk では Bug 364692 修正の影響で (?) 動作しなくなっているようです。Sub-Script Loader なら問題はありませんが、日語文字をそのまま使いたいといった場合にはバグ対応版をどうぞ。(少々トリッキーな手段でバグを回避しているので、最新の Trunk を使っている人以外は通常版を使ってください。) 原因となっていた (?) バグはすでに修正されており、バグ対応

  • JavaScript でのたらいまわしいろいろ: Days on the Moon

    IT戦記 - JavaScript で遅延評価」より。遅延評価といえばたらいまわし関数と相場が決まっている、ような気がする。 function tak(x, y, z) { return (x <= y) ? y : tak(tak(x - 1, y, z), tak(y - 1, z, x), tak(z - 1, x, y)); } これを元記事に従って書き直すとこうなる。 // from http://d.hatena.ne.jp/amachang/20061204/1165180769 Function.prototype.lazy = function () { return { valueOf: this }; }; function takL(x, y, z) { return (x <= y) ? y : takL(takL(x - 1, y, z), takL(y -

  • IE 7 を判別する JavaScript コード: Days on the Moon

    Abe Fettig’s Weblog » Detecting IE7+ in Javascript (日語紹介記事) にて style.maxHeight プロパティを用いた IE 6 と 7 の判別方法が紹介されている。ただ、この方法だと IE とそれ以外を判別するためにもう一手間かけなくてはいけないので、IE 7 以上だけを判別できるようにしたのが以下。 if (typeof document.documentElement.style.msInterpolationMode != "undefined") { // IE 7 or newer } else { // IE 6 or older, Gecko, Opera, etc. } IE 7 から実装された独自 CSS プロパティ、-ms-interpolation-mode を利用。画像を拡大するときの補完方法を指定するも

  • tabindex とフォーカス: Days on the Moon

    レイアウトを動的に変更する際にはアニメーションをつけたほうがいいかもしれないけど面倒くさいといっていたのだが、物は試しとつけてみた。JavaScript が有効ならば pre 要素の幅切り替えのサンプルや右に出ている「メニューを文の右側に表示」チェックボックスでその効果を確認できる (IE 5.5 以前など古いブラウザでは表示されない) 。わかりやすくなったのかうっとうしくなったのか、はたまたそんな機能自体いらないと思われているのか。 ところで、こういったことを実現するにあたって問題になってくるのがクリック可能な、すなわち onclick にイベントハンドラが結び付けられた項目を HTML でどう表現するかだ。具体的にいうと a 要素を使って href 属性には無意味な値を設定するか、span 要素などその他の要素を使うかで、これに関しては「Googleがonclickにはhref="j

  • Safari の Date の修正: Days on the Moon

    Safari の Date#setMonth にバグがあると聞いて試してみたところ、そもそも Date コンストラクタからして月の負数指定に対応していない様子。やれやれ仕方のない子だな WebKit はというわけで Date オブジェクト自体を書き換えるスクリプトを書いてみた。適用すると Date コンストラクタ、 Date.UTC、 Date#setMonth、 Date#setUTCMonth、 Date#setFullYear、 Date#setUTCFullYear で月を指定する際に負数を使えるようになる。 fix-webkit-date.js Date オブジェクトに関するテストケース (修正確認用) 書いている途中で気づいたのだが、WebKit、というより JavaScriptCore では関数の引数と arguments オブジェクトのプロパティが値を共有しない。つまり、f

  • 文字列と UTF-8 バイト列の相互変換: Days on the Moon

    やっていることは「高度な JavaScript 技集」の「UTF-8 <-> UTF16 変換」と同じ。 function toUTF8Octets(string) { return unescape(encodeURIComponent(string)); } function fromUTF8Octets(octets) { return decodeURIComponent(escape(octets)); } encodeURIComponent は encodeURI でもいい (むしろそのほうが処理する文字種が減って速くなりそう) が、decodeURIComponent は decodeURI にすると一部の文字 ("?"、"#" など) がデコードされなくなる。 使いどころ Base64 エンコードする関数 (「高度な JavaScript 技集」の base64encod

  • プリミティブ値でもプロトタイプ的継承: Days on the Moon

    書き上げた後に元記事の続きが出ているのに気づいたが、方向性が違うようなのでそのまま掲載。 404 Blog Not Found:javascript - プロトタイプ的継承 (元記事: Prototypal Inheritance) より。継承という言葉は意味が広いので、この操作に対してはチャイルドの作成といったほうが個人的にはわかりやすい。 さて、元記事で紹介されているコードではプリミティブ値からのチャイルドの作成 (継承) ができなかった。これはなぜかといえば、オブジェクト作成の際、プリミティブ値をプロトタイプ ([[Prototype]] 内部プロパティ、__proto__ プロパティ) に設定することはできないからである。 そこで、プリミティブ値が渡された場合は、それをラッパオブジェクトに変換することにする。といっても場合分けの必要はない。Object 関数を使えば、プリミティブ値

  • inject、畳み込み: Days on the Moon

    IT戦記 - Perl で再帰呼出し時のスタック間データ共有を読んだ時点では気づきもせず、Kazuho@Cybozu Labs: JavaScript で Generic Programming にいたってようやく思い当たったのだが、Ruby の Enumerable#inject や Python の reduce というのはこういうときに使うものなのかもしれない。 // requires Prototype.js function count_tags(node) { return $A(node.childNodes).inject({}, function (tag, kid) { if (kid.nodeType != 1) return tag; tag[kid.nodeName] = (tag[kid.nodeName] || 0) + 1; return $A(kid.ch

  • JavaScript 1.7 の新機能: Days on the Moon

    Firefox 2 の新機能の一つに JavaScript 1.7 への対応がある。Firefox 2 Beta 2 のリリースも近づき JavaScript 1.7 の新機能もほとんどが実装されてきたのでここにまとめてみる。といっても New in JavaScript 1.7 に大体はまとまっているので補足的な部分など。 識別子の扱い ブロックスコープ 分割代入 イテレータ ジェネレータ 配列内包 参考 なお、ブラウザ上でスクリプトを実行する場合は、JavaScript のバージョンを明記しないと let 、yield がキーワードとして認識されない (Bug 351515) 。 <script type="text/javascript; version=1.7"> JavaScript shell を使う場合は起動時にバージョンを指定するか version 関数を使う。 $ js

  • JavaScript でブロックスコープを実現する: Days on the Moon

    JavaScript には基的にブロックスコープというものが存在しない。どうしてもブロックスコープを扱いたいときは function 式を使ったりする。 var a = 10; { var a = 20; print(a); // 20 } print(a); // 20 var a = 10; (function () { var a = 20; print(a); // 20 })(); print(a); // 10 だがやはりブロックスコープがあったほうが便利ということで JavaScript 1.7 では let 式、let 文、let 宣言が導入される。 var a = 10; let (a = 20) { print(a); // 20 } print(a); // 10 しかしこれでは対応するブラウザが Firefox 2 以降などに限られる。ところが、with 文とオブ