Higher-order function types in Typescript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

Output of a higher-order function returning a function

What is the output of the following TypeScript code?

Typescript

function multiplier(factor: number): (input: number) => number {
  return (input: number) => input * factor;
}
const double = multiplier(2);
console.log(double(5));

A undefined

B 10

C TypeError

D 25

💡 Hint

Think about what the returned function does with the input.

The function multiplier returns a new function that multiplies its input by the factor. Calling double(5) multiplies 5 by 2, resulting in 10.

🧠 Conceptual

intermediate

Type of a function that takes a function and returns a function

Which TypeScript type correctly describes a function that takes a function (number => string) and returns a function (string => number)?

A (fn: (x: number) => string) => (y: string) => number

B (fn: (x: string) => string) => (y: number) => number

C (fn: (x: number) => number) => (y: string) => string

D (fn: (x: string) => number) => (y: number) => string

💡 Hint

Look carefully at the input and output types of the inner functions.

The function takes a function from number to string and returns a function from string to number, matching option A.

🔧 Debug

advanced

Identify the error in higher-order function type usage

What error does this TypeScript code produce?

Typescript

function compose(f: (a: number) => string, g: (b: string) => boolean): (x: number) => boolean {
  return (x: number) => g(f(x));
}
const result = compose((n) => n.toString(), (s) => s.length > 2)(10);
console.log(result);

A No error, outputs true

B TypeError at runtime

C TypeScript compile error: Argument of type '(n: number) => string' is not assignable to parameter of type '(a: number) => string'

D TypeScript compile error: Type 'boolean' is not assignable to type 'string'

💡 Hint

Check if the function types match and the composition is valid.

The compose function correctly composes f and g. f converts number to string, g converts string to boolean. The final function returns boolean. The call outputs false because '10' length is 2, so s.length > 2 is false.

📝 Syntax

advanced

Which option causes a syntax error in higher-order function type declaration?

Which of the following TypeScript function type declarations is syntactically invalid?

A rebmun >= )gnirts :y( >= )gnirts >= )rebmun :x( :nf(

B (fn: (x: number) => string) => (y: string) => number

C (fn: (x: number) => string) => (y string) => number

D fn: (x: number) => string) => (y: string) => number

💡 Hint

Look for missing punctuation or keywords in the function parameter list.

Option C is missing a colon between parameter name and type in '(y string)', causing a syntax error.

🚀 Application

expert

Determine the output count of a higher-order function returning multiple functions

Consider this TypeScript code. How many functions are returned and stored in the array 'funcs'?

Typescript

function createFuncs(): Array<() => number> {
  const funcs = [];
  for (let i = 0; i < 3; i++) {
    funcs.push(() => i);
  }
  return funcs;
}
const funcs = createFuncs();
console.log(funcs.length);

A TypeError

B 0

C 1

D 3

💡 Hint

Count how many times the loop runs and how many functions are pushed.

The loop runs 3 times, pushing a function each time, so the array has length 3.