SlideShare uses cookies to improve functionality and performance, and to provide you with relevant advertising. If you continue browsing the site, you agree to the use of cookies on this website. See our User Agreement and Privacy Policy.
SlideShare uses cookies to improve functionality and performance, and to provide you with relevant advertising. If you continue browsing the site, you agree to the use of cookies on this website. See our Privacy Policy and User Agreement for details.
Successfully reported this slideshow.
Activate your 30 day free trial to unlock unlimited reading.
Modern JavaScript: Explain it like I’m an Apex developer, Edith Valencia-Martinez
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.
Modern JavaScript: Explain it like I’m an Apex developer, Edith Valencia-Martinez
1.
Modern JavaScript
Explain it like I'm an Apex developer
by Edith Valencia-Martinez
2.
#CD22
So what is modern JavaScript?
5 modern JavaScript features
Show me a Lightning Web Component !
Conclusions
Agenda
3.
#CD22
So what is modern JavaScript?
Brendan Eich
invented
JavaScript for
Netscape
1995
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.
#CD22
So what is modern JavaScript?
2009
1999
2003
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.
#CD22
So what is modern JavaScript?
2009
1999
Ajax, JQuery
JSON, strict,
NodeJS
2015
AngularJS,
ReactJS
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.
#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.
#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.
#CD22
Block-level declarations
Classes
Modules
Arrow functions
Promises
5 modern JavaScript (ES6) features
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
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
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
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
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
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
79.
#CD22
The road from Apex to JavaScript is smoother now thanks to ES6.
Conclusions
80.
#CD22
The road from Apex to JavaScript is smoother now thanks to ES6.
Similar syntax to Apex is an advantage.
Conclusions
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.
#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.
#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.
#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