JavaScript의 유틸리티 함수 프로그래밍 - 부작용 및 순도

편집: 이 글은 나의 최초의 의도를 전달하는 데 그다지 잘하지 못했기 때문에 그것은.나는 네가 수정판을 읽는 것을 건의한다. 비록 역사적 목적에서 비롯되었지만, 나는 원판을 보류했다.
안녕하세요.🌍. 제 함수 프로그래밍 시리즈의 n기: 자바스크립트의 실용적인 함수 프로그래밍을 읽었습니다.이 아름다운 날에 나는 두 가지 방법을 합쳐 문제를 해결하고 생활을 간단하게 할 것이다. 부작용과 순수함이다.
순도를 이야기합시다.함수에 다음 속성이 있으면 순수 함수라고 합니다.

동일한 매개 변수에 대해 반환값이 같음

부작용이 없다는 평가(source

다음은 부작용from stackoverflow이다.

A side effect refers simply to the modification of some kind of state - for instance:

• Changing the value of a variable;
• Writing some data to disk;
• Enabling or disabling a button in the User Interface.

여기에 또 부작용의 예가 있다

파일에서 데이터 읽기

REST API에 요청

데이터베이스 쓰기

데이터베이스에서 읽기

콘솔에서 로그아웃

기본적으로 당신의 기능과 범위 밖의 세계의 모든 상호작용은 부작용입니다.너는 부작용을 계속 사용하고 있을 것이다.네가 처음으로 컨트롤러에 접속한'안녕, 세상'도 부작용이다.
부작용이 가득한 세계에서 기능 프로그래머로서 당신의 목표는 이러한 부작용을 프로그램의 경계로 격리시키는 것이다.부작용을 분리하면 순도가 발휘된다.본질적으로 말하자면 순도는 데이터 흐름과 관련이 있다. 예를 들어 데이터가 어떻게 한 프로세스에서 다른 프로세스로 전환되는지.부작용과 대비되며 부작용은 외부 일만 하는 것과 관련이 있다.부작용과 순도에 따라 프로그래밍 관심사를 분리하면 코드의 구조가 더욱 뚜렷해진다.
이것은 불순함수add10입니다.

let numCalls = 0

const add10 = number => {
  console.log('add10 called with', number)
  numCalls += 1
  console.log('add10 called', numCalls, 'times')
  return number + 10
}

add10(10) /*
> add10 called with 10
> add10 called 1 times
> 20
*/

add10 로그아웃 콘솔, 변이 변수numCalls와 다시 로그아웃하는 부작용이 있다.콘솔 로그는 콘솔을 로그아웃하고 외부 세계에 존재하기 때문에 부작용이다add10.점증numCalls도 부작용이다. 같은 스크립트의 변수를 인용했지만 add10의 범위를 넘어섰기 때문이다.add10 불순하다.
컨트롤러 로그와 변수 변이를 없애면 순수add10를 얻을 수 있다.

let numCalls = 0

const add10 = number => number + 10

console.log('add10 called with', 10) // > add10 called with 10

numCalls += 1

console.log('add10 called', numCalls, 'times') // > add10 called 1 times

add10(10) // > 20

아, 달콤한 순수함.현재add10는 순수하지만 우리의 부작용은 모두 엉망이다.만약 우리가 이 문제를 해결하고 싶다면, 우리는 고급 함수 프로그래밍 함수의 도움을 필요로 한다.
함수 프로그래밍 라이브러리에서 이러한 함수를 찾을 수 있습니다. 예를 들어 rubico, True로 작성된, Ramda 또는 RxJS 등입니다.라이브러리를 사용하지 않으려면 vanilla JavaScript에서 이 함수의 자체 버전을 실행할 수 있습니다.예를 들어 우리가 사용할 함수의 최소 버전pipe과 tap을 다음과 같이 실현할 수 있습니다.

const pipe = functions => x => {
  let y = x
  for (const f of functions) y = f(y)
  return y
}

const tap = f => x => { f(x); return x }

우리는 그것들을 사용하여 부작용과 순도에 대한 사고를 간소화할 것이다.

파이프는 일련의 함수를 받아들여 연결시키고 이전 함수의 출력으로 다음 함수를 호출합니다.pipe 이런 방식으로 데이터 흐름을 만들었기 때문에 우리는 그것으로 순도를 고려할 수 있다.pipe's documentation 에서 실행 가능한 예시를 찾을 수 있습니다.

tap는 단일 함수를 받아들여서 전달된 모든 입력을 항상 되돌려줍니다.한 함수에서 tap 을 사용할 때, 당신은 기본적으로 "이 함수의 반환에 관심이 없다. 입력으로 함수를 호출하고 나의 입력을 되돌려주기만 하면"이라고 말한다.부작용에 매우 유용하다.tap's documentation 에서 실행 가능한 예시를 찾을 수 있습니다.

이것은 첫 번째 예의 재구성으로 사용pipe과tap의 부작용을 계산한다.만약 이 예가 좀 낯설어 보인다면, 나의 이전 문장을 참고하세요.

const logCalledWith = number => console.log('add10 called with', number)

let numCalls = 0

const incNumCalls = () => numCalls += 1

const logNumCalls = () => console.log('add10 called', numCalls, 'times')

const add10 = number => number + 10

pipe([
  tap(logCalledWith), // > add10 called with 10
  tap(incNumCalls),
  tap(logNumCalls), // > add10 called 1 times
  add10,
])(10) // > 20

우리는 자신의 함수logCalledWith, incNumCalls, logNumCalls에서 컨트롤러 로그와 변수 돌연변이 부작용을 정의하여 프로그램의 경계로 격리시켰다.우리는 또 이전의 순수 add10 함수를 보존했다.최종 프로그램은 부작용 함수와 순수 함수로 구성되어 명확한 관심사 분리를 가지고 있다.pipe를 통해 우리는 데이터 흐름을 볼 수 있다.사용tap, 부작용을 지정하고 격리합니다.이것은 조직적이다.

부작용과 순결을 통해 문제를 해결하면 생활이 수월해진다.오늘 저는 여러분께 컨트롤러 로그가 필요하다면tap을 사용하라는 경험칙을 남겨 드리겠습니다.
다음에 나는 map,filter과reduce를 사용하여 데이터 전환을 깊이 연구할 것이다.읽어주셔서 감사합니다!너는 루비코awesome resources에서 이 시리즈의 나머지 부분을 찾을 수 있다.다음에 뵙겠습니다. JavaScript 유틸리티 함수 프로그래밍 - 변환 소개