“This expression is not callable. Type ‘#’ no call signatures” in TypeScript – How To Fix?

The error message “This expression is not callable. Type ‘#’ no call signatures in TypeScript” causes you difficulty in developing your application. This article will talk about this issue. Let’s see what solution we provide.

Why do we get the error message: This expression is not callable. Type ‘#’ no call signatures in TypeScript

You try to apply function call syntax on an object and get the error message: This expression is not callable. Type ‘#’ no call signatures in TypeScript. The reason is that you are calling a type that is not a function as a function.

Let’s see the cases where this error occurs through the following examples:

Error case 1:

const message = 'This is a string'

console.log(message())

Output:

This expression is not callable. Type 'String' has no call signatures.

It is easy to see that ‘message’ is a variable of type string when you call ‘message’, which is a string type, as a function call will cause an error.

Error case 2:

function calculateSalary() {
  return{
    setbaseSalary(baseSalary: number){
      return baseSalary;
    },
    setBonus(bonus: number){
      return bonus;
    },
}
}
 
const salary = calculateSalary()
 
salary()

Output:

This expression is not callable. Type '{ setbaseSalary(baseSalary: number): number; setBonus(bonus: number): number; }' has no call signatures.

In this case, we have a function named calculateSalary() that returns an object with two methods, setbaseSalary and setBonus. However, invoking the object without accessing the two methods, setbaseSalary and setBonus will cause an error.

Solution for this error message

To get around this problem, make sure you do not call a function on an object that is not a function. If a function returns the object, then access its properties in the correct syntax.

Continuing with the example above, now let’s fix it:

function calculateSalary() {
  return{
    setbaseSalary(baseSalary: number){
      return baseSalary*1.2;
    },
    setBonus(bonus: number){
      return bonus*2;
    },
}
}
 
//object of function calculateSalary()
const salary = calculateSalary()

//Access to properties
const baseSalary = salary.setbaseSalary(1000)
const bonus = salary.setBonus(100)
 
const totalSalary = baseSalary + bonus
 
console.log('Your total salary this month:  ' + totalSalary + '$')

Output:

"Your total salary this month:  1400$"

‘Salary‘ is the object returned from the function ‘calculateSalary‘. We use the dot character to access its properties. 

The result we printed out on the console is absolutely correct. Now the error no longer appears.

Please pay attention when using external modules when you import them into another file to use. If you call that module directly as a function, it will cause an error. Ensure accessing its properties exactly like the example above.

Summary

In summary, you have just seen the information related to the error message: This expression is not callable. Type ‘#’ no call signatures in TypeScript. Hopefully, the solution we provide is helpful to you. Thanks for reading the article.

Maybe you are interested:

• Property does not exist on type String in TypeScript
• File is not under ‘rootDir’ error in TypeScript
• This expression is not callable. Type ‘String’ has no call signatures

Christopher

My name’s Christopher Gonzalez. I graduated from HUST two years ago, and my major is IT. So I’m here to assist you in learning programming languages. If you have any questions about Python, JavaScript, TypeScript, Node.js, React.js, let’s contact me. I will back you up.

Name of the university: HUST
Major: IT
Programming Languages: Python, JavaScript, TypeScript, Node.js, React.js