The Differences Between 'Object', '{}', and 'object' in TypeScript
Zachary Lee

Zachary Lee @zacharylee

About: Newsletter: https://webdeveloper.beehiiv.com

Joined:
Apr 28, 2024

The Differences Between 'Object', '{}', and 'object' in TypeScript

Publish Date: Jul 24 '24
249 13

Latest updates in my newsletter.

In TypeScript, when we want to define an object type, there are several concise options such as 'Object', '{}', and 'object'. What are the differences between them?

Object (uppercased)

Object (uppercased) describes properties common to all JavaScipt objects. It is defined in the lib.es5.d.ts file that comes with the TypeScript library.

As you can see, it includes some common properties like toString(), valueOf(), and so on.

Because it emphasizes only those properties that are common to JavaScript objects. So you can assign boxable objects like string, boolean, number, bigint, symbol to it, but not the other way around.

{}

{} describes an object that has no members of its own, which means TypeScript will complain if you try to access its property members:

From the code example above, we can see that {} and Object (uppercased) have the same features. That is, it can only access those properties that are common (even if the JavaScript code logic is correct), all boxable objects can be assigned to it, etc.

This is because the {} type can access those common properties through the prototype chain, and it also has no own properties. So it behaves the same as the Object (uppercased) type. But they represent different concepts.

object (lowercased)

object (lowercased) means any non-primitive type, which is expressed in code like this:



type PrimitiveType =
  | undefined
  | null
  | string
  | number
  | boolean
  | bigint
  | symbol;

type NonPrimitiveType = object;


Enter fullscreen mode Exit fullscreen mode

This means that all primitive types are not assignable to it, and vice versa.


If you find my content helpful, please consider subscribing. I send a daily newsletter with the latest web development updates. Thanks for your support!

Comments 13 total

  • Dipak Ahirav
    Dipak AhiravJul 24, 2024

    Nice very useful!

  • leob
    leobJul 24, 2024

    Great post, this is the kind of content that we want to see on dev.to, don't we? :-)

    I was totally unaware of "lowercase object" (but I did hear about "Record") - super confusing, as is often the case with Javascript and TypeScript, for historical reasons of how it "came to be" ...

    I honestly have no idea why they added "lowercase object", and would never recommend using it in place of "Record", but anyway, nice to know about it.

  • Mostafa
    MostafaJul 24, 2024

    It's not recommend to use type object, Object and {}
    Btw Object it's not typescript specifications, and object a constructive type rarely can be used, maybe if you're writing a library declaration.

  • Igor Rubinovich
    Igor RubinovichJul 26, 2024

    In "This means that all non-primitive types are not assignable to it, and vice versa." you probably meant "assignable" without the "not"

    • Hans
      HansJul 26, 2024

      They probably meant “all primitive types”, since that’s what’s demonstrated in the code block.

      • Zachary Lee
        Zachary LeeJul 27, 2024

        Thanks for your tip, I fixed it.

  • tonny_x_bit
    tonny_x_bitJul 26, 2024

    Your teaching is very good. I became know about object.

  • Sy Hung Doan
    Sy Hung DoanJul 27, 2024

    Informative!

  • md antor
    md antorJul 28, 2024

    Here are 100 highly recommended online earning way pdf books free which are very famous worldwide. Free read books and Download now Google sites link. sites.google.com/view/100-earning-...

    Image description

  • blackr1234
    blackr1234Jul 30, 2024

    So the lowercase one is more strict, weird.

  • bakare damilola
    bakare damilolaJul 31, 2024

    Great content, I'll definitely be referencing this a lot till it's stuck in my brain.

  • diego fernandez
    diego fernandezAug 30, 2024

    Thanks You, easy to understand.

Add comment