２パターンのコードを書いてみました。

１つ目は関数内部で外のスコープの関数を直接使っているパターンです。
２つ目は関数の引数に外のスコープの関数を値として渡して、引数で渡された関数を実行しているパターンです。

どっちが良いかというと、おそらく、２つ目の方なのではないかというのは感覚的に分かります！
だって２つ目のはDependency Injection(依存性の注入）みたいなものですもんね！！
（あまりDIもよく理解できていないので困ったものです）

ただ、仮に２つ目のほうが好ましいとした場合、なぜ、好ましいのか、どういったメリットがあるのか、１つ目だと何がまずいのか、どういうときに困るのかってのがよくイメージ出来ません。

どなたか解説いただけませんでしょうか？

A

// 実際は他ファイルからimportしていると仮定して…
// import importedFunction from './somewhere'

const importedFunction = (arg) => {
	return arg + '!!!'
}

const returnSomething = () => {
	
	return importedFunction('something');
}

returnSomething()

B


// 実際は他ファイルからimportしていると仮定して…
// import importedFunction from './somewhere'

const importedFunction = (arg) => {
	return arg + '!!!'
}

const returnSomething = (func) => {
	
	return func('something');
}

returnSomething(importedFunction)

m.ts10806

2017/10/10 09:55

ご自身ではどのようにお考えでしょうか？

退会済みユーザー

2017/10/10 09:59

質問文に書いたとおり、ざっくりとしたところでは後者のほうが依存性が外から注入されているので、粗結合でテストもしやすく、再利用性も高まるのではないかと思います。という、それらしいことは言えるのですが、自分で言っててよくわかってません（苦笑）

行動規範の内容に同意します

回答1件

ベストアンサー

AとBは目的に応じて使い分けるものであって、
どちらのほうが好ましいですか？という類のものじゃないね。

まずはAを選択すべき例を挙げてから、Bの使い方を見ていこうか。
例として台形の面積を求める関数を、三角形の面積のロジックを流用して作る事をやってみる。

JavaScript
1// 引数と戻り値はマスキング
2// 三角形の面積を求める関数
3const triangle => (xxxxx) {  
4  return yyyyy;
5}
6// 台形の面積を求める関数
7const trapezoid => (xxxxx) {
8  return yyyyy;
9}

さて、これを使うコードはどちらが好ましいだろうか？

JavaScript
1trapezoid(3, 4, 5);
2trapezoid(3, 4, 5, triangle);

台形の面積は(上底 + 下底)* 高さ / 2と決まりきってるわけで、
必要な引数は「上底、下底、高さ」の3つ。
つまり台形の面積を出すのに、三角形の面積を導く公式なんて不要なんだよ。

従って前者と書くのが自然であり、後者はノイズが混じっている。
要するに簡単な事を難しくやってしまっている悪い例になってしまうわけだね。
結局、これが自然。

JavaScript
1const triangle = (width, height) => {
2  return width * height / 2;
3}
4const trapezoid = (upperBase, lowerBase, height) => {
5  return triangle(upperBase, height) + triangle(lowerBase, height);
6}
7
8trapezoid(3, 4, 5);

Bのやり方を行う場合、ロボットの右手に剣をもたせるか、弓をもたせるか、銃をもたせるかを選ぶように、
ベースになる関数が沢山あってその中から選択する仕組みでなければならない。
カリー化や部分適用を利用して、関数の中身で同じように叩いても動作が変わるとかね

この辺は使い方も事情もDIと全く一緒。
オブジェクトになってコンストラクタメソッドの引数になるか、
カリー化でもされて第一引数の関数として挿入されるかの違いでしかない。

サンプルとしてカリー化や部分適用を組み合わせて色々やってみた。
まぁ、JSで凝った事がしたければRamda.jsは必須かな。

JavaScript
1const R = require('ramda')
2const triangle = R.curry((width, height) => width * height / 2)
3const trapezoid = R.curry((fn, upperBase, lowerBase, height) =>
4  R.pipe(
5    R.append(upperBase),
6    R.append(lowerBase),
7    R.map(triangle(R.__, height)),
8    R.sum
9  )([])
10)(triangle)
11
12const trapezoid_at_height5 = trapezoid(R.__, R.__, 5)
13trapezoid_at_height5(3, 4); // 17.5