TOP / JavaScript

CoffeeScriptで竹内関数を解く

竹内関数といえばベンチマークによく使われる関数です。普通に書くと爆発的な回数の関数呼び出しが発生します。 function tarai(x, y, z) { if (x <= y) { return y; } else { return tarai( tarai(x - 1, y, z), tarai(y - 1, z, x), tarai(z - 1, x, y) ); }..

Posted by Hiraku on 2012-05-18

JavaScriptにRuby風のnewメソッドを加える

JavaScriptのオブジェクト指向はクラスベースの皮をかぶったプロトタイプベースです。機能的には十分なのですが、すっきり書く方法が公式に用意されていないので苦労します。一年前に、newを封印してJavaScriptでオブジェクト指向するなんて記事を書いたこともありました。 Rubyではnewは演算子でなくメソッドです。これをインスパイヤしてJavaScriptもnewメソッドを加えてみると、プロトタイプ的継承もすっきり書けるのではないかと思い、試してみました。ECM..

Posted by Hiraku on 2012-05-07

JavaScriptとprivateの見果てぬ夢 (JavaScript Advent Calendar 2011 オレ標準コース 6日目)

JavaScript Advent Calendar 2011（オレ標準コース）6日目です。他の方々のレベルが高すぎてビクビクしながら書いてます。 JavaScriptのオブジェクト指向は若干クセがあります。他のオブジェクト指向言語を使ってきた人にとって気になるのは、privateが作れないことでしょう。JSで教科書通り素直にクラス(もどき)を書くと、オブジェクトのプロパティは全てpublic、完全にオープンなものになってしまいます。 var Klass = fu..

Posted by Hiraku on 2011-12-06

JavaScriptにおける演算子の前置と後置 - セミコロンの自動挿入を理解して前置派を擁護してみる

JavaScriptに限った話ではありませんが、式の途中で改行するとき、演算子の後で改行する書き方と、演算子の前で改行する書き方があります。 var a = 1 + 2 + 3 + 4 ; var a = 1 + 2 + 3 + 4 ; 最後のセミコロンの位置にも流派があるかもしれませんが、ひとまず、便宜的に演算子後置スタイル、演算子..

Posted by Hiraku on 2011-07-03

JavaScript：unescapeHTMLの妥当な実装

JavaScriptにはHTMLを実体参照化する関数、PHPで言うところのhtmlspecialchars()にあたる関数が存在しません。 正式な理由はよく知りませんが、教科書的な回答としては、「DOMを使えばエスケープなんて気にしなくていいよ」が挙げられるでしょう。うだうだ言わず黙ってDOMを使うべし。 …まあでも、必要なケースもあるでしょう。特にinnerHTMLの高速性は魅力的です。T.jsを作ったときにベンチマークを取ったのですが、エスケープ関数をはさんでもi..

Posted by Hiraku on 2011-06-23

JavaScriptのテンプレートエンジン「T.js」を公開しました

結構前に公開していたんですが、きちんとした紹介を書いてなかったので改めて。Githubにて、T.jsという名前のJavaScript用テンプレートエンジンを公開しています。 T.js - DOMBuilder-like template engine for JavaScript T.jsとは JavaScriptでHTMLを書くためのライブラリ（一種のテンプレートエンジン）です。 T.table("#addressbook")({style:{borderC..

Posted by Hiraku on 2011-06-21

DOM Builder系のjsテンプレートエンジンまとめ

前回、どちらかと言えばinnerHTMLよりはDOMを使いましょうと書きました。しかしDOMをちょっと使えば、その余りの煩雑さに閉口することでしょう。では可読性を保持しつつ、XSSも考慮して書くにはどうすればいいでしょうか。 ちょっとしたものであれば、HTML中にdisplay:noneで構造を書き出しておき、それをJavaScriptから使う、というアプローチでもカバーできるでしょう。しかし大規模になると限界が見えてきます。描画に必要ない要素を書き出しすぎると、パフォーマ..

Posted by Hiraku on 2011-06-14

DOM APIとinnerHTMLは等価ではない

最近、徳丸本をじわじわ読んでいるのですが、DOM based XSSの話が書いてあったので、少し言及しておこうと思います。 徳丸本から引用 DOM based XSSと呼ばれるXSSがあります。これは、JavaScriptによりクライアント側で表示処理する箇所があり、そこに脆弱性がある場合のXSSです。 サンプル書いてみました。 <script> document.write(unescape(location.href)); </s..

Posted by Hiraku on 2011-06-05

JavaScript：undefined値の判定

JavaScriptでは初期化されていない変数には全て「undefined」という値が入っています。 var a; alert(a); //undefinedが入っている これを利用して、変数が定義済みかどうかを判別することが可能です。…が、やり方がいろいろあるみたいなので、まとめてみることにします。 undefinedと比較する if (a === undefined) { alert("aは未定義"); } グローバル変数として、そ..

Posted by Hiraku on 2011-05-27

newを封印するべき4つの理由

ちょっと勢いに任せて書いちゃったので攻撃的な文章になってます。。 すごくわかりやすい解説記事を頂いたので、こちらも必読です。 new を不当に貶める陰謀と JavaScript におけるクラスの継承構造の話 - vivid memo (追記：2011/5/15) 前の記事「newを封印して、JavaScriptでオブジェクト指向する」が思いのほか反響が大きかったので、調子に乗って補足を書いてみますよ。 ブコメへの返信 「無用な複雑化に見える。」「俺俺オ..

Posted by Hiraku on 2011-05-13