ウェブ屋の飲み会参加者募集します

2011/11/15 | その他

本年末もウェブ屋の飲み会を開催することになりました(今回で四回目)。参加人数は10人から15人程度の予定。参加資格とか特に無いのですが、基本的にウェブ屋であること。デザイナーでもプログラマでもコーダーでもディレクターでも、ウェブ関連のお仕事をしている方ならOKです。年齢男女国籍問いません(日本語が話せないと楽しくないと思います)。実際には20代半ばから50代半ばの方が参加しています(30代、40代が多いです)。

2011年12月2日金曜日に都内近郊での開催を予定しています。現在若干名の枠がありますので、参加を希望される方はこの記事へのコメントでお名前とメールアドレス、得意分野等をお知らせ下さい。送信いただいたコメントは公開せず、メールで必ず返信します。人数の都合でコメントいただいても参加していただけない可能性もあります。その場合はご了承下さい(必ずメールで返信します)。

では、どうぞよろしくです。

JavaScriptでnewする、ということ

以下のスクリプトを基本に考える。

function Box(){}
var box=new Box;

Boxはまぎれもなく関数である。正確には関数オブジェクトというらしい(関数もオブジェクトである、という所以か)。コンストラクタですかね。

関数をnewして変数に代入すると、オブジェクトが生成される。それで出来たのがboxだ。通常boxはBoxから派生したのだからBoxで持っていた属性(というかフィールドというか)を引き継ぐ(ここでは何も持っていないので引き継いでいないけれど)。

newして出来たboxはオブジェクトになるわけだが、その際box.__proto__という属性を持つようになる(JavaScript内部でそのような処理が実行されているらしい)。box.__proto__に何が入っているかは後述する。

ここでプロトタイプというものを考える。プロトタイプは関数(ここでいうBox)に対して設定する(オブジェクトboxに設定するものではない)。たとえば上記のスクリプトに追記する。

function Box(){}
Box.prototype.size=1;
var box=new Box;

この状態でbox.sizeは1である。box.sizeは定義も代入もされたことはないけれど1になる。

関数オブジェクトがnewされると、できたオブジェクトに__proto__という属性ができるということは前述した。この__proto__には関数オブジェクトで定義されたプロトタイプ(これもオブジェクトなんだけど)を参照している(ポインタみたいな感じか)。

JavaScriptの仕様で、オブジェクトに特定の属性が存在しない時(ここでいうsize)、当該オブジェクトの属性である__proto__を走査し、sizeという属性を探す。ここでsizeが見つかると、当初のオブジェクトに、いかにもsize属性があるかのごとく、その__proto__.sizeの値を返す。これ、いわゆる継承ってやつですかね。

ちなみに上記のスクリプトで二行目と三行目をひっくり返してみる。

function Box(){}
var box=new Box;
Box.prototype.size=1;

二行目が実行された時点では、box.sizeはundefined。しかし三行目が実行されたらbox.size=1となる。これは__proto__に単純にコピーされたというのではなく参照で渡されているから。元の値が変化すれば、参照している側の値も変化する。

ちょっとわかってきた。

関数の定義方法による挙動の違い

JavaScriptの関数定義方法は大きくわけて二つある(と言い切っていいかどうか分からないけど)。

  1. function hoge(){do something;}
  2. var hoge=function(){do something;};
上記の違いを列挙してみる。
  • 関数定義のタイミング
    1の場合、hogeという関数をコール、つまりhoge()する前に定義しようが、後に定義しようが動作する。つまりJavaScriptがエンジンによってコンパイルされるタイミングで 関数が定義される。
    2の場合、実行時に当該行があったタイミングで関数が定義される。つまり2の記述の前にhoge()するとエラーになる。
  • プロトタイプでメソッドを仕込むときは2の方法を使う。
    1は基本的には使えません(IEでは動くらしいけど)。

Google Analyticsモバイル用がうまく設置できないときに

2011/11/09 | その他

何度か導入したけど、毎回調整しているので調整箇所のメモ。

Google Analyticsモバイル用はいくつかの言語に対応しているのだが、PHPで導入する場合以下の箇所に注意。本体としてはもともと3箇所に手を加える必要がある。それらは以下のとおり。

  1. htmlタグの直前の記述
  2. body閉じタグの直前の記述
  3. /ga.php

2については手を加える必要はない。そのままbody閉じタグの直前に記述すればOK。修正等必要なのは1と3。

そもそもなぜ修正が必要かというと、携帯版専用といえどもPCで確認する場合があるはずで、PCで確認しようとするとエラーが発生するから。そしてエラーはNoticeレベルで発生する。埋め込み画像が壊れるのだ。

修正箇所はいずれも2011年11月09日現在である。

1の13~15行目の記述。

$referer=$_SERVER[“HTTP_REFERER”];

上記のような記述が3行あるので、以下のように変更する。

$referer=empty($_SERVER[“HTTP_REFERER”])? ”:$_SERVER[“HTTP_REFERER”];

同様に、3の140行目から148行目にかけても上記と同様に修正する。

多分携帯で見れば問題ないんだと思う。でも携帯で動作チェックすることはないから、やっぱり上記の修正を加えておくべきと思う。

あと、1の設置場所にhtmlタグの直前とあるが、例えばテンプレートエンジンなど使用していたり、ヘッダとフッタが全ページ共通だから別ファイルにして読み込んでいる場合などは注意が必要。変数のスコープの問題等で2で使用する関数を呼び出せないことがあるからだ。

1については「とにかく一番最初に記述」とすればよさそうだ。PHPではプログラム本体とテンプレートエンジンを使った場合などで、ファイルをインクルードすることも多いはずなので、その一番最初の呼び出し元の先頭に記述すればよい。


守谷市(まちの情報ポータル) 無料アンケートレンタルjpForm.net