TypeScript에서 함수 매개변수로 입력된 함수
TypeScript에서는 다양한 유형으로 구성된 다양한 변수와 함께 강력한 유형과 약한 유형의 함수를 다른 함수의 함수 매개변수로 전달할 수도 있습니다.
이는 JavaScript의 기능적 프로그래밍 패러다임으로 인해 다양한 함수가 다른 함수의 매개 변수로 전달될 수 있으며 TypeScript는 해당 함수가 입력되도록 보장합니다. 이 자습서에서는 입력된 함수를 함수 매개 변수로 사용하는 방법을 보여줍니다.
TypeScript의 함수에서 형식화된 콜백 사용
다양한 유형의 콜백을 함수 정의에 사용할 수 있습니다. 콜백은 서로 다른 유형을 가질 수 있으며 서로 다른 함수의 매개변수 역할을 할 수 있습니다.
다음 코드 블록은 이에 대한 데모를 보여줍니다.
enum LogLevel {
DEBUG,
INFO,
DANGER
}
interface LogFunction {
(message : string, level? : LogLevel) : void
}
function showLogMessage(message : string, level : LogLevel = 5) {
switch(level){
case LogLevel.INFO:
console.info("Message : " , message);
break;
case LogLevel.DEBUG:
console.debug("Message : " , message);
break;
case LogLevel.DANGER:
console.error("Message : " , message);
break;
default :
console.log("Message : " , message);
}
}
class Compute {
compute(callback :LogFunction) {
// Some Computation
var a = 5 + 6;
callback('Computed value of a : ' + a);
}
}
var computeObj = new Compute();
computeObj.compute(showLogMessage);
출력:
"Message : ", "Computed value of a : 11"
위는 유형이 지정된 함수가 다른 함수의 함수 매개 변수로 사용되는 방법을 보여줍니다. Compute 클래스에는 Compute 함수가 있으며 LogFunction 유형의 콜백을 받아 일부 계산 후 콜백을 호출합니다.
compute 함수를 호출하는 동안 callback 구현을 사용할 수 있습니다. 이 구현에서 showLogMessage는 LogFunction 인터페이스를 구현하는 데 사용됩니다.
TypeScript에서 인터페이스를 사용하여 매개변수로 입력된 함수
다른 함수에 매개변수로 전달되는 함수는 함수 정의에 정의된 유형을 가질 수 있거나 인터페이스를 사용하여 함수의 유형을 정의할 수 있습니다.
다음 코드 블록은 함수를 다른 함수의 매개변수로 전달하는 동안 달성할 수 있는 다양한 유형의 타이핑을 보여줍니다.
class Animal {
name : string;
constructor( name : string){
this.name = name;
}
showInfo(speak : () => void){
console.log(this.name);
speak();
}
}
var dog = new Animal('Dog');
dog.showInfo(() => console.log("Bark"));
출력:
"Dog"
"Bark"
위의 예는 showInfo 함수에 전달된 speak 콜백 함수의 인플레이스 유형 정의를 보여줍니다. speak 기능은 정의로 인터페이스를 가질 수도 있습니다.
interface SpeakCallBackFn {
() : void
}
class Animal {
name : string;
constructor( name : string){
this.name = name;
}
showInfo(speak : SpeakCallBackFn){
console.log(this.name);
speak();
}
}
var cat = new Animal('Cat');
cat.showInfo(() => console.log("Meow"));
출력:
"Cat"
"Meow"
따라서 위는 인터페이스를 사용하여 입력된 함수의 구현을 보여줍니다.
