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

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


引数とは?

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

関数に情報を渡すとは?

引数.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)); 
このように引数分の値を書いてあげることで、デフォルト値を変更することができる。

コメント

このブログの人気の投稿

投稿時間:2021-06-20 02:06:12 RSSフィード2021-06-20 02:00 分まとめ(3871件)

投稿時間:2021-04-30 23:37:32 RSSフィード2021-04-30 23:00 分まとめ(42件)

投稿時間:2023-02-05 02:09:04 RSSフィード2023-02-05 02:00 分まとめ(9件)