JavaScript 基礎

JSは少しだけやったことあるけど、体系的には学んでないのでここで整理。

JavaScriptの身近な使用例

• WEBページを再読込無しで新しいコンテンツを読み込み、サーバーにデータを送信する。
• WEBページ要素のアニメーション、フェードイン、フェードアウト
• フォーム入力値の動的なチェック

##　後置演算、前置演算

###後置演算
yにxを代入してから、xに1を足す。

var x= 10;
var y= x++;

console.log(x); => 11
console.log(y); => 10 

###前置演算
iに1を足してから、jにiを代入。

var i = 10;
var j = ++i;

console.log(i); => 11
console.log(j); => 11

== と　===

• ==: 等しい（変数の型は評価しない）
• ===: 厳密に等しい（変数の方も考慮する）

var i = "1"; // 文字列
var j = 1;  // 数値

if (i == j){} // True
if (i === j){} // False

Switch

===で評価される。

var n = 3;
switch(n) {
    case 1:
        console.log("数値は1です");
        break;
    case 2:
        console.log("数値は2です");
        break;
    case 3:
        console.log("数値は3です");
        break;
    default:
      console.log("範囲外です。")
}

#繰り返し処理

• for
• while
• do while

for

for (初期化式; ループ継続条件式; 増減式){
  //繰り返したい処理を記述
} 

while

while (条件式){
  //条件式がTrueのとき実行したい処理
}

do while

条件の判断が後ろにあるので、最低一回はループを実行する。

do {
  //条件式がTrueのとき、実行したい処理
} while(条件式)

配列

• 複数のデータの集合を扱える。
  • 一つの変数に対して、複数の値を格納できる。
• 要素には、インデックス番号でアクセスできる。

多次元配列

var scores = [
 [98, 88, 100],
 [80, 81, 97],
 [70, 85, 95]
]

参考サイト

連想配列

• 各要素に文字列キーでアクセス可能な配列
• Hash, Dictionary, mapとも呼ばれる。

関数

• 標準関数 => JSｇ標準で用意している関数
• ユーザー定義関数　=> ユーザーがつくった関数

###　関数の定義方法

1. function命令で定義する。
2. 関数リテラルで定義する。
3. Funtionコンストラクターで定義する。

function命令で定義する。

function 関数名(引数1, 引数2,....){
  //任意の処理
  return 戻り値
}

関数リテラル

関数名を持たない。

function(引数1, 引数2, ... ){
  //実行する処理
}

Function コンストラクタ

var 変数名 = new Function (引数1, 引数2, ..., 関数本体の処理);

まとめてみると。

//function命令
function getRectangle(height, width){
    return height*width
}

console.log(getRectangle(4,5))

//関数リテラル
var getRectangle = function(height, width){
    return height*width
};

console.log(getRectangle(5,4))

// Functionコンストラクタ
var getRectangle = new Function("height", "width", "return height*width")
console.log(getRectangle(3,4))