Edited at

#4. アロー関数


引数0個

'use strict'

let noParamfunc = () => {
const value1 = 50;
const value2 = 30;
return value1 + value2;
}
let noParamfuncReturn = noParamfunc();
console.log(noParamfuncReturn);
// console => 80


引数1個

'use strict'

let singleParamfunc = (param1) => {
return param1;
}
let singleParamfuncReturn = singleParamfunc(10);
console.log(singleParamfuncReturn);
// console => 10


引数N個

'use strict'

// (param1, param2, .. paramN)
let multiParamsfunc = (param1, param2) => {
return param1 * param2;
}
let multiParamsfuncReturn = multiParamsfunc(10, 20);
console.log(multiParamsfuncReturn);
// console => 200


アロー関数における "this" の扱い

'use strict'

// 変数の定義
this.message = 'sample1';

// ----------------------------------------------------------------------------

// 通常の関数の定義
function normalFunc() {
console.log(this.message);
}

// normalFuncの実行
normalFunc();
// console => sample1

// messageの値をsample2にバインドしてnormalFuncNewを作成
const normalFuncNew = normalFunc.bind({ message : 'sample2' });

// normalFuncNewの実行
normalFuncNew();
// console => sample2

// ----------------------------------------------------------------------------

// アロー関数の定義
let arrowFunc = () => {
// アロー関数の場合、thisは定義元を参照する
console.log(this.message);
}

// arrowFuncの実行
arrowFunc();
// console => sample1

// messageの値をsample3にバインドしてarrowFuncNewを作成
const arrowFuncNew = arrowFunc.bind({ message : 'sample3' });

// arrowFuncNewの実行
arrowFuncNew();
// console => sample1 "アロー関数はthisを縛るのでsample3にならない"