2013年08月20日

【JavaScript】連想配列(ハッシュ)の要素数取得

地味にハマったのでメモ。
連想配列の長さを調べる場合、配列と違ってArray.lengthでは取得できません。

JavaScriptのArray.lengthは、配列の数ではなくて「インデックスの最大値 + 1」を返します。
つまり配列のインデックスの最大数が10の場合、11が返されます。
これが連想配列の場合、インデックス(添え字)が数値でなくなるので、lengthが機能せず、取得できません。

連想配列で要素数を知りたい場合、一つ一つの要素をチェックする必要があります。

function hashLength(array){
var len = 0;
for(var key in array) { len++; }
return len;
}


詳細はこちら。
実はJavaScriptのlengthプロパティは配列要素数ではありません (WebTerminal)

なんでこんな仕様なんだろう…。



よくわかるJavaScriptの教科書
たにぐち まこと
マイナビ
売り上げランキング: 2,301



タグ:javascript メモ
このエントリーをはてなブックマークに追加
posted by 割れたCDR at 23:46 | Comment(2) | TrackBack(0) | JavaScript | このブログの読者になる | 更新情報をチェックする

2013年08月02日

【JS】【tmlib.js】tmlib.jsでADV作ろうとしたら時計ができた

20130802_gclock.png
↑クリックで動作ページ表示


tmlib.jsを一通り触って慣れてきたので、これで何か作ろうとしたらこうなりました。

はじめは普通のADVを作るつもりだったんですが、その前に
叩き台として以下の動作をするものを作ってみたんです。

1. 背景・キャラクター・ウィンドウが表示される
2. リアルタイムな画面更新を行う
3. クリック/タップでイベントが発生する


そしたら時計になりました。何故だろう…。
せっかくなので公開してみます。

ギミックとして、クリック/タップで5種類の台詞をランダムで表示します。
※PCではSafari/Chrome, スマートフォンではiOS&Safari で動作確認しています。
 残念ながら手持ちのAndroid機では表示はするもののタップが動作しませんでした。

せっかく作ったんでちょくちょく手を加えていきたいと思います。
素材くらいはオリジナルにしたいところ!


プロになるためのJavaScript入門 ~node.js、Backbone.js、HTML5、jQuery-Mobile (Software Design plus)
河村 嘉之 川尻 剛
技術評論社
売り上げランキング: 76,186



このエントリーをはてなブックマークに追加
posted by 割れたCDR at 23:49 | Comment(0) | TrackBack(0) | JavaScript | このブログの読者になる | 更新情報をチェックする

2013年07月12日

【JavaScript】【tmlib.js】Shapeにグラデーション

20130712_tmlib_grd.png
↑実行結果

線形グラデーションを指定してみよう- tmlib.js 怒濤の 100 サンプル!! - Graphics(HTML5 Canvas) 編を参考に、Shapeにグラデーションを適用して表示します。
わざわざShape上で表示する理由は、Canvas上に直接描画するより取り回しがしやすいから。
座標変更や表示・非表示がお手軽で良い感じなので、僕はだいたいのオブジェクトはこうして使っています。
その分負荷が気になるところですが。

以下ソースです。


>>続きを読む
このエントリーをはてなブックマークに追加
posted by 割れたCDR at 23:11 | Comment(0) | TrackBack(0) | JavaScript | このブログの読者になる | 更新情報をチェックする

2013年07月11日

【JavaScript】【tmlib.js】【Canvas】INDEX_SIZE_ERR: DOM Exception 1 エラーに遭遇

tmlib.jsでシコシコとプログラミングして、良い具合になったのでサーバにアップロードして確認しようとしたら表題のエラーで動作しない現象に遭遇しました。

INDEX_SIZE_ERR: DOM Exception 1: Index or size was negative, or greater than the allowed value.


エラーメッセージで検索したら英語のページしか見つからず、がんばって読み込んだ結果、どうやらCanvasで描画する画像が使用される前にダウンロードしきれていない場合こうなる模様。
どうりでローカルでは問題なく動作するわけだ…。

iPad Canvas Draw Image Error (Stack Overfrow)
INDEX_SIZE_ERR: DOM Exception 1 – HTML Canvas (Ryan Rampersad)

>>続きを読む
このエントリーをはてなブックマークに追加
posted by 割れたCDR at 22:27 | Comment(0) | TrackBack(0) | JavaScript | このブログの読者になる | 更新情報をチェックする
×

この広告は180日以上新しい記事の投稿がないブログに表示されております。