JavaScripts/Ajax

shimazakiです。

先日社内でJavaScriptでオブジェクト指向、という発表をおこないましたので、その資料を公開します。

• JavaScriptでオブジェクト指向

JavaScriptを本格的に勉強し始めて約半年ほどになりますが、とりあえずの一段落がついたかな、という感じがします。

shimazakiです。

先日社内で勉強会をした際にDOM入門、という名目で発表をおこないましたので、その資料を公開します。

• DOM入門

DOMは「element」という概念と、ドキュメントツリーと、ブラウザごとの差異が理解できれば後は理解への妨げになるものは無いかなと思います。

shimazakiです。こんにちは！

最近ようやくJavaScriptが理解できてきました。

そこで、自分がなんちゃってからそこそこになるまでに理解した5つ＋αのことを紹介したいと思います。

1.変数と関数が同じものであると理解する

PLAIN TEXT
JavaScript:
var hoge = alert;
hoge("hogehoge");
• JavaScriptは関数も変数に格納されています。

2.連想配列とオブジェクトが同じものであると理解する

PLAIN TEXT
JavaScript:
alert( location.href );
alert( location["href"] );
• JavaScriptは連想配列とオブジェクトは同じものです

3.関数がクラス（オブジェクト）になるということを理解する

PLAIN TEXT
JavaScript:
function hoge(){}
foo = new hoge();
• JavaScriptは関数に対してnewをつけるとその関数のインスタンスになります。

4.リテラルを理解する

• 配列リテラル[]
PLAIN TEXT
JavaScript:
var arr = ["aaa","bbb","ccc"];
• 関数リテラル function()
PLAIN TEXT
JavaScript:
var func = function(){
//処理
};
• オブジェクトリテラル{}
PLAIN TEXT
JavaScript:
var arr = {
aaa:"xxx"//文字列
,bbb:["y","yy","yyy"]//オブジェクトの要素として配列を定義（配列もリテラル）
,ccc:function(){}//オブジェクトの要素として関数を定義（関数もリテラル）
};
• JavaScriptはnewしなくとも配列やオブジェクトが生成できます。

5.prototypeという概念（JavaScript的オブジェクト指向）を理解する

PLAIN TEXT
JavaScript:
function hoge(){}
hoge.prototype.foo = "bar";
var obj = new hoge();
alert( obj.foo );// bar
• JavaScriptにはextendがありませんが、prototypeを使用することで値の引継ぎができるようになります。

＋α.DOMを理解する

• DOMを理解するとHTML（XML）コンテンツを自由自在に操作・表現することが出来るようになります。

DOMを理解するためのいくつかの条件はまたいずれ、自分が理解できた時に紹介させていただこうと思います。

Let's JavaScript！

今日のトリビア

JavaScriptの正規表現は・・・

「(?<=」後読み（戻り読み）や「(?<!」否定後読み（否定戻り読み）が使用できない。

1時間悩んだ自分への戒めを込めて。shimazakiでした。

これだけだとさすがに中身がないので、もう少し。

そもそも後読みを使いたかった（正確には本当に使いたかったのは否定後読みですが）理由として、pathinfo形式の現在のURLをスラッシュ区切りで変数に格納したい、という目的のためです。

例えば、
http://example.com/index.php/moduleName/ControllerName/ActionName
であった場合に

というような具合に。
ですが、先述の通り、否定後読みは使用できないので、

とすることで対応することにしました。

補足になりますが、
実際にはgetパラメータも切り分けるために、

としました。

今日のエントリがまだ見ぬ未来のJavaScripter入門者の助けになれば幸いです。

shimazakiです。

先月社内勉強会で「PHPer向けJavaScript入門」をやりましたので、その資料を公開します。

PHPer向けJavaScript入門

資料はamachang氏のS6を使わて頂きました。

（ウィンドウリサイズ時のサイズ調整とマウスクリックでもページが進むように手を入れてあります、あとIEだと微妙に崩れてしまうので、Firefoxを推奨します）

自分自身真面目にJavaScriptの勉強をしたことがなかったので、良い勉強になりました。

PHPは分かる、JavaScriptはちょっとだけ分かる、もしくは何となく分かっている、という人にはオススメできるかもしれません。

間違っている箇所などありましたら指摘いただけると幸いです。