Typescript - How to pass function pointer into function and call within function body

Question

I am trying to pass a function pointer into an existing function in Typescript. The below should work, but when calling agreet() I receive undefined, why?

function greeter(greetFuncPtr) {
  console.log(greetFuncPtr); // returns ƒ () { greet(); }
  console.log(greetFuncPtr()); // returns undefined
  console.log(greet()); // returns "Hello"
  return greetFuncPtr();
}

function greet() {
  return "Hello";
}


document.querySelector("#app").innerHTML = greeter(() => { greet(); });

See fiddle here https://jsfiddle.net/17w246uz/

@Estradiaz yes right you are! A bit of blind sight. Funnily enough I did it right in the JS Console in Chrome :/ Long day... — ChickenFeet
– ChickenFeet, Commented Jul 9, 2019 at 8:51

Titian Cernicova-Dragomir · Accepted Answer · 2019-07-09 08:48:39Z

4

The syntax you use in the arrow function implies that the result of greet is not returned by the arrow function, to return it you would need to use a return

function greeter(agreet: () => string) { 
    console.log(agreet); // returns ƒ () { greet(); }
    console.log(agreet()); // returns undefined
    console.log(greet()); // returns "Hello"
    return agreet();
}

function greet() {
    return "Hello";
}


greeter(() => { return greet() });

Or not use the {}:

greeter(() => greet());

Or pass the function directly :

greeter(greet);

Note The type I added to agreet would have prevented the error in the first place, since you would have gotten an error that the passed in arrow function returned void instead of string

answered Jul 9, 2019 at 8:48

Titian Cernicova-Dragomir

253k37 gold badges464 silver badges394 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

fjc · Accepted Answer · 2019-07-09 08:49:26Z

1

In the arrow function you pass by calling greeter(() => {greet()}), you are missing a return statement. Hence, it returns undefined.

The simple fix is to a) add a return statement, or b) remove the curly brackets:

function greeter(agreet) {
  return agreet();
}

function greet() {
  return "Hello";
}


console.log(greeter(() => {return greet()}));
console.log(greeter(() => greet()));

answered Jul 9, 2019 at 8:49

fjc

5,84521 silver badges38 bronze badges

Collectives™ on Stack Overflow

Typescript - How to pass function pointer into function and call within function body

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related