JavaScriptの関数定義と使い方

はじめに

ポートフォリオを作成するに当たってJavaScriptの必要性を感じたので勉強を始めました。

JavaScriptの関数定義についてアウトプットしていきたいと思います。

さっそく書いていきます。

コンソールに名前を出力したい場合には

main.js

console.log('hello yamada');

問題ないですね。 hello yamada と出力されます。
この名前の部分を動的に変えたい場合は変数を使います。
例えば

main.js

let name = 'yamada';
console.log('hello' + name);

さきほどと同様にhello yamadaと出力されます。では、この名前の部分をほかの名前でどんどん出力したい場合はどうしたらいいでしょうか！

main.js

let name = 'yamada';
console.log('hello' + name);
let name2 = 'yamada2';
console.log('hello' + name2);

hello yamada
hello yamada2 と出力されます。
このように記述するやり方もあるのですが、このような記述はプログラム的には良くないケースみたいです。記述量も多くなりますし、バグを生みやすくなります。
そのような時に関数を使用します！

main.js

function hello(name) {
   console.log('hello' + name);
}

hello('yamada');
hello('yamada2');

この関数の記述でも、さきほどと同様に
hello yamada
hello yamada2
と出力されます。
hello();と記述することにより、helloという関数にnameという変数を渡してあげて、どんどん渡された変数がconsole.logに実行される仕組みになります！
()は関数の実行を意味するので、このようにhello();とすることで、定義した関数を実行することができます！
hello という関数には変数を渡せますので、こちらに先ほどのyamadaという文字列を渡してあげます。
nameの部分は引数と呼ばれていて、この引数は複数いれることもできます！
例えば、

main.js

function hello(name, age) {
   console.log('hello' + name + age);
}

hello('yamada', 10);
hello('yamada2', 20);

hello yamada10
hello yamada220となりました。

おわりに

今回は簡単に関数の使い方について、アウトプットさせていただきました。
関数の記述の仕方はほかにも色々あるので、また別で解説できたらと思います。