Type 'boolean' is not assignable to type 'number'

Question

I'm looking answer of this question but I can't find it. So, I have this interface:

export interface productsListFromOrder{
  product_name: string,
  amount: number,
  price: number,
}

I made the array of this objects and I push that:

  products:productsListFromOrder[] = []; //productsListFormOrder is my interface
  myFunction(): void{
//...
        this.products.push({
          product_name: product?.name!,
          price: product?.price!,
          amount: element.amount ? parseInt(element.amount) : 1
        })
}

Problem is that I have an error from title:

Type 'boolean' is not assignable to type 'number' I'm sure that type is correct becouse i test a few things:

I display type of price and it display number

console.log(typeof product?.price!);

I set type of products array on any[] and it works correctly but I want to use my interace

products:productsListFromOrder[] = [];

I solve this problem in this way

regular_price: typeof product?.price! == 'boolean' ? 0 : product?.price!,

Ok, if I use method 2 or 3, my code works but it doesn't my goal. I need to use my interace (instead of any[] like in point 2) and code from point 3 is ugly. And what is the most important - why I have this error? Product.price has a type number. How can I write this code without typeof checking?

Please provide a [mre] that clearly demonstrates the issue you are facing. Ideally someone could paste the code into a standalone IDE like [The TypeScript Playground (link here!)](https://tsplay.dev/mAyPQm) and immediately get to work solving the problem without first needing to re-create it. So there should be no pseudocode, typos, unrelated errors, or undeclared types or values. — jcalz, Apr 22 '22 at 13:17
Object type names are conventionally written in UpperPascalCase to distinguish them from value names and primitive types; please change `productsListFromOrder` to `ProductsListFromOrder` so as not to distract attention from your issue. — jcalz, Apr 22 '22 at 13:19

score 0 · Answer 1 · answered Apr 23 '22 at 15:35

The exclamation operation in TypeScript is called "Non-Null Assertion Operator" this question and answers provide a good deep dive on what it means.

When you do this:

 product?.name!,

It is incorrect. As your are using the question mark operator (which would potentially allow product?.name to be null or undefined) prior to the exclamation mark operator (which asserts product?.name not to be null or undefined).

I believe you have disabled a some of the type script validations otherwise you'd be received the following errors:

product?.name!:

TSLint: Forbidden non null assertion(no-non-null-assertion)

having the interface name productsListFromOrder in lowercase:

TSLint: Class name must be in pascal case

This second is a simple fix as pointed by jcalz's comments, change it to ProductsListFromOrder

Regarding the error "Type 'boolean' is not assignable to type 'number' "

I would suggest that you variable product here:

       this.products.push({
          product_name: product?.name!,
          price: product?.price!,
          amount: element.amount ? parseInt(element.amount) : 1
        })

Somehow has its price attribute with an implicit interface of as boolean. Which in turn causes the error you are getting.

To resolve it,

Option 1 (ugly)

you could coarse the value of price to number:

  price: <number><unknown>product?.price,

Option 2 (my recommendation)

you should adjust the variable product so it can never provide an interface of boolean for its price property.

Type 'boolean' is not assignable to type 'number'

1 Answers1

Option 1 (ugly)

Option 2 (my recommendation)