IT戦記 - Prototype.js を使った JavaScript OOP 講座 #02
社内の勉強会の資料をここに公開していきます。社内の人も社外の人も読んでください。 ※ターゲットは JavaScript は書いたことない、オブジェクト指向言語プログラマ。 ※信念は「教わるのではなく、必死に着いていきませう」 今週はかなりハードボイルドで全身タイツのような忙しさなので、みんなが春を分けて楽しんでいたり、香港に行って楽しんでいる間にせこせこ資料を作っています。 はぁ。 Section 00 Prototype.js の前に JavaScript と DOM とイベントの概要 HTML は読み込まれた後、すべての情報が JavaScript のオブジェクトに変換される。 イメージ的にはこんな感じ <html> <head> <title>タイトル</title> </head> <body> ： ： </body> </html>↓↓↓ var document = { doc
プログラマの方、もしくはプログラミングに興味のある方に質問です。web上の文章でこれは読んでおいた方がよい、あるいはこの文章は面白いという文章を教えてください。文.. - 人力検索
プログラマの方、もしくはプログラミングに興味のある方に質問です。web上の文章でこれは読んでおいた方がよい、あるいはこの文章は面白いという文章を教えてください。文学、エッセイ、哲学、宗教、経済、科学、コンピュータ等、分野は問いません。 例：http://cruel.org/freeware/hacker.html
fladdict.net blog: JavaScript, ActionScriptにおける .this とは何なのか？
人様にActionScript (あるいは JavaScript)を教える時に、絶対に鬼門となるthisスコープについてのまとめメモ。 ECMAスクリプトでは関数が他の変数に代入可能な為、関数のthisが文脈によって変動します。どうも、Javaとかやってる人にはそれがスゴイ気持ち悪いらしいのです。 thisとな何なのか？ 端的に言うならば、thisは「その関数を、何のプロパティと解釈して呼び出したか？」によって決定します。 関数を直接呼び出す場合と、オブジェクトのプロパティに代入してから呼び出す場合を比較してみます。 function hoge(){ alert(this); //trace(this); flashの場合はコッチ } var myObj = new Object(); myObj.hoge = hoge; hoge(); myObj.hoge(); のように書いた場合、
IT戦記 - 複雑で重くなった JavaScript を超高速化する方法。
以下のスクリプトを他のすべてのスクリプトよりも前に読み込む。 var nativeSetInterval = window.setInterval; _setInterval = {}; window.setInterval = function(process, delay) { var entry; if(typeof process == 'string') { entry = new _setInterval.Entry(function(){eval(process);}, delay); } else if(typeof process == 'function') { entry = new _setInterval.Entry(process, delay); } else { throw Error('第一引数が不正です。'); } var id = _setInterv
JSONScriptRequest
動的にscript要素を追加してやることによってクロス・ドメインのJavaScriptファイルを読み込むというテクニック。Firefoxの場合は動的に追加するscript要素のonload属性で読み込んだJavaScriptファイルを処理するfunctionを指定してやれば問題ない。しかし、これをクロス・ブラウザで実現するには違ったアプローチが必要になる。そのひとつがJSON and the Dynamic Script Tag: Easy, XML-less Web Services for JavaScriptで取り上げられているJSONScriptRequest。XmlHttpRequestと比較するとかなり機能が限定されたものだけど、扱いが手軽で限定された環境ではなかなか威力を発揮するっぽい。 JSONScriptRequestはどうやらJSONPと呼ばれている、JSONデータをc
Hawk's Laboratory » JavaScriptによるUI開発におけるStateパターンの利用
このドメインを購入する。 hawklab.jp 2019 Copyright. All Rights Reserved. The Sponsored Listings displayed above are served automatically by a third party. Neither the service provider nor the domain owner maintain any relationship with the advertisers. In case of trademark issues please contact the domain owner directly (contact information can be found in whois). Privacy Policy
- Java プログラマのためのデザインパターン入門
この記事では、ソフトウェアパターンの中でも、特に Gamma らの著書「デザインパターン」に絞って入門者および中級者向けの解説を行う。 Java プログラミングの経験はあるがデザインパターンはよく知らない、 あるいは、 よく知っているが、実際の開発で活用するにはどうしたらよいか悩んでいる という読者を対象としている。 まず、なぜデザインパターンが重要かということを述べた後、 書籍「デザインパターン」の読み方を解説する。 さらに、パターンの持つ特質である生成性を述べ、 最後に、実際に動作する Java アプリケーションをデザインパターンを利用しながら開発する例を説明する。 「デザインパターン」は Gamma らの著書によってソフトウェア設計における良質なデザインテンプレート集として広く認知されているが，実際の開発現場では，どの程度普及したであろうか．もし読者が java プログラマであり，ま
JavaScriptっぽい。 JavaScript OOPなリンク集
とりあえず自分で書いたのも含めて、後でゆっくり読みたいものなどを片っ端からリンク。選出基準は適当です。 JavaScriptっぽい。 prototype覚書 GAC なぜなにGAC->フォーラム->【JavaScript】 Functionで遊ぼう [教えて！goo] クラスの継承の仕方 オブジェクト（Object）（とほほ） JavaScript, Neo-Generation/Function 自作オブジェクトで複数のメソッドを呼び出したい Virgo - JavaScript - ユーザ定義オブジェクト ECMAScriptチュートリアル ECMAScript - on Surface of the Depth - Effective JavaScript - Dynamic Scripting オブジェクトなJSの基礎講座 プロトタイプチェインについての覚書（ECMAScript,
Prototype.js を使った JavaScript OOP 講座 #03
社内の勉強会の資料をここに公開していきます。社内の人も社外の人も読んでください。 ※ターゲットは JavaScript は書いたことない、オブジェクト指向言語プログラマ。 ※信念は「教わるのではなく、必死に着いていきませう」 前回までの内容で Prototype.js でどのようにプログラムを書いていくか理解できたと思います。 ここからは、関数やクラスを覚えた数だけ Prototype.js を使えるようになると思います。 しかし、それではいつか必ず躓きます。他人の書いた JavaScript を使うためにはそのコードを読める必要があります。 JavaScript は、言語の仕様レベルの部分までかなり書き換えることが出来ます。 そのため、もし、動作がおかしくなった場合に、どこがどう影響したか自分で調べられなければならないのです。 今回は、 Prototype.js を読むために必要な知識を
あるＳＥのつぶやき: IT戦記のJavaScriptオブジェクト指向講座
Prototype.js を使った JavaScript OOP 講座 #01(IT戦記) Prototype.js を使った JavaScript OOP 講座 #02(IT戦記) Prototype.js を使った JavaScript OOP 講座 #03(IT戦記) ちょっと前のエントリーになりますが、IT戦記にて、amachangさんが社内の勉強会で使用された、JavaScript オブジェクト指向講座の資料を公開されています。 ありがたいですね。感謝です。 特に、３つめの、プロトタイプチェーンとスコープチェーンは参考になりました。 まだ、理解しきれていませんが（笑）。
Prototype.js を使った JavaScript OOP 講座 #01
社内の精鋭エンジニアを中心に定期的に勉強会をすることになった。んで、 JavaScript の講義は僕がやることになった。 資料を社内だけでとどめておくのはもったいないので、ここに公開していきます。社内の人も社外の人も読んでください。 講義の内容は基本的にソース嫁。ソースレビュー形式。 ※ターゲットは JavaScript は書いたことない、オブジェクト指向言語プログラマ。 Section 00 Prototype.js の前に JavaScript のオブジェクトの概要・・・ オブジェクトを作ってみる。 var object = {};オブジェクトにメソッドとかプロパティを追加してみる。 var object = { field: 'IT戦士', method: function() { alert('hello ' + this.field); } }; object.method()
疑りぶかいあなたのためのオブジェクト指向再入門
このページは、「オブジェクト指向再入門」とあるように、 オブジェクト指向を勉強しようとして挫折した人向けの文書です。 タイトルに「疑り深いあなたのための」とありますが、 これは決して揶揄して言っているわけではありません。 現在世間に蔓延しているオブジェクト指向の説明では、 むしろ納得しない方がまともだとさえ思えます。 「オブジェクト指向を使えば、生産性が飛躍的に上がり、 プログラムの見通しがよくなり、再利用性も高まる」と聞かされて、 「ホントかあ?」と思える人は、一度読んでみてください。 本稿の対象読者は「既に他の手続き型言語を習得しているが、 オブジェクト指向が理解しがたいと感じている人」です。 言語としてはJavaを使用します。 手続き指向型の言語の例としては、C言語を使用します。 特にCに習熟している必要はないようにしたいのですが、 Cで言うところの「構造体」「ポインタ」「動的メモリ
Latest > Flakes of Ideas > JavaScriptでDOMを使う――オブジェクト指向入門の入門 - outsider reflex
2003/9/3 2003/9/4 2003/9/5 2003/9/6 はじめに オブジェクトとプロパティ 連想配列 オブジェクトと連想配列 「クラス」というテンプレート オブジェクトとメソッド 特定の型専用の関数 「メソッド」というプロパティ クラスとメソッド 「オブジェクト指向」の簡単なまとめ DOMとオブジェクト指向 「DOM」とは何か？ インターフェースとクラス DOM操作の実例 簡単な処理の例 もっと複雑な処理の例 おわりに Cが分かる人には疑りぶかいあなたのためのオブジェクト指向再入門というページがお勧めです。僕の稚拙な説明よりずっと分かりやすいです。 Home Back to Flakes Prev. Next はじめに JavaScriptでDOMを使う。DOMはHTMLやXMLをスクリプトやプログラムで操作するのにとても便利な技術ですが、簡単なスクリプトくらい書けるからD
JavaScriptでUndoRedoするためのなにか - Thousand Years
方法論? ふとJavaScriptでUndoRedo機構がエレガントにつくれないかと思ってなんかごさごさやっていたんですがそれっぽいものができたのでアプローチをポスト。UndoRedo機構つくる為の方法論としていくつか考えてみました。 前やったことの逆算。次やることの計算(右に3px動かす。左に3px動かす。) DOMのプロパティtop:50pxとかleft:50pxとか保存して頑張る。(prop1 = { top: 50, left :50px}, prop2 = {top: 25, left : 25}) 現在の状態のDOMを保存(キャッシュ)しておき状態を復元する。 とまぁ。すぐ思い浮かぶのは1,2くらい(1と2のパターンはやれなくもないけど凄いめんどう。)今回は3のアプローチ。 element.cloneNode(flag) JavaScriptでアニメーションするにしろ新しくHT
mozdev.org - greasemonkey: authoring
Writing User Scripts Mark Pilgrim has given the Greasemonkey community Dive into Greasemonkey, the best reference imaginable. The stuff below might be slightly more up-to-date. You can write your very own shiny user script with just a few steps: 1. Create the file Open a new text file in your favorite editor and throw some javascript in there. Note that there are many good resources available if y
クロスブラウザでのJavaScriptキーボードイベントの扱い方:phpspot開発日誌
JavaScriptでのキーボードイベントの処理はブラウザによって違っていて、クロスブラウザで動作させるためには、それぞれのブラウザに合ったコードを実行し分ける必要があります。 JavaScriptでキーボードイベントを取得し、どのキーコードが押されたかを判別するサンプルを以下に示します。CtrlキーやShiftキーが押されたかどうかなどのチェック方法も併せて示しています。 このサンプルを活用することで、Webアプリケーションにショートカット機能をつけ、より使い勝手のよいWebアプリケーションを作成する手助けになるはずです。 以下、サンプル。 <html> <title>クロスブラウザでキーボードイベントを処理する方法</title> <!-- js コード --> <script type="text/javascript"> document.onkeydown = function(
JavaScript: クロスブラウザでブロック要素内のクリック座標を得る方法:phpspot開発日誌
JavaScript: クロスブラウザでブロック要素内のクリック座標を得る方法 ちょっとやることがあって調べてみたら案外情報が見つからず、実現するのに時間がかかったのでメモしておきます。 <script type="text/javascript"> <!-- function clickhandler(event) { if (!event) { event = window.event; } var hx, hy; if (document.all) { // for IE hx = event.offsetX; hy = event.offsetY; } else { hx = event.layerX; hy = event.layerY; } alert("x:"+hx+",y:"+hy); // return [hx,hy]; } //--> </script> <div on
Let’s use doxygen!
はじめに プログラマには、ドキュメント、とくにプログラムの内部仕様書を書くのが苦手、 という人が多い。 その理由は明らかであって、そもそも、ソースコードに (バグも含めて)*1 すべての仕様が子細もらさず書かれているのに、なぜ、さらにそれと独立した仕様書が必要なのかと、 (半ば本気で) 思ってしまうからである。 ソースコードと独立にメンテナンスをしなければならないような仕様書は、 いずれソースコードと整合性が取れなくなって、無意味ならまだしも、 かえって害をなす存在となり果てることもある、ということを、 彼らは経験的に理解しているのである。 (*1) Ruby の作者である、まつもとゆきひろ氏は、 その著者『オブジェクト指向スクリプト言語 Ruby』の中の「付録C Ruby 用語集」で、 次のように書いている: ドキュメント まつもとの苦手なもの。彼は普段から「ソースがドキュメントだ。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Greasemonkeyの開発をまとめてみる
IBM わかりやすいコードを作成するための 6 つの方法 - Japan
