入門の入門部分だけざざっと。
★基本文法
コメント
// ここはコメント /* ここもコメント */
関数(メソッド)定義
function 関数名( パラメータ ){
// 関数の内容;
// ・・・
}
※パラメータ は省略可
関数(メソッド)呼び出し
// フツーの関数を呼ぶ 間数名( パラメータ ); // 返り値を変数に入れとく場合 変数 = 間数名( パラメータ ); // オブジェクトの関数 (メソッド) を呼ぶ オブジェクト.メソッド名( パラメータ ); // 具体例 Math.max: 与えたパラメータのうち大きなほうを返すメソッド var a = Math.max(5, 10); // aには 10 が代入される
※パラメータ は省略可
変数の操作
a = 5; // aに5を代入する a += 1; // aに1を足す b = a * 6; // bにaの五倍 (36になる) を代入する s = '文字列'; // sに「文字列」と代入された m = 'bの値は' + b + 'です'; // 連結: mに"bの値は36です" と代入される n = "シングルクォートとダブルクォートはどっちでもいい";
条件分岐: if文
※「条件式」の書き方は次節
if( 条件式A ){
// 処理内容; ←ここは「条件式A」が真のとき実行される
}
else if( 条件式B ){
// 処理内容; ←ここは「条件式A」が偽だけど「条件式B」が真のとき実行される
}
else if( 条件式C ){
// 処理内容; ←ここは「条件式A,B」が偽だけど「条件式C」が真のとき実行される
}
else{
// 処理内容; ←ここは「条件式A,B,C」の全てが偽のとき実行される
}
※ 「else if(){ ～ }」や「else{ ～ }」 は省略できます。
ループ: for文
// 定型文
for(var 変数 = 初期値; 変数 < 終了値; 変数++){
// 繰り返し行う処理内容
}
// 0～9まで「今の数字は○○です」と表示 (alert) させたい場合
for(var i = 0; i < 10; i++){
alert('今の数字は' + i + 'です');
}
// ※ 「i < 9」ではなく「i < 10」なのに注意
条件式
※ 真＝正しい、偽＝ただしくない、みたいな感じ
// 基本形 (a == 50) // aが50の場合に真 (a == "hoge") // aが"hoge"の場合に真 (a == b) // aの内容とbの内容が等しい場合に真 (a != b) // aの内容とbの内容が違う場合に真 (a > 5) // aが5より大きい場合に真 (a < 5) // aが5より小さい場合に真 if(a >= 5) // aが5「以上」の場合に真 (a <= 5) // aが5「以下」の場合に真 // 複合条件 ( ! 条件式 ) // 「条件式」が偽の場合に真 (! (a == 4) ) // !の例: (a != 4) と同じ意味 ( 条件式A && 条件式B ) // 「AかつB」: 条件式AとB両方共真の場合に真 ( 条件式A || 条件式B ) // 「AまたはB」: 条件式AかB片方でも真の場合に真 ( (a == 4) || (a == 5) ) // aが4か5の場合に真 ( (1 <= a) && (a <= 10) ) // aが1～10の場合に真 ( 1 <= a && a <= 10 ) // 括弧は省略できる
★基本ライブラリ
デバッグ等のためにメッセージダイアログを表示する
alert('表示させたいメッセージ');
指定時間待って処理を続ける (setTimeout)
// 指定「ミリ秒」後に「関数」を呼び出す
setTimeout(関数, ミリ秒);
// 指定「ミリ秒」後にやりたい処理をベタ書きする
setTimeout(function(){
// やりたい処理;
// ・・・
}, ミリ秒);
★jQuery等外部ライブラリのもの
初期化時に実行される処理の書き方(jQuery)
$(function(){
// 初期化時にやりたいこと;
// ・・・
});
セレクタで指定した要素のCSSを変える (color, visibility とか)
$('セレクタ').css('CSS項目名', '変える値');
セレクタで指定した要素の「属性」を変える (src, href とか)
$('セレクタ').attr('CSS項目名', '変える値');
入門の入門でした。
以上。