React Currying

Curryingという反応でよく使われる概念があります.
Currying

カードリングは、複数のパラメータを受信する関数の一部のパラメータを固定するための新しい関数を作成する方法である.

因子は、複数の関数を複数の使用に分離することができる.

使用方法

function aaa(a, b) {
	console.log( a + " " + b )	
}

aaa("hello", "world!")  // hello world

パラメータ出力の関数としてaとbを受け入れます.
この関数にcurringを適用すると、次のようになります.

function aaa(a) {
	return function bbb (b) {
    	console.log( a + " " + b )	
    }
}

const ccc = aaa("hello")
ccc("world!")  // hello world

前述したように,複数のパラメータを受け入れる関数を2つに分けて用いることが分かる.
彼は言った:私たちは新しい関数を作成して、上記の因子の一部を固定します.
すなわち、aaa(a)関数では、パラメータに「hello」という値を固定し、ccc()関数のパラメータのみを後で変更して使用することができる.

const aaa = (a) => (b) => {
    	console.log( a + " " + b )	
    }
}

const ccc = aaa("hello")
ccc("world!")  // hello world

以上のように矢印関数で記述することができ,コードの長さがやや減少する.
また、可読性も向上しました.
使用する理由
いくつかのパラメータに対して同じ値を繰り返し使用する場合、これらの繰り返しのパラメータを固定することで、繰り返しを最小限に抑えることができます.

aaa("hello", "world")
aaa("hello", "chulsu")
aaa("hello", "huni")

上記の繰り返しの因子が存在すると仮定する.

const aaa = (a) => (b) => {
	console.log( a + " " + b )
}

const ccc = aaa("hello")
ccc("world")  // "hello wordl"
ccc("chulsu") // "hello chulsu"
ccc("huni") // "hello huni"

では,上記のようにcurringを用いることで繰返し因子を解決できる.
どこに使いますか.
例として、特定のラベルにIDを提供し、そのIDを受信するとします.

export default function() {
	
  const onClickGetId = (event) => {
  	console.log(event.target.id)
  }
  
  return (
  	<div onClick={onClickGetId} id="any">클릭시 아이디를 가져옴</div>
  )
  
}

上記の方法でインポートできます.
しかしながら、上記の方法のプロジェクト規模が大きいほど、予想外の重複idを作成する可能性が高く、予想外の問題が生じる可能性がある.

export default function () {
  
  const onChangeGetIdValue = (id) => (event) => {
    
    console.log(id, event.target.value);
    
  };

  const getId = onClickGetId("any");

  return <input onChange={getId} type="text" />;
}

上は点呼テクニックで、IDとInputラベルに同時に価値をもたらすことができます.
まず、パラメータとしてidおよびeventをそれぞれ与える高次関数を構築する.
次に、新しい変数に必要なid名をパラメータとして追加し、それに割り当てます.
次に、onChangeのような特定のイベントを検出する属性をラベルに追加し、関数に指定された変数を実行させると、eventの価値値と必要なidが得られる.