DEV Community

What's wrong with this code?

Sung M. Kim on September 04, 2018

Photo by Caroline Attwood on Unsplash. What's wrong with this code? Can you find the logical error? (⚠️ As the tag shows, it's a non-se...

Read full post

JavaScript Joel • Sep 4 '18 • Edited

The reason to use const instead of let is because you want your code to be immutable. (just a note, const doesn't make object immutable, you have to freeze).

So how do you eat your groceries while being immutable?

Try to view immutable code as code with the added dimension of TIME!

// the past
const { flour, eggs, turkey } = groceries

// the present
const cookedEggs = cookEggs(eggs)

// the future
const cookTurkey = turkey => ({ ...turkey, cooked: true })

At any moment in our application we can go back and look at what the state was before.

So imagine at 12:00 you had raw turkey. then at 12:30 you had cooked turkey. This is how immutable code works.

With mutable code, you know you have cooked turkey, but your past is invisible to you. You can never look at a previous state.

Sung M. Kim • Sep 5 '18

Thanks joelnet for following up with technical aspect of the code and the implication of using const.

Kushan Joshi • Sep 5 '18

const is a good practice, but you even continue using let with immutable code. Sometimes it’s easier and more readable to use let for an immutable object, to which you are going to apply transforms.

JavaScript Joel • Sep 5 '18

sure.

i just try my best to make everything immutable and handle mutable state separately, like in a redux store.

Adarsh • Sep 5 '18

@joelnet I still don't need cookTurkey instead I can do turkey.cooked = true and so it doesn't matter whether I use const or let if my code is written keeping immutability in mind.

JavaScript Joel • Sep 5 '18

that is kind of why I mentioned '(just a note, const doesn't make object immutable, you have to freeze)' was to distinguish between const and immutable.

If you want a primitive value to be immutable, const is enough. If you want an object to be immutable, you have to freeze it as well.

So if we can assume groceries is immutable (which is should be).

const deepFreeze = require('deep-freeze')

const grocieries = deepFreeze({
  flour: {
    cooked: false
  },
  turkey: {
    cooked: false
  },
  eggs: {
    cooked: false
  }
})

Then your groceries will truly be immutable

const { turkey } = grocieries
turkey.cooked = true
//=> turkey({ cooked: false })

Adarsh • Sep 5 '18

Sorry. Misunderstood as the freeze wasn't mentioned in the previous code. Thanks for clearing it up! :)

Dave Cridland • Sep 4 '18

const. I hate const in Javascript, because it's not const at all - but final. In Kotlin, this'd be val instead of var - but even then, this is a fixed binding, and not an invariant.

So you can cook the turkey, for sure, you just can't change which turkey you're cooking.

In C++, on the other hand, const Turkey turkey means an invariant Turkey. const Turkey * turkey means a pointer to a constant Turkey. In either case, you couldn't call Turkey::cook(), but you could call Turkey::price() const, since that's a const method. But in the latter case, you could assign (or "rebind") turkey to point at a different instance. To prevent that, we can say const Turkey * const turkey, which is getting to be a mouthful. C++ also has references, which are non-rebindable pointers with easier syntax: const Turkey & turkey is equivalent to that last double-const pointer example.

Sung M. Kim • Sep 5 '18

All these headaches might be a good reason to learn Functional Programming... 🤔

Roger K. • Sep 5 '18

And now I'm reminded why I prefer to code in Python or JS. Listening to the C++ version hurts my brain. A fragile Front-End guy and I'm thankful to not be doing C++

Sung M. Kim • Sep 5 '18 • Edited

Thanks Nick.

After reading your comment, I dug around and found this StackOverflow answer, which also explained using an example.

I wasn't aware that nested object could be modified even after being frozen.

Adrian B.G. • Sep 4 '18

Not really, the "turkey" is a pointer to the turkey instance/value, so even if the turkey changes its state, the turkey pointer will remain constant, pointing to the same turkey.

Sung M. Kim • Sep 4 '18

I had this imagination that, the 🦃 looks the same on the outside but cooked on the inside 😃.

dukemai • Sep 4 '18

haha, it sounds reasonable :D

Adam Crockett 🌀 • Sep 5 '18

Still not edible, take it back for a re-rest 😂

Tobias SN • Sep 5 '18

You forgot a semicolon at the end.

Sung M. Kim • Sep 5 '18 • Edited

I've been waiting for someone to point that out as well 🤣

Adam Crockett 🌀 • Sep 4 '18

This is an interesting point. What if some of the groceries where constant, such as the old tins you'll have in your cupboard for years. Seriously though, you can only have all constant or all let.