JavaScript is moving fast. Last year’s best practices are quickly becoming today’s anti-patterns as we experience fundamental shifts in the language. With so many outdated learning resources out there, it's hard to know if we're doing things right. In this talk, Hunter Loftis will introduce us to the new rules of modern JavaScript. Whether you're a new developer trying to learn modern best practices or a veteran looking to break old habits, 2017 is your opportunity to level up!

1. @hunterloftis
Stop JavaScripting Like It’s 1999
Connect.Tech
2017

2. @hunterloftis

3. @hunterloftis

4. @hunterloftis

5. @hunterloftis

6. @hunterloftis
read package.json
parse JSON
fetch repository.url
parse the body
match “X users starred” in the body
return the match
1
2
3
4
5
6
Fetching Stars

7. @hunterloftis
1
2
3
4
5
6

8. @hunterloftis
Why would anyone use JavaScript?

9. @hunterloftis
!==
blocking/slow 🐢concurrent/fast 🚗

10. @hunterloftis
concurrency tax

11. @hunterloftis
catch errors passed as arguments
catch errors from rejected promises
catch thrown errors
blocking/slow 🐢concurrent/fast 🚗
create new execution contexts

12. @hunterloftis
That’s just how JavaScript works.
worked

13. @hunterloftis
new tools for tax-free concurrency
node >= 7.6.0
(Feb 22, 2017)

14. @hunterloftis
new tools for tax-free concurrency

15. @hunterloftis
So? There’s always something new
in JavaScript.

16. @hunterloftis
1. What does modern JS look like?
2. How can you start writing it?
3. Which obstacles should you expect?

17. @hunterloftis
1. What does modern JS look like?

18. @hunterloftis
modern JS should read like Python
concurrent/fast 🚗
…and run like JavaScript!

19. @hunterloftis
How?

20. @hunterloftis
Three Rules:

21. @hunterloftis
1. Whenever you think about writing a
callback, use async / await instead.

22. @hunterloftis
this is a callback function

23. @hunterloftis
2. throw and catch Errors,
or allow them to bubble.
But otherwise leave them alone!

24. @hunterloftis

25. @hunterloftis
“Pyramid of Doom” “Callback Hell”

26. @hunterloftis
3.Instead of chaining Promises,
use await + simple assignment.

27. @hunterloftis

28. @hunterloftis
Is this still JavaScript?
• no more callbacks
• no more `if (err)`
• no more Promises

29. @hunterloftis
The three objections

30. @hunterloftis
1. I don’t understand async/await
(which means I don’t understand Promises)

31. @hunterloftis

32. @hunterloftis
“I return a Promise.”
“I wait here for another Promise to resolve.”
?

33. @hunterloftis

34. @hunterloftis
2. Lots of modules still use callbacks
(like node’s core APIs)

35. @hunterloftisJune 2017: node-core Promises!

36. @hunterloftisfor node < 8.0.0

37. @hunterloftis
3. I work on a huge codebase
(and rewrites are terrible)

38. @hunterloftis

39. @hunterloftis
What does a modern foo look like?

40. @hunterloftis
async
json = await…
res = await…
body = await…
1. no callbacks!
2. throw errors!
3. no chaining!
what’s left?

41. @hunterloftisPython

42. @hunterloftis
concurrent/fast 🚗
JavaScript

43. @hunterloftis
Before After

44. @hunterloftis
Questions?
hunter@heroku.com