関数
とうとうやって来ました−！関数のお時間です。
さて、そもそも関数が何者なのか。
昔学校で習った関数といえば
x=2yの場合において
y=5だったらxの値はいくらか？
みたいなやつでした。
こんなやつだったらものすごく簡単ですが、
Javascriptの関数はもっと複雑でとっつきにくいイメージ。
今日は頑張ってそのイメージをぶち破っていこうと思います。
関数とは
プログラミングをしていると同じような処理を繰り返し使う場面が出てきます。
そのときに毎回処理を書くのはめんどくさいということで関数を使います。
つまり関数とは複数の処理をまとめて名前をつけたもの。
基本的な構文
<script>
function hello() { // 関数名はhalloだよ
console.log("おはよう"); //おはようとコンソールに表示する命令だよ！
}
hello(); // 関数名ハローの処理を呼び出すよ！
</script>
オプションを追加したい場合は関数名のあとにくる()に引数を指定することで追加することができます。
<script>
function hello(name) { // 関数名はhallo、nameはオプションだよ！
console.log("おはよう" + name); //おはようのあとにname内容をコンソールに表示する命令だよ！
}
hello("佐藤"); // 関数名はhallo、nameの内容は佐藤だよ！
hello("高橋"); // 関数名はhallo、nameの内容は高橋だよ！
</script>
これで
おはよう佐藤
おはよう高橋
が書き出されます。
処理にreturnを使うことで関数から返り値を取得することもできます。
<script>
function hello(name) { // 関数名はhallo、nameはオプションだよ！
return "おはよう" + name; //おはようのあとにname内容を取得するよ！
}
var greet = hollo("佐藤"); //greetはおはよう佐藤だよ！
console.log(greet); // おはよう佐藤をコンソールに書き出すよ！
</script>
ローカル関数
下のように関数のなかで変数を宣言した関数はローカル関数と呼ばれます。
ローカル関数はその関数内でのみ有効な関数になります。
下のようにしていた場合、処理が関数の外にあるので、greetの処理は実行されません。
<script>
function hello(name) {
var greet = "おはよう" + name; //ローカル変数
}
console.log(greet);
</script>
即時関数
今までは関数を書いてから処理をかくという流れを見てきました。
次は処理を書かなくても処理される即時関数を見ていきます。
<script>
(function hello() {
console.log("おはよう");
})();
</script>
このように書くことで呼び出しをしていませんが、
コンソールにはおはようと書き出されます。
また、呼び出してすぐに使われるので関数名を省略することもできます。
<script>
(function () {
console.log("おはよう");
})();
</script>
引数を指定することもできます。
<script>
(function (name) {
console.log("おはよう" + name);
})();
</script>
今日はここまでにします。
また明日もjsです！
