Closed4日前にクローズ3

関数を作る

関数の定義
JavaScriptつみあげトレーニングブックより

c6_1_1.js

let manuf0rder = () => {
    console.log(`忍者です。
    本日、手裏剣3個の製造をお願いします。`);
}


manuf0rder();

1~4行目で関数を定義し、その関数を変数　manuf0rder　に入れていく。7行目の「manuf0rder」で定義したmanuf0rder関数を呼び出していく。
関数は定義しただけでは何も起こらない。呼び出されて初めて中に書かれた処理を実行する。

c6_1_2.js

let manuf0rder2 =(name) => {
    console.log(`${name}様
    忍者です。
    本日、手裏剣3個の製造をお願いします。`);
}

manuf0rder2('服部');
manuf0rder2('河村');

アローの前のカッコの中に引数を書くと、呼び出した元から引数を受けとる。
アロー関数は、引数が一つだけの場合は「()」を省略することができる。

c6_1_3.js

let manuf0rder3 =(name,order) => {
    console.log(`${name}様
    忍者です。
    本日、${order}の製造をお願いします。`);
}

manuf0rder2('服部','手裏剣3個');
manuf0rder2('河村','まきびし4個');

関数を定義するとき関数名の後ろにカッコで囲んで書かれる引数を仮引数、関数を呼び出すとき実際に渡される値を実引数と呼び区別する事がある。

c6_1_4.js

let get0rder = (shurikenNum,makibishiNmu) =>{
    let orderText ='';
    if (shurikenNum > 0){
        onabort += `手裏剣${shurikenNum}個`;
    }
    if (makibishiNmu > 0){
        orderText += `まきびし${makibishiNmu}個`;
    }
    return orderText;
}

let manuf0rder4 = (name,order) => {
    console.log(`${name}様
    忍者です。
    本日、${order}の製造をお願いします。`);
}

manuf0rder4('服部',get0rder(3,0));
manuf0rder4('河村',get0rder(1,4));

自分で定義する関数でも、呼び出し元に戻り値を返す事ができる。戻り値を返すには関数の中でreturn文を書き、戻り値として返したい値や式を書く。
return文が実行されると、returnの直後に書かれた値や式を戻り値として、呼び出した関数から抜け出す。関数から戻り値を返すようにしておくと、複数の関数を組み合わせて使う時に便利。

ああああ

さまざまな関数
JavaScriptつみあげトレーニングブックより

c6_2_1.js

let wokashi =(spring, summer , fall, winter) => {
    console.log(`春は${spring} 夏は${summer}
    秋は${fall} 冬は${winter}`);
}

wokashi('あけぼの','夜','夕暮れ');

JavaScriptでは、関数を呼び出すとき、実引数と仮引数の数が一致していなくてもエラーにはならない。
エラーが出ていないとはいえ特別な意図がない限り実引数と仮引数の数が一致していなければ不具合の元となる。

c6_2_2.js

let wokashi2 =(spring, summer , fall, winter='つとめて') =>{
    console.log(`春は${spring} 夏は{summer}
    秋は${fall} 冬は${winter}`);
}

値を指定されなかった引数の値はundefinedになっている。このような事を避けるには、仮引数のデフォルト値を指定する。デフォルト値は、実引数が渡されなかった場合の仮引数の値を代入式のような形で指定できる仕組み。

c6_2_3.js

let introduceFriends = (...friends) => {
    for (friend of friends) {
        confirm.log(`${friend}は桃太郎の友達。`);
    }
}

introduceFriends();
introduceFriends('犬');
introduceFriends('犬','猿','キジ');

関数を定義するとき、最後の引数の前に...をつけると、0個以上の引数が配列にまとめられてその仮引数に渡される。このことを残余引数という。
プログラムで、introduceFriends関数を呼び出す際、引数として書いた全ての値が配列にまとめられ、仮引数friendsに渡される。

ああああ

関数を引数として渡す
JavaScriptつみあげトレーニングブックより

c6_3_1.js

let wodrs = ['beautiful','big','strong'];
let result =wodrs.filter((word) => word.length >6);

filterメゾットは真偽値を返す関数として受け取るメゾットで、関数の実行結果がtrueになるよう要素だけを新しい配列にして返す。

このスクラップは4日前にクローズされました