For the last 3.5 years, I've worked on a AngularJS(1.x) project; so, I haven't had lots of opportunity to use many of the new features in ES6.
Now that I'm doing React Native work, I've been loving all these new features. However, one thing I really haven't enjoyed are implicit returns.
In case you aren't familiar with them, an implicit return allows an ES6 function to retun a value without having to speficially return
anything.
Standard JavaScript
ES6
The ES6 version takes the arguments and immediately returns the result of the template literal. In the second ES6 version, parenthesis can be used if the implicit return is too long to neatly fit on one line.
So, what's not to like about implicit returns? They are pretty neat and make for very concise code, right? My problem with them has been with trying to troubleshoot functions using console.log
. Sometimes, you really need to know what's getting passed into a function. With implicit returns, you seemingly can't add a console.log
statement to the code.
So, for React/React Native, I found myself having to rewrite functions just to add some logging
Fortunately, I stumbled acros this tweet from @WesBos:
ππ»This is also handy for debugging implicit returns pic.twitter.com/NgP5131qPo
— Wes Bos (@wesbos) September 18, 2018
Wes shows how you can simply inline the console.log
to get the desired output.
This has really improved my relationship with implicit returns. Now, if there was a way to add a debugger
in there somehow??
Here's a working sample of a simple React app.