Last week we talked about Nullish Coalescing, now it's time for another new addition to ECMAScript.
The dreaded existence check
Have yo...
For further actions, you may consider blocking this person and/or reporting abuse
I feel like optional chaining is a real love-hate programming language concept in general because of how it can be used to excuse poorly constructed programs.
Which makes it right at home in JavaScript 😄
I thought everything about JS is love-hate. :)
Lol, you're not wrong. There is a reason I couldn't write this post without a risks section!
😞😖😩😫😵
It's worth mentioning that for those who want to live on the cutting edge, it's supported as an experimental feature now in Chrome 79 🎉 I can't wait for this to be a fully mature feature - it will cut down on many lines of checking for property existence! Or, at least eliminate another need to use an external library function like
lodash.get!In my opinion this should always have been the default behaviour... Throwing a runtime breaking error when accessing a sub property of an object in a natively asynchronous environment where you cannot ever guarantee that data packet A is going to present when function call B is run 100% of the time is IMO completely stupid.
This is something I will be using everywhere, well for accessing object properties at least. Function calls... Eh probably not, the runtime time part of JavaScript is predictable. It's the data system that's as unpredictable as a Wookie's anger.
I also personally don't see why this needed to be added as an additional bit of syntax... The behaviour of the
conditional ? true : falsestatement is predictable and would not be broken by changing the default object access syntax to be conditionally chained by default. obj?.property and obj.property both return the same when trying to access obj.property.thing so... Yeah... Don't get it.IMHO the JavaScript standards body is way to conservative in the way they modify and extend the standard...
Great article! Coming from a Rails background, I've been really missing the
.trymethod in JS. Happy to see it's finally landed.That said, it's difficult to discuss optional chaining without talking about the law of demeter, and exactly how much chaining is the right amount.
It's a powerful tool, but it can definitely become overused and cause your application to be brittle!
Ruby has optional chaining too, with
&., haven't usedtryin a long time 😊Take it for a spin!
What do you need to enable it? Just some Babel stuff?
If you're a fan of react it's now part of react scripts 3.3. And in the latest version of vs code it's supported
Nullish too?
Ya, right now the only way to get the features is Babel. It will be in node soon, but no official announced date.
Wicked cool!
I also didn't know you could use it on arrays and functions which opens up a whole new world... I don't know how many times I've checked an array to exist and have length before using .map() 😆😅
Wow I've learnt so much in such a short read, awesome post Laurie, hopefully other languages get this.
I call it the call-me-maybe operator.
I learned about this feature in Groovy right around the time "that" song came out
😂
maybe in about 5 years we'll actually be able to use it in browsers.
Up to es2018 is supported in just about everything but Internet Explorer. Even Safari and Mobile Safari would run it without babel. Transpiling to ES5 or ES6 these days is just a preference that not everybody does
according to kangax.github.io/compat-table/es20..., Firefox, Safari, and Edge still don't support all of ES2017. maybe we'll have full ES2017 support across all major browsers in 2022, when non-Chromium Edge is expected to finally die.
Beautifully written and consumed with pleasure.
I read somewhere that it could increase bundle size. How true is that?
bundle size of node? Or the project that implements it?
The project that implements it.
It’s not really been in the wild enough to know. My suspicion is it isn’t a problem if you’re using it as a replacement for existence checks would have anyway. If you put it everywhere then yes, because the implementation is more complex than just accessing things.
This is certainly a good feature, before this I had to use something like lodash get('obj.node.foo', 'default').
You can use optional chaining today in every browser:
const thing = ((obj||{}).node||{}).thingThat said, optional chaining is natively supported in Chrome 80+.
Optional chaining is powerful, but also controversial because it encourages laziness. Overall, I like it, but only if its use is constrained by a sensible style guide.
I'm waiting for the pipeline operator it will be the biggest change for me since es6
One of my favorite features in Swift/Kotlin, glad it's coming to my real home in JS haha
Hi @Lauri, Nice article !!
Please try JSitor.com editor, it supports Nulliesh Coelscing and Optional Chaining already 😊
This is witchcraft and I love it 😂
Sweeeet