JavaScriptの引数とは?
2020/03/07
昔はサイト制作の際にはちょっとしたアニメーションをつけたり、ドロワーなどの実装程度しかやってこなかったので引数の必要性を感じませんでした。
引数?いんすう?ひきすう?なんじゃそら程度でやってましたら痛い目をみた記憶があるので備忘録として載せておきます。
フロントエンドエンジニアを目指している方やコーダー、webデザイナーだけどJavaScriptをスマートに記述したいと考えている方向けですのでよろしければ一読くださいな。
JavaScriptの引数について
引数の読み方は”ひきすう”です。最初はいんすうだと思ってました。
さて、では簡単な例をもとに説明します。
(例)
var test = function(x,y){
alert(x + y)
}
test(‘Hello’ , ‘World’)
上記を例にすると変数「test」にアラート機能を格納している状態だが、値はx,yの引数(ひきすう)となっている。
引数は()の中でカンマ区切りで複数設定することができる。つまり上記は「x」と「y」の引数を持っている状態
そこで変数「test」の引数「x,y」に対して同様に区切りで設定した値を渡すことによって引数が変化する
今回は「x」に「’Hello’」、「y」に「’World’」が代入される。よってアラート表示される内容は(x + y)つまり(Hello World)となる。
つまりあらかじめ関数を用意しておき、そこに値を入れることによって一つ処理を実行する
関数を用意しておくことのメリットは値を追加するだけであらかじめ用意された式を用いて処理することができるので、したがってコードを短縮することができる
たとえば上記のアラート関数の場合、複数のアラート内容を表示したいとする。内容毎にアラート関数を書いてもいいがそうなると
(例)
1 2 3 4 5 6 |
$(function(){ alert('Hello World'); }); $(function(){ alert('これはテストです'); }); |
上記のように記述すると冗長になり変更が生じた際に面倒なので
var test = function(x,y){
alert(x + y)
}
test(‘Hello’ , ‘World’)
test(‘これは’ , ‘テストです’);
と記述すれば順番に表示することが可能
※計算式を例にするとかでもいいかも
同じ効果を複数のIDに適用したいときに有効