콜백함수, 비구조화 할당

인프런에서 한입크기로 잘라먹는 리액트 강의를 듣다가 문과의 언어로 이해되지 않는 것들이 있어서 찾아봤다.

 

1. 콜백함수란 무엇인가?

  콜백은 호출한다는 뜻이다. 함수를 호출해서 다른 함수에 전달하여 사용하는 것이 콜백 함수다. 호출된 함수는 호출 한 함수 안에서 어떤 조건을 만족하거나 이벤트가 일어날 때 실행한다.

 

 예를들면  이런것인데,

 함수 1 {
   함수 2
 }
 
 함수 2 { }

함수 1을 실행해야 그 안에서 함수 2가 돌아간다.

저런 형식의 함수를 고차함수라고 부르고, 고차 함수 안에서 호출되어 사용되는 함수(함수2)를 콜백함수라고 부른다.

 

그리고 저렇게 함수1이 실행될 때 함수2를 실행시키고, 함수 2가 실행될 때 함수 3이 실행되고...........를 

이름하여 콜백지옥이라고 부르는 것 같다.

함수1 {
  함수2 {
    함수3 {
      함수4 {
        ....콜...백...지..옥..... 
    }
  }
}

만약 그렇다면... 최종적인 함수4를 실행하기 위해 1을 거쳐 2를 거쳐 3을 거쳐야 하기 때문에 매우 비효율적인 코드가 된다. 이렇게 함수1 -> 함수2 -> 함수 3-> 함수4처럼 순차적으로 실행되는 방식을 동기 방식이라고 하는데, 아주 로지컬하고 예뻐 보이지만 대기시간이 길어질 수 있다는 단점이 있다.

 

1-1. 비동기 방식

 본래 자바스크립트의 처리 방식은 비동기 방식이다. 함수가 여러개 있으면, 하나의 함수 결과값이 반환되기 전에 다른 함수들을 실행해서 결과값을 요청하는 것이다. 그러니까 함수1, 함수2, 함수3, 함수4가 있으면 함수1의 값이 반환되지 않았다 하더라도 함수 2, 3, 4에 대한 반환값을 요청하는 방식인거다.

 

1-2. 그럼 어쩌라는건가?

  자바스크립트는 비동기방식으로 실행되지만, 때때로 콜백함수형식의 동기처리를 요구해야 할 때가 생긴다.  이때, 콜백지옥을 방지하기 위해 생겨난 명령어가 promise 라고 한다. 그리고 이 promise는 매우 복잡해서, 이 promise 를 조금 더 쉽게 사용하기 위해 등장한 것이 asynce 와 await 라고 한다. 

promise 이후부터는 공부를 조금 더 해야겠다.

 

출처 : 자바스크립트 완벽가이드(코뿔소책), https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Promise

 

 

2. 비구조화 할당이란 무엇인가?

 - spread 연산자를 배우며 알게된 말이다.

 - 배열은 본래 값을 지칭하는 프로퍼티가 따로 없는데, 비구조화 할당을 하게 되면 각 값에 인덱스 값말고 다른 이름을 붙여줄 수 있다. 마치 객체처럼!!! 

 - 혹은 객체의 '프로퍼티 : 값'을 조각조각 내어서 각각 변수에 할당할 수도 있다. 프로퍼티가 변수명이 되는 방식.... 

 - 알고보니 비구조화 할당의 다른 말이 '구조분해 할당'이라고 한다.

 

 

 

-끗-