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

Question

Hi I'm new in Typescript, I have an object-type variable in which might be different values from different types or nested object. now my question is that how can I define a model for this object to don't face the example error when call different keys?

For example:

export class Controller {
protected static response(res: Response, statusCode: number = 200, data: any, user: string = '', dev: string = '', code: number = 200, result: string = 'success'){
    res.status(statusCode).send({
        data: data,
        message: {
            user: '',
            dev: ''
        },
        code: 403,
        result: 'Error'
    })
}


 ERROR: res.status ---> This expression is not callable. Type 'Number' has no call signatures

Redundant

Answer 1

I was getting this error as well, and realized I'd just forgotten to import Response. Adding an import line solved the problem for me.

import express, {Request, Response} from 'express';

Hansen

For context. What happens is by default typescript imports it automatically from the core of HTTP node library. And the status under the Response object there is a Number. – Albie

it's ridiculous.. my times.. – Buyer

Answer 2

In NextJS make sure you import the correct Response type.

import { NextApiResponse } from "next";

Constrain

thank you, I was importing the wrong type – Clathrate

Answer 3

In your contoller just import the response from express or the framework that you use and it will work.

import { Response } from 'express';

Frighten

Answer 4

In case it helps anyone else, I have also seen the same error in cases like this:

const shift = progressWidth * percentage
(this.$refs.expected as Vue).$el.style.left = "100px"

Where percentage is a number. The error occurs because without semicolons the second line is being interpreted as part of the line, like this:

const shift = progressWidth * percentage(this.$refs.expected as Vue).$el.style.left = "100px"

This can be fixed by adding a leading semi-colon:

const shift = progressWidth * percentage
;(this.$refs.expected as Vue).$el.style.left = "100px"

Or even better, rearrange so it isn't needed at all:

const expected = (this.$refs.expected as Vue).$el
const shift = progressWidth * percentage
expected.$el.style.left = "100px"

Fed

Answer 5

res.status is a number according to that error message. It doesn't look like that Controller is being called with the correct arguments. console.log(res) in there before calling res.status and check your call site code.

Grangerize

Answer 6

Add this line first to get to get all the functionality of express in NEXTJS. REMEMBER you added this exact lines, not others which are mention in this page.

import { NextApiRequest, NextApiResponse } from "next"; 

// This function handle the POST request and defeat all your errors.
import { NextApiRequest, NextApiResponse } from "next";

// You must have to mention the type of handle function's parameter which we already
//get from next package (NextApiRequest, NextApiResponse). 
//NOTE:- You can change the function name, that's your choice

export default function handle(req: NextApiRequest, res: NextApiResponse) {
    if (req.method !== "POST") {
        res.status(405)
    }
}

Glaring

Answer 7

use (res as any).status(statusCode).send({data: data, message:{user: '',dev: ''},code: 403,result: 'Error'}) for any typescript libraries/framework if you use like express, nestjs

Saritasarkaria

As it’s currently written, your answer is unclear. Please edit to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers in the help center. – Edlin