Successfully reported this slideshow.

Modern JavaScript: Explain it like I’m an Apex developer, Edith Valencia-Martinez

0

Share

1 of 85
1 of 85

Modern JavaScript: Explain it like I’m an Apex developer, Edith Valencia-Martinez

0

Share

Download to read offline

Are you an Apex developer who is excited about the LWC framework, but at the same time is confused by the modern JavaScript required?

Maybe this session can help!

During this session, we will go over the JavaScript language from the point of view of an Apex developer, focusing on the differences between the two languages and the frequent confusing areas and pain points.

This session is ideal for those familiar with Apex and who have little or no experience with JavaScript.

Are you an Apex developer who is excited about the LWC framework, but at the same time is confused by the modern JavaScript required?

Maybe this session can help!

During this session, we will go over the JavaScript language from the point of view of an Apex developer, focusing on the differences between the two languages and the frequent confusing areas and pain points.

This session is ideal for those familiar with Apex and who have little or no experience with JavaScript.

More Related Content

More from CzechDreamin

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all

Modern JavaScript: Explain it like I’m an Apex developer, Edith Valencia-Martinez

  1. 1. Modern JavaScript Explain it like I'm an Apex developer by Edith Valencia-Martinez
  2. 2. #CD22 So what is modern JavaScript? 5 modern JavaScript features Show me a Lightning Web Component ! Conclusions Agenda
  3. 3. #CD22 So what is modern JavaScript? Brendan Eich invented JavaScript for Netscape 1995
  4. 4. #CD22 So what is modern JavaScript? Brendan Eich invented JavaScript for Netscape 1995 1997 ECMAScript 1 published ES2 published 1998 1999 ES3 published
  5. 5. #CD22 So what is modern JavaScript? 2009 1999 2003
  6. 6. #CD22 So what is modern JavaScript? Brendan Eich invented JavaScript for Netscape 1995 1997 ECMAScript 1 published ES2 published 1998 1999 ES3 published ES5 published 2009
  7. 7. #CD22 So what is modern JavaScript? 2009 1999 Ajax, JQuery JSON, strict, NodeJS 2015 AngularJS, ReactJS
  8. 8. #CD22 So what is modern JavaScript? Brendan Eich invented JavaScript for Netscape 1995 1997 ECMAScript 1 published ES2 published 1998 1999 ES3 published ES5 published 2009 ES6 published 2015
  9. 9. #CD22 So what is modern JavaScript? Brendan Eich invented JavaScript for Netscape 1995 1997 ECMAScript 1 published ES2 published 1998 1999 ES3 published ES5 published 2009 ES6 published 2015
  10. 10. #CD22 So what is modern JavaScript? Brendan Eich invented JavaScript for Netscape 1995 1997 ECMAScript 1 published ES2 published 1998 1999 ES3 published ES5 published 2009 ES6 published 2015 ES2022 published … 2022 …
  11. 11. #CD22 Block-level declarations Classes Modules Arrow functions Promises 5 modern JavaScript (ES6) features
  12. 12. #CD22 Declare variables/constants that are inaccessible outside a given block scope ( indicated by curly brackets { and } ) let: declare a variable and limit its scope to only the current code block. const: declare constants, their value cannot be changed once set. Block-level declarations
  13. 13. #CD22 Apex: variable scope
  14. 14. #CD22 Apex: variable scope
  15. 15. #CD22 Apex: variable scope
  16. 16. #CD22 Apex: variable scope
  17. 17. #CD22 Apex: variable scope
  18. 18. #CD22 Apex: constants
  19. 19. #CD22 Apex: constants
  20. 20. #CD22 Apex: constants
  21. 21. #CD22 ES6: let and const
  22. 22. #CD22 ES6: let and const Scope 1 Scope 1
  23. 23. #CD22 ES6: let and const
  24. 24. #CD22 ES6: let and const
  25. 25. #CD22 ES6: let and const
  26. 26. #CD22 ES6: let and const Scope 2 Scope 2
  27. 27. #CD22 ES6: let and const
  28. 28. #CD22 ES6: let and const
  29. 29. #CD22 Similarities: ES6 classes support: static functions, instance methods, getters and setters, inheritance. Differences: No access modifiers in ES6’s classes. Private field declarations available in ECMAScript 2022 Constructors in ES6 use the keyword ‘constructor’. ES6 classes vs Apex classes
  30. 30. #CD22
  31. 31. #CD22
  32. 32. #CD22
  33. 33. #CD22
  34. 34. #CD22
  35. 35. #CD22
  36. 36. #CD22
  37. 37. #CD22
  38. 38. #CD22
  39. 39. #CD22
  40. 40. #CD22
  41. 41. #CD22 Related set of Javascript code. By default, variables and functions of a module are not available for use. ES6: modules
  42. 42. #CD22 ES6: modules formatAmount()
  43. 43. #CD22 ES6: modules export formatAmount()
  44. 44. #CD22 ES6: modules export formatAmount() import
  45. 45. #CD22 Apex does not have a module concept per se. As long as you declare your class 'public' or 'global', you can reuse it in another class. ES6: modules
  46. 46. #CD22 ES6: exporting
  47. 47. #CD22 ES6: exporting
  48. 48. #CD22 ES6: exporting
  49. 49. #CD22 ES6: exporting
  50. 50. #CD22 ES6: single default export
  51. 51. #CD22 ES6: importing
  52. 52. #CD22 ES6: importing
  53. 53. #CD22 ES6: importing
  54. 54. #CD22 Simple syntax for creating functions Uses an arrow => In a way arrow functions behave similar to Apex as opposed to traditional JavaScript functions. ES6: arrow functions
  55. 55. #CD22 ES6: arrow functions
  56. 56. #CD22 ES6: arrow functions
  57. 57. #CD22 ES6: arrow functions
  58. 58. #CD22 ES6: arrow functions
  59. 59. #CD22 They operate in the context of their enclosing scope. As opposed to: The value of this is usually determined by a function’s execution context. this might be referring to something different each time the function is called (runtime binding). ES6: arrow functions
  60. 60. #CD22 ES6: arrow functions and this
  61. 61. #CD22 ES6: arrow functions and this
  62. 62. #CD22 ES6: arrow functions and this
  63. 63. #CD22 ES6: arrow functions and this
  64. 64. #CD22 ES6: arrow functions and this
  65. 65. #CD22 ES6: arrow functions and this NaN !
  66. 66. #CD22 ES6: arrow functions and this Window !
  67. 67. #CD22 ES6: arrow functions and this
  68. 68. #CD22 ES6: promises Asynchronous programming. “A promise is an object that is used as a placeholder for the eventual results of a deferred computation.” Specifies some code to be executed later, and also explicitly indicates if the code succeeded or failed. Apex: @future, Queueables
  69. 69. #CD22 ES6: promises
  70. 70. #CD22 ES6: promises
  71. 71. #CD22 ES6: promises
  72. 72. #CD22 ES6: promises
  73. 73. #CD22 ES6: promises
  74. 74. #CD22 Show me a LWC!
  75. 75. #CD22
  76. 76. #CD22 modules
  77. 77. #CD22 modules, classes, inheritance
  78. 78. #CD22 promises, arrow functions
  79. 79. #CD22 The road from Apex to JavaScript is smoother now thanks to ES6. Conclusions
  80. 80. #CD22 The road from Apex to JavaScript is smoother now thanks to ES6. Similar syntax to Apex is an advantage. Conclusions
  81. 81. #CD22 The road from Apex to JavaScript is smoother now thanks to ES6. Similar syntax to Apex is an advantage. There is more demand to code in JavaScript. Conclusions
  82. 82. #CD22 The road from Apex to JavaScript is smoother now thanks to ES6. Similar syntax to Apex is an advantage. There is more demand to code in JavaScript. There are many resources around to learn JavaScript! Conclusions
  83. 83. #CD22 The road from Apex to JavaScript is smoother now thanks to ES6. Similar syntax to Apex is an advantage. There is more demand to code in JavaScript. There are many resources around to learn JavaScript! Conclusions
  84. 84. #CD22 JavaScript skills for Salesforce developers https://trailhead.salesforce.com/en/content/learn/modules/javascript-essentials- salesforce-developers Trailhead: Learn to work with JavaScript (https://trailhead.salesforce.com/en/content/learn/trails/learn-to-work-with-javascript) Trailhead: Build a Bear-Tracking App with Lightning Web Components https://trailhead.salesforce.com/en/content/learn/projects/lwc-build-flexible- apps?trail_id=build-lightning-web-components Understanding ECMAScript 6: The definite guide for JavaScript developers 1st Edition Nicholas C. Zakas Resources
  85. 85. Thank you! #CD22

×