[자바스크립트] 익명함수, 화살표 함수, 콜백함수

let onComplete = () => { console.log('동막골'); };
class Welcome {
	to(onComplete) {
		onComplete();
	}
}

const welcome = new Welcome();
welcome.to(onComplete); //동막골

 

익명함수

 

형식 ) var(혹은 let) 변수명 = function(매개변수명 : 자료형) {
              처리구문
          }
변수가 함수의 이름을 대신하게 되고, 이 변수를 사용해서 함수의 기능을 실행할 수 있다.
자바스크립트, 함수를 만들때 사용하는 일반적인 방법

 

var pow_ = function(x:number){ //function pow_(x:number)
    console.log('x=>'+x);
    return x*x;
}
console.log(pow_(10));
/*
    매개변수의 자료형을 쓰지 않으면, 어떤 자료형이든 받을 수 있는 any(default)
    하지만 권장하지 않는다. 자료형은 명시하자
*/
const test_=x=>x*x;
console.log(test_(20)); 

출처: https://velog.io/@jkzombie/Typescript-%EC%9D%B5%ED%9E%88%EA%B8%B0-arrow-%ED%99%94%EC%82%B4%ED%91%9C%ED%95%A8%EC%88%98

 

화살표 함수의 호출

화살표 함수는 익명함수

그렇기 때문에 항상 함수 표현식으로 변수로 선언하거나, 콜백함수의 형식으로 사용

 

// 변수 선언
const logging = (x) => console.log(x)
logging('Hello world')


// callback
const info = ['name', 'age', 'address']
info.map((data) => {
	console.log(data)
})

 

위와 같이 사용

출처: https://gngsn.tistory.com/19 [pageseo]

 

콜백 함수 (Callback function)

자바스크립트에서 함수는 객체이기 때문에 함수의 매개변수로 전달할 수 있는데, 다른 함수에 매개변수로 넘겨준 함수를 콜백 함수라고 부른다. 어떠한 이벤트가 발생하면 매개변수로 전달된 함수로 다시 호출되기 때문에 callback이라는 표현을 쓴다.

let numbers = [1, 2, 3, 4, 5, 6, 7];

function isOddNumber(num) {
  return num % 2;             // number%2 === 1 (true), number%2 === 0 (false)
}

출처 : https://velog.io/@ktg6360/TIL-008-%EC%BD%9C%EB%B0%B1-%ED%95%A8%EC%88%98%EC%99%80-%ED%99%94%EC%82%B4%ED%91%9C-%ED%95%A8%EC%88%98