これは、オンラインプログラミング学習サービス「ウェブカツ!!」にて、
javascript・jQuery部中級のオンライン学習で使用しているコードになります。
目次
3. 関数
jsの関数はややこしい。他の言語を習得している人が理解しづらい部分。
3.1. 関数の定義方法
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
// 関数の定義方法は３種類 // 1.function命令 // 2.Functionコンストラクタ // 3.関数リテラル // 1.function命令 function myFunc(){ } // 3.関数リテラル var myFunc = myFunc(){ }; // セミコロンがつくので注意 myFunc = 69; // 普通に別の値を入れることもできる |
3.2. 変数のスコープ
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
// 関数の外で定義するとグローバル変数 var globalVal = 69; console.log(globalVal); // 69 // 関数の中で定義するとローカル変数 function myFunc(){ var localVal = 69; } console.log(localVal); // undefined // これがややこしいけどそういうもんだと思うしかない var val = 69; function myFunc(){ console.log(val); // undefined var val = 9999; } // myFuncの中で呼んだvalはローカル変数のvalを呼んだことになる。ローカル変数valはまだ未定義なのでundefinedになる。 |
3.3. 関数の引数
3.2.1 関数では、引数のチェックは行われない！
|
1 2 3 4 5 |
function myFunc(num){ console.log(num); } myFunc(69); // 69 myFunc(69, '第二引数を入れちゃった！'); // 普通のプログラミング言語はエラーが出るが、jsでは普通に処理される！ |
3.2.2 ２つ関数を作ったらどっちで処理される？
|
1 2 3 4 5 6 7 8 9 |
function myFunc(num){ console.log('第１引数のみの関数です。'); } function myFunc(num, str){ console.log('第２引数まである関数です。'); } myFunc(69); myFunc(69, '第二引数を入れちゃった！'); // 同じ関数を上書きしただけ！PHP言語であれば、別の関数として扱われるのに、、、 |
3.2.3 引数をチェクしよう
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
// argumentsオブジェクトは関数内だけで使えるオブジェクトで、関数を作ると自動で作成されるもの // 関数で使う引数は全てargumentsオブジェクトで管理されている function myFunc(){ console.log(arguments[0]); console.log(arguments[1]); } myFunc(69, '第二引数を入れちゃった！'); // なので、lengthでチェックする function myFunc(val1, val2){ if(arguments.length !== 2){ throw new Error('引数が不正です'); } console.log(val1 + val2); } myFunc(69); // 関数を作る時には「引数チェック」と「エラーハンドリング」を必ずしよう！ |
