Understanding TypeScript's "readonly" vs "const"

Photo by FlyD

Immutable Intricacies: Declaring Your Constancy

First off, let's talk const, shall we? When you declare a variable with const, you're basically telling TypeScript, "This is it, pal. This variable is as unchanging as my decision to avoid pineapple on pizza." 🍕 It means that once you've assigned a value to a const variable, you can't reassign it to something else. That's like trying to convince a cat to take a bath; it's just not going to happen.

const pi = 3.14;
pi = 3.14159; // TypeScript will throw a hissy fit here!

Remember, const is all about the variable assignment. The variable itself can’t point to something else, but if it's an object, the object’s contents can mutate like a flu strain. Yes, that’s right, the object itself can still change.

const myObject = { name: "Jon" };
myObject.name = "Jonathan"; // This works!
myObject = { name: "Jon Snow"}; // You know nothing, TypeScript compiler will complain.

No Reassignments Please, We're readonly

Moving on to readonly, it's like const's suave cousin that works exclusively with properties within an object or class. By labeling a property as readonly, you're telling TypeScript that this property must be initialized either at declaration or in the constructor, and after that, it's hands-off!

interface NobleHouse {
  readonly name: string;
}

let stark: NobleHouse = { name: "Stark" };
stark.name = "Lannister"; // Good luck, TypeScript won't let this betrayal stand.

What's fun about readonly is that you can have a whole object marked as readonly, and that's like putting a shield around the whole thing. Now it feels like a trusty immovable rock, much like your favorite armchair.

Let's Get Philosophical: The Existential Differences

You might be whispering, "But Jonathan, why can't I just live a simple life and use const all the time?" Well, my dear reader, life (and coding) isn't always that simple. Consider this: const works on variables, readonly works on properties. Variable, properties—tomayto, tomahto, right? Not quite. Consider readonly as part of the furniture of your object's home—it ain't going anywhere. const is like the rule you have against borrowing books that somehow still get borrowed (you can look, but you can’t touch).

Also, readonly allows for some sneaky flexibility if you're crafty (not the Pinterest kind). With a touch of TypeScript magic like type assertions or index signatures, readonly properties can still be changed internally but stay precious and protected from the prying eyes of the outside world.

The Dynamic Duo in Action

Now let's play matchmaker and see how const and readonly complement each other like peanut butter and jelly. The key takeaway: use const for variables that should not be reassigned, and readonly for properties that should not be mutable after their initial assignment or construction.

Here's a little snippet that shows this dynamic duo in action:

const book = Object.freeze({
  title: "A Dance with Dragons",
  readonly author: "George R. R. Martin"
});

book.title = "A Game of Thrones"; // Nice try, but no.

In Conclusion: Wield Your Keywords Wisely

So there you have it, friend—the lowdown on readonly vs const in TypeScript, complete with a sprinkle of humor and absolutely no sales pitch. 🎉 Use this knowledge as your sword in the coding arena, and may your bugs be few and your compile errors nonsensical (as they often are).

Remember, in the grand tapestry of TypeScript, each keyword has its royal place. const guards variables like a fiercely loyal knight, while readonly watches over the lands of properties ensuring peace and order in your code kingdom. Choose your champions wisely and happy coding!

More like this

Unraveling Type Assertions in TypeScript 👀

Have you ever encountered a peculiar TypeScript compiler refusing to acknowledge your certainty about the type of variable you're dealing with? Well, you're not alone! Type assertion in TypeScript is like telling the compiler, "Trust me, I know what I'm doing" (famous last words, right?).

Read

Mastering TypeScript Unit Tests with Ease

Writing unit tests is quite the adventure in any developer's journey. It's akin to putting on your armor and ensuring your code can withstand the wildest of bugs. Just like a Dutch weather forecast, TypeScript code can be unpredictable, but fear not!

Read

Embrace Simplicity: TypeScript Without Bundlers!

Have you ever found yourself tangled in a web of build tools and configurations when dealing with TypeScript projects? 💡 If your answer is a resounding "yes," then you're not alone. Bundlers like webpack are powerful, but sometimes they can be an overkill for smaller projects or for developers who value simplicity.

Read

TypeScript in the Cloud: A Software Engineer's Guide

If you're a coder with a penchant for strong typing and sleek syntax, you've likely dabbled with TypeScript. But as you float your app ideas into the nebulous realm of cloud computing, you might wonder, "Can TypeScript cozy up with bigwig platforms like AWS or Azure?" Fear not, for you've docked at the right space station!

Read