TOPシステム開発> はじめに




まるごとJavaScript&Ajax!
JavaScriptを洗練させるPrototype.js

第1回:Prototype.jsを使う準備
著者:ガイアックス  天野 仁史   2007/2/22
1   2  次のページ
はじめに

   筆者がPrototype.jsに初めて出会ったのは、2005年9月ごろだったと思います。この頃、オブジェクト指向JavaScriptはまだまだ黎明期で、オブジェクト指向の書き方もさまざまな我流が存在していたことを覚えています。

   もちろん、筆者も我流のオブジェクト指向で書いていました。しかし、すべてのエンジニアが我流の書き方をしていては、JavaScriptのオブジェクト指向は普及しません。

   そんな時にさまざまなブログで取り上げられ始めたのがPrototype.jsでした。Prototype.jsにはクラスを定義するという機能があり、すべてのエンジニアが同じ方法でクラスを定義できるのです。それは、大きなインパクトでした。しかし、その当時Prototype.jsにはまとまったドキュメントが無く、目利きのJavaScripterたちはこぞってソースを読んでいました。

   そして、そのことが図らずともJavaScripterを育てていったのです。筆者もそんなJavaScripterの一人でした。現在のJavaScriptの発展はPrototype.jsがあってこそだ、と言っても過言ではないと思います。本記事では、そんなPrototype.jsの代表的な機能を紹介していきたいと思います。

準備

   それでは、まずPrototype.jsを使う準備をしましょう。


ダウンロード

   Prototype.jsの本稿執筆時の最新バージョンは1.4.0です。が、まもなく1.5.0がリリースされると思いますので、本記事では一足先に最新の開発バージョンである1.5.0_rc2を前提として紹介していきたいと思います。この記事の内容を直接試す場合は、Prototype.jsの1.5.0_rc2が必要です。

   開発版を手に入れるには、直接最新リポジトリからソース一式をダウンロードし、rakeコマンドを使ってビルドしなければなりません。少しめんどくさいので、Prototype.jsの兄弟プロジェクトであるscript.aculo.usのリポジトリにあるビルド済みのPrototype.jsを使うことにしましょう。

   script.aculo.usの最新のPrototype.jsは現時点で以下のURLからダウンロードできます。


※注1: 本連載の公開時(2007年2月)では、prototype.js 1.5.0がリリースされていますので、以下のURLからダウンロードしてください。
http://prototypejs.org/assets/2007/1/18/prototype.js


使いかた

   実際にダウンロードしたファイルを使うにはどのようにしたらいいのでしょうか。それはとても簡単です。普通のJavaScriptファイルと同様にscriptタグによって読み込めばいいのです。ただし、prototype.jsに依存するコードはprototype.jsの後に読み込む必要があります(リスト1)。

リスト1:Prototype.jsを読み込む
<script type="text/javascript" src="prototype.js"></script>

<!-- hoge.js の中でPrototype.jsの機能を使えます。-->
<script type="text/javascript" src="hoge.js"></script>

<!-- このscript タグの中でもPrototype.jsの機能が使えます。-->
<script type="text/javascript">
if (window.Prototype) { alert("Enjoy Prototype.js!") }>
</script>

1   2  次のページ

書籍紹介
まるごとJavaScript&Ajax!

まるごとJavaScript&Ajax! Vol.1 JavaScriptの一人者たちが教える最新ノウハウ
Ajaxの登場により、JavaScriptは最もホットなプログラミング言語になりました。そのJavaScriptとAjaxについて、最新ノウハウをまるごと解説します。
今や欠かせない、Prototype.jsをはじめとするJavaScriptライブラリを紹介します。IE 7やFirefox 2などの最新ブラウザーの新機能と、来るべきJavaScript 2についてもわかります。Web以外でのJavaScriptの利用テクニックも読めます。
JavaScriptを知り尽くした第一人者たちに学ぼう!

発売日:2007.02.16発売
定価:1,995円 (税込)
株式会社ガイアックス 天野 仁史
著者プロフィール
株式会社ガイアックス   天野 仁史
渋谷で働くWebプログラマ。出身は石川県金沢市。21歳でプログラミングに出会い、IT戦士になることを決意。それからというもの、寝ても覚めてもプログラムを書き続け今に至る。はてなでamachangというidでブログを書いてます。

IT戦記
http://d.hatena.ne.jp/amachang/


この記事の評価をお聞かせください
ボタンをクリックしますとウインドウが開きます。

INDEX
第1回:Prototype.jsを使う準備
はじめに
  JavaScriptの復習
JavaScriptを洗練させるPrototype.js
第1回 Prototype.jsを使う準備
第2回 JavaScriptの復習
第3回 Prototype.js流のオブジェクト指向を理解する
第4回 関数の拡張と配列操作メソッド一覧
第5回 代表的なメソッドの紹介
第6回 DOMの拡張(前編)
第7回 DOMの拡張(後編)