LoginSignup
4
2

More than 5 years have passed since last update.

JSの関数の引数について現在の理解を書いていく

Posted at

引数とは?

関数に情報を渡すための変数(関数が呼び出され流まで存在しない変数)

関数に情報を渡すとは?

引数.js
function avg(a,b){
   return (a + b) / 2 //引数a,bが関数内の情報に値を渡している(代入している)
}
let a = 5, b = 10; //定義
console.log(avg(a,b)); //avg関数の呼び出し 7.5

次は少し難しい

関数外で定義された変数名と引数名が同じ場合#プリミティブ編

まずはコードを。

function f(x){
    console.log(x); //3
    x = 5;
    console.log(x); //5
}
let x = 3;
console.log(x); //x=3の結果が表示
f(x);//関数fの呼び出し  引数x=変数xを代入 ここのxはletで定義したx=3の変数であって、引数ではない f(3)
console.log(x); //3 「あれ? 5じゃないの?」

一旦置いておき次の例

関数外で定義された変数名と引数名が同じ場合#オブジェクト編

function f(o){
   console.log(o.message); //messageの初期化
   o.message = "関数fのなかでmessageを変更した!"
   console.log(o.message); //関数fのなかでmessageを変更した!
}
let o = {
   message:"messageの初期化"
}: //オブジェクト作成
console.log(o.message); //messageの初期化
f(o); //関数の呼び出し
console.log(o.message); // ??

//=>関数fのなかでmessageを変更した!

これはJSのデータ型が関係しています。
このようにプリミティブ型とオブジェクト型で動作が異なる!

なぜ?

  • プリミティブ
    • 値型(value type):プリミティブ側が引数に渡されるとき値がコピーされる
  • オブジェクト
    • 参照型(reference type):オブジェクトが引数に渡されるときは同じオブジェクトを参照する

つまり!

プリミティブ
スクリーンショット 2019-01-15 14.42.47.png

オブジェクト
スクリーンショット 2019-01-15 15.53.47.png

デフォルト引数

function f(a, b=4){
   return `${a} - ${b}`;// a = 3, b = 4 
   // -1
}
console.log(f(3));

のような感じで、初期値として引き数に値を与えておくことも可能なのである。

デフォルト値の変化

function f(a, b=4){
   return `${a} - ${b}`;// a = 3, b = 2
   // 1
}
console.log(f(3,2));

このように引数分の値を書いてあげることで、デフォルト値を変更することができる。

4
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
2