그릇에 물을 조금 넣고 코드 몇 줄을 추가하고 카레 잎과 마살라(취향에 따라)를 추가하고 약한 불에서 25분 동안 요리합니다. 여기 커링 함수가 있습니다. 프로덕션에서 제공할 준비가 되었습니다. . 그냥 농담이에요.

안녕하세요, JS 개발자 여러분. 화제의 "함수 커링"으로 돌아왔습니다.

이 이야기는 다음을 다룹니다.

• 커링이란 무엇이며 어떻게 작동하며 왜 사용하는지.

이야기는 여기에서 시작됩니다

함수 커링이란 무엇입니까?

커링은 여러 인수[예: functionName(a, b,c)]를 받는 함수를 시퀀스에서 단일 인수를 받는 여러 함수로 변환하는 것입니다.

알았어 알았어.. 혼란스럽게 들린다는 걸 알아, 나도 처음 이 글을 읽었을 때 반응이 똑같았어.

쉽게 이해하겠습니다. 모든 인수를 한 번에 처리하는 함수(doSum), 즉 doSum(a, b, c) [아래 예: 일반 추가 함수.

시퀀스에서 한 번에 하나의 인수를 취하는 여러 함수(addNumbers(a), (b), (c))로 변환됩니다.

참고: 두 기능의 기능(목적)은 동일하며 이해를 돕기 위해 이름만 변경했습니다.

geeks for geeks 에 따르면 커링 기능은 다음과 같습니다.

여러 인수의 함수를 순차적으로 단일 인수의 여러 함수로 변환하는 함수형 프로그래밍의 기술입니다.

간단히 말해서 함수는 한 번에 모든 인수를 취하는 대신 첫 번째 인수를 취하고 다른 인수를 취하는 함수를 반환한 다음 다시 세 번째 인수를 취하는 다른 함수를 반환하는 식으로 모든 인수가 될 때까지 반복합니다. 찍었습니다(이름이 지정된 이미지의 예: 함수 커링).

커링은 어떻게 작동합니까?

자바스크립트의 커링은 자바스크립트이기 때문에 이해하기 약간 까다로울 수 있습니다

하지만 그 위에 올라가려고 노력합시다. 아래는 간단한 함수의 예입니다.

여기서 "doSum" 함수는 주어진 인수를 추가하고 전달된 모든 인수의 합계를 반환합니다.

아래는 동일한 기능의 커리 버전입니다(더 나은 이해를 위해 이름이 변경됨).

위 함수와 아래 함수의 출력은 동일합니다. 18

addNumbers는 위 함수 doSum의 커리 버전입니다. 부모 함수는 인수 5를 취하고 다른 익명 함수를 반환합니다. 이 함수는 또 다른 인수 6을 사용하며 모든 매개변수가 전달될 때까지 프로세스가 계속됩니다. 마지막 익명 함수는 모든 입력을 처리한 후 값을 반환합니다.

위의 예에서 중첩 함수를 구현했으므로 각 함수는 하나의 인수를 취하고 모든 인수가 완료되지 않을 때까지 다른 함수를 반환합니다.

바인드 함수와 클로저를 사용하여 두 가지 방법으로 함수를 커링할 수 있습니다. 어떻게 보이는지 봅시다.

바인드 함수를 사용한 함수 커링

바인드 기능이 무엇인지 모르는 경우 내 이야기를 확인하십시오 .

위의 예제에서는 javascript의 바인딩 기능을 사용하고 있으며 바인딩 기능을 사용하여 “onBoardUser” 기능을 커링하고 있습니다.

basicCompanyDetails는 온보딩된 모든 사용자에 대해 유사하므로 온보딩된 모든 사용자가 기본적으로 세부 정보를 사용할 수 있도록 하려고 합니다. 여기서 "basicCompanyDetails" 인수를 바인드 함수에 전달하고 "onBoardUser" 인스턴스를 생성합니다. 바인드 함수는 메모리의 특정 위치에 저장하고 나중에 실행할 수 있는 함수를 반환합니다. 여기에서 함수를 addUser에 저장하고 모든 사용자에 대해 호출합니다.

이것은 javascript에서 바인드 기능을 사용하여 기능을 카레하는 방법입니다. 아래 이미지에 더 많은 예가 있습니다.

addUserToSales 메서드를 호출하는 동안 두 매개변수를 모두 전달할 수도 있습니다. 그러면 동일한 결과가 출력됩니다.

클로저를 사용한 함수 커링.

클로저는 자바스크립트에서 매우 일반적이지만 까다로운 개념이지만 많이 논의되지는 않습니다 . 여기에서 클로저가 무엇인지 읽을 수 있습니다 .

클로저를 사용하여 함수 커링을 구현해 봅시다.

위의 예에서 우리는 하나의 인수를 사용하는 "onBoardUser" 함수를 생성했으며 다른 인수를 사용하여 세부 정보를 요약하고 반환하는 또 다른 익명 함수를 반환합니다.

하나의 인수 즉 accountDepartmentDetails 를 사용하여 "onBoardUser" 함수를 호출하고 이를 변수에 저장합니다(onBoardUser가 함수를 반환함을 기억하십시오). 그래서 우리는 함수를 변수 addUsertoAccounts 에 저장 하고 이제 변수에는 요청하는 인수이므로 인수(예: detailsOfJohn)와 함께 addUsertoAccounts 에 저장된 익명 함수(onBoardUser에 의해 반환됨)를 호출했습니다 .

함수가 호출되면 내부에 있는 명령문의 실행을 완료하고 출력을 인쇄합니다.

함수가 약 10,000줄의 코드 후에 호출된 경우 클로저이므로 동일한 출력을 인쇄하고 어휘 범위를 기억합니다.

ES6로 커링:

이것이 JS에서 클로저와 함께 함수 커링을 사용하는 방법입니다.

그럼에도 불구하고 머릿속에 한 가지 질문이 있을 수 있습니다. 함수에 여러 인수를 전달할 수 있다면 왜 커링이 필요합니까?

이것은 아마도 그 의심에 답할 것입니다.

그것이 사용되는 이유

왜요? 왜요? 왜요?

• 커링은 함수를 더 작은 함수로 나누는 기술이며, 각 개별 함수는 자체 작업을 가지며 함수를 순수하게 만들고 오류와 부작용이 덜 발생하도록 합니다.
• 예: 첫 번째 기능은 사용자 세부 정보를 확인하고 두 번째 기능은 회사 세부 정보를 확인합니다.
• 함수형 프로그래밍에서 고차 함수를 사용하는 데 사용됩니다.
• 코드를 깨끗하고 체계적으로 유지하는 데 도움이 됩니다.
• 또한 진행하기 전에 모든 것이 있는지 확인하는 데 도움이 되는 메커니즘으로 커링을 사용할 수 있습니다.
• 예: 필요한 인수를 얻지 못하면 각 중첩 함수가 실행되지 않습니다.