INTRODUCTION TO MODERN

JAVASCRIPT
 What Is JavaScript?
JavaScript is a dynamically -typed, interpreted (on the fly compiled)
programming language with object-oriented capabilities that
allows us to build interactive web pages.
 Dynamically Typed ?
We don’t have to mention the data type of the variable while
declaring it.

It is assumed by JS automatically at run time .

Interpreted ?( On the fly compiled?)
Not pre-compiled like C/C++ , instead it is interpreted and
executed at run time .

Also there is a Compiler which JS uses to optimize our code

fragments so as to get faster execution.
 Object Oriented Capabilities ?

JS is not a full fledged Object Oriented Language, rather it

uses some popular Object Oriented Features .

For example , it allows us to create function which can act as a

class
 Interactive Web Page ?
JS can respond to user actions like button clicks or mouse
movements and make our web pages dynamic .

For example ,when the user clicks a button JS can display

current time on the browser
Who Runs Our JavaScript Code ?
JavaScript code is handled by JavaScript Engine .

It interprets, compiles and executes our JavaScript code

Each browser has it’s own JavaScript Engine.

 JS Engines Names

Browser JavaScript Engine

Google Chrome V8

Microsoft Edge Chakra

FireFox SpiderMonkey

Opera v 14+ V8

Safari JavaScriptCore (Nitro)

The JS Engine Components

.
 Relationship With Html And CSS

Core technology of web development Commonly Used

JavaScript is most commonly

Along with HTML and CSS,
used to provide interaction with
JavaScript is one of the core
web pages.
technology of web development.
HTML : Content JavaScript : Dynamic Effects

<p>Java is to JavaScript as Ham is to Hamster</p>. Dynamic Effects means changing the content or
behaviour of the page at run time.

For example , as the user moves his mouse over the text
shown , it’s color can be changed using Java Script.

CSS : Styling

p { color : red; }
JavaScript In Today’s World

Client Side
Earlier JavaScript was a client side language
and was limited only to browser Server Side
What makes JavaScript possible on
server side is Node Js

Desktop Apps
Using Eectron JS , now we can develop
desktop apps with JS too
Mobile Apps
JavaScript frameworks like React Native
and Ionic can be used to develop mobile
apps for Android as well as iOS
What JavaScript Can Do In Browser?
Following are the tasks for which JavaScript is mainly used:

User Interaction Form Validation Image

Swaps/Rollover
 User Interaction

Sample: https://dr5hn.github.io/countries-states-cities-database/
Form Validation
Image Roll Over
Image Swap
What Java Script(client side) Can’t Do ?
• JavaScript cannot access Database(without AJAX or FetchAPI)

• JavaScript cannot access files on client machine

 Java V/s JavaScript
Java JavaScript

Java was developed by Sun Microsystems JavaScript was created by Netscape and is a
 scripting language which is placed inside
 and is a full fledged, standalone, object
oriented language an HTML page and provides interactivity
to the page.
 Java is both a compiled as well as JavaScript is mainly an interpreted language
interpreted language.
 but with on the fly compilation

 Java runs inside JVM.  JavaScript runs inside a host environment

Java is a statically typed language as it is JavaScript is a dynamically typed
 
compulsory to declare every variable’s data language as we do not have to declare data
type. types of variables before using them.
 Java has been designed with security as it’s
 JavaScript is a much less secure language.
top priority. Every thing in java runs under
the control of JVM that handles execution of
a Java code.
History Of JavaScript

Developed By Latest Version

Brendan Eich 1.8.5

Original Name First Version

Mocha, LiveScript 1.0
Company Launching Year
Netscape 1996
 Version History Of JavaScript
1996
Brendan Eich made the first version of JavaScript and called it Mocha

Later it was named to LiveScript and then finally to JavaScript

Many similar languages appeared , for ex: Microsoft published an exact copy of JavaScript
and named it as JScript
 Version History Of JavaScript

1997
Netscape submitted JavaScript for standardization to an organization called ECMA

ES1 (ECMAScript 1) became the first version of JavaScript language Standard.

ECMAScript : The language standard

JavaScript : The language in practice

 Version History Of JavaScript
2009
ES5 (ECMAScript 5) was released with lot of new features.

2015
ES6/ES2015 (ECMAScript 2015) was released : The biggest update to the language ever!

ECMA decided to change to annual release cycle in order to ship less features per update.

Then 2016, 2017, 2018, 2019, 2020, 2021 and 2022 were the years for release of :
ECMAScript 2016 / ECMAScript 2017 / ECMAScript 2018 / ECMAScript 2019 / ECMAScript 2020 / EC-
MAScript 2021 / ECMAScript 2022
 Which Version To Use ?
ES5 ES6 to ES2022 ES2023 . . .

Fully supported in all Well supported in all Some features are

browsers. modern browsers. supported in modern
browsers.
No support in older
browsers.

Can use most features

in production with
transpiling through
BABEL
(Converting to ES5).
What Is Babel ?
Babel is a JavaScript transpiler that
converts our Modern JavaScript into plain
old ES5 JavaScript .

For example, classes, let , const , arrow

function will be converted to function, var
etc so that they can run in any browser
(even the old ones).
 Where JS Stands Today ?

Courtesy : https://gigazine.net/gsc_news/en/20221117-github-top-programming-languages-2022/