IT関係

Private Blog and Essay

Idea

Tumblr


Twitter
  • "プラスチックの分解には何千年もかかるといわれてきましたが、カナダの高校生Daniel Burdさん(16)はなんと3ヶ月で分解する方法を見つけました。..." http://t.co/hLp5qG0K
  • "私も確か、一度リリースしてwebに公開したやつを眺めてて気づいた覚えがあります。なぜかミスは公開後に見つかるの法則。" http://t.co/3VsMeQtZ
  • 鏡リュウジの占いが無料!あなたの運命を導く魔法の色は・・・思いやりピンク!あなたは何色?http://t.co/rlYIXnLZ #uranai #占い http://t.co/rlYIXnLZ 思いやりピンクは赤ちゃんの色
  • 鏡リュウジの占いが無料!あなたの運命を導く魔法の色は・・・ゆったりグリーン!あなたは何色?http://t.co/rlYEpNCP #uranai #占い http://t.co/rlYEpNCP ゆったりグリーンなので、Tシャツ着てきたのです。
  • 鏡リュウジの占いが無料!あなたの運命を導く魔法の色は・・・冷静ブルー!あなたは何色?http://t.co/rlYIXnLZ #uranai #占い http://t.co/rlYIXnLZ
  • "1)相手の話の「根っこ」を掴む 人の話ってブロックみたいに「理」が積み重ねられて「意見」という感情になっていると強いわけ。でも、つじつまの合わない、理不尽なことを言う人って、こ..." http://t.co/to5gdClX
  • "江戸時代の成人の平均身長は男性が150センチ台半ばで、女性はそれよりも10センチほど低い。..." http://t.co/fh7WDuMv

Javascriptの変数の基本

 Javascriptの変数は他の言語に比べてちょっと変です。phpは数値も文字列もその文脈で判断してくれるところがあって人間の想像の及ぶ範囲でだいたいエラーなし。Cはがっちりと変数型をいちいち宣言しないといけないけど、宣言した通りに動いてくれるのでこれもOK。Perlはちょっと変態的だけど、特殊な数字や文字列をだいたい覚えておけば問題なし。Rubyは新しすぎてピカピカなので結構問題なし。Javascriptは歴史がありすぎて、何でも出来過ぎて、関数多すぎて、バグありすぎて...結構手に負えないです。直感的にこうだろうと思う感じがあまり通用しないのと、同じ処理をするのに数十通りの正しいやり方が存在するので、これもまた厄介。
 で、ここでは変数の復習します。単品の変数(Perlではスカラー変数っていうのだけど、Jsでは何ていうんですかね。)と、配列と連想配列(ハッシュ)の基本的なことを勉強します。 

変数 variable

 単品の変数を格納するには、たいていの場合varで宣言します。varで宣言したら、その後はだいたい普通に使う感じです。

変数の宣言

var test_val;
これtest_valという変数が作られます。他の言語と違って$test_valみたいなダラーがありません。例えばPerlは、$変数、@配列、%ハッシュ、&関数(サブルーチン)のように頭の記号でいろいろ分けてあります。Javascriptはというと、一見してこのtest_valが変数なのか関数なのか何かのか正直わからないんです。というのもそのはずで、本来的にはjsには変数も関すもオブジェクトも何も殆ど区別がないみたいです。本来的に言えば...というのがあまりにも多いので、ここでは現代の風習に従って特にあまり本来的に言わないようにします。 で、test_valに値を格納するには、
var test_val = 'hogehoge';
です。または、
var test_val;
test_val = 'hogehoge';
でもいいです。varの宣言は変数の作成と初期化を伴っているという感じで、
var i=0;
i=100;
みたいな感じで使うこともごく頻繁にあります。
 変数名ですが、予約後が山ほどあるので気をつけてください。
var var=123;
などは勿論だめです。なんかいろいろいっぱいありますが、それっぽい名称は避けた方がいいです。何故かしら数字で始まる変数もダメです。

文字列と数値

 変数の型がいい加減なjsなのですが、数値と文字列の基本的な区別はクォートで囲む(文字列)か囲まない(数値)かで区別します。
もっと複雑になってきてどこかから値を取り出した時に数値か文字列か...という問題は後日。
var test_val_text = 'hogehoge';
var test_val_int = 10000;
という感じです。

配列

 本来的にいうとjsには配列がありません。配列プロトタイプを継承したオブジェクトのことらしいです。prototypeはいずれ避けては通れぬ関門なので後日。とりあえず配列みたいな変数の扱い方がjsでもできるという風に覚えて、配列としてしまうのがよいです。


配列の宣言配列の宣言

は、
var test_array = new Array();
または、
var test_array = [];
でOKです。しかし、ここがまた面倒なところでもあります。初期値の設定方法がまたそれぞれ違うのです。書くときはいいけど読むときに混乱しますよ。
var test_array = new Array('hoge','moge','huga');
または、
var test_array = [];
test_array[0] = 'hoge';
test_array[1] = 'moge';
test_array[2] = 'huga';
です。深い理由はいろいろあるのですが、ここでは考えない。しかも、
var test_array = [];test_array['0'] = 'hoge';test_array['1'] = 'moge';test_array['2'] = 'huga';
とシングルクォートで囲ってもどうしてだかOK。よくわからない。変数を単品で取り出す際は、そのまま、test_array[0];とかtest_array['0'];でOKです。

配列の洗い出し(走査)方法

 PHPならforとかforeach、perlならforeach、jQueryならeach、純粋にjsならforです。普通forを使います。
for(var i=0;i<test_array.length;i++) {
alert(test_array[i]);
}
とか
for(var i=0;i<test_array.length;i++) {
document.write(test_array[i]+"<br />\n");
}
 コツというほどのことはないけれど、配列(みたいなもの)を作成するとその配列の長さが、<配列名>.lengthで取り出せることになっています。そんなわけで、この値をiとの比較で設定してやると最後まで全部出てきてくれるという仕組みになっています。通常この中にいりいろとif制御していろいろやります。 基本的には数値も文字列もこれで大丈夫です。 配列は他の変数と連動して使うことが殆どなので、実際にtest_array[2]なんて書くのは稀だと思います。配列の添え字になる部分はそのまま変数を入れて大丈夫。しかも、iの値を文字列にしても大丈夫。なんか変。
var i=5; //var i='5';でも大丈夫。
document.write(test_array[i]);


連想配列

 jsでは連想配列と言わないみたいです。基本的にはオブジェクト・プロパティーです。ですが、連想配列、つまり添字に文字列っていう考え方で何かダメですか?って考え方でいきます。

連想配列の宣言

連想配列の宣言は{}中括弧です。配列が[]で連想配列が{}という風に覚えてもいいかもです。やや風変わりなのが:で連結して、,コンマで区切るというところです。var array_hash = {};
初期値を与える場合は、こんな感じです。var array_hash = { zero:'hoge', ein:'fuga', zwei:'huga'}; 余談ですが、一番最後の値を設定する際には、基本的はコンマがない方がいいです。しかし最近のブラウザーは最後のコンマを入れてもエラーも出さずに平気で処理してくれます。(IE系のブラウザーは基本エラーになります。) ここでものすごく変なのが、
var array_hash = { 'zero':'hoge',//keyにシンクルクォート入れちゃう系
'ein':'fuga', 'zwei':'huga'
};
でも問題ないことです。どっちが正しいんだかわかりませんが、いろいろできて気持ち悪いですね。で、ものすごく不思議なのが、連想配列の取り出し方です。
array_hash['zwei'];
です。必ず<変数名>['xxxx']の形式です。シングルクォートしないとエラーになります。添字は文字列扱いというわけです。変数を格納する際には添字にはシングルクォートがあってもなくてもいいのですが、呼び出す時はないとエラーになるという不思議なことになっています。
document.write(array_hash['zwei']);
としないと出力できません。

連想配列の洗い出し(走査)方法

 連想配列の洗い出しはどこぞの言語も同様にやや特殊です。jsではfor inを使うのが慣例になっているようです。(おそらく他にもやり方いろいろあるはずですが...)
for (var name in array_hash) {
document.write(array_hash[name]+"<br />\n");
}
 ループさせる際に添字は(ここでは)nameという変数にそれぞれ入れ込んでいます。なので、シングルクォートで囲むとアウトです。undefined(未定義値)が返ってくるので注意。勿論添字の部分を変数で渡してやっても大丈夫です。
var name2='ein';
document.write(array_hash[name2]);

変数の扱いの応用編

 jsの変数は基本的にはオブジェクトのプロパティーです。言ってみればjsには純粋な変数がないということです。格納場所はすべてオブジェクトです。なので、配列も連想配列もぐちゃぐちゃに混ぜて入れ込むことが可能です。便利なんだか不便何だかわかりませんが、自分なりにルールを作ってやらないとわけわからなくなります。


連想配列に配列を入れる(2次元配列)

var array_hash2 = {
zero:'hoge',
'ein':['red','green','blue'],
'zwei':'huga'
};

上記のように連想配列の値にいきなり配列を入れることができます。これは以外です。便利は便利なんですが、これはちょっと何な感じがします。変な感じがするのも当たり前でして、これは純粋にjsの変数じゃないらしいです。JSONといってXMLのデータ構造をそのままそっくりjsの変数として扱ってしまう...というやり方でjsの表記構文のサブセットなのです。jsの純粋な変数としてこれらを扱うとこれまたややこしいので覚えなくてもいいです。洗い出すとこんな感じになります。

for (var name in array_hash2) {
document.write(array_hash2[name]+"</br>\n");
}

結果hogered,green,bluehuga配列の部分はPHPみたいにArrayとして返ってこなくて、コンマ切りの値がそのまま返ってくるので便利といえば便利です。コンマでスプリットしたりできるのかもしれませんが、私はまだ試していないのでやってみてください。 JSONは、プロパティーの値を設定する時なんかは非常に便利です。が、今はYAMLとかあったりPHPのdefineがあったり、MTのconfigファイルみたいに普通にテキスト風に書いてスクリプト側が解析してちゃんと変数に格納してくれたりといろいろあるので、便利なんだか不便なんだかもうわかりません。



プロフィール



  • Name :: 山上オサム ♂(39)
  • Hobby :: 武術
  • Work :: Web Designer
転職
債務整理
ロト6
眼科
歯科
歯科医
特定調停
葬儀
SEO
岩盤浴
英会話
投資信託
金融
FX
住宅ローン
UFJ
資産運用
消費者金融
融資
ビジネスローン
税理士
外国為替
マンション
賃貸マンション
中古車
学生マンション