JAVASCRIPT Notes

What is a JavaScript?
JavaScript is a programming language for web pages.
It can make webpages more dynamic and interactive.
With JavaScript we can access webpage and you can
manipulate them.
JavaScript program can be used to handle events on a
webpage, like click of a button element.
NOTE:
JavaScript initially created to run & execute inside the
browser. This, is the reason why JavaScript was also called
client-side programming language.
 Modern JS can implement outside the browser also so
then it’s also called server-side programming language.

Client-side vs Server-side programming language?

A programming language can be classified into 2 types:
1. Client-side language
2. Server-side language
Server-side programming language – a Programming
language which can be executed on the server is known as
server-side programming language.
It is used to process received data on a server and sends the
result back to the client i.e. browser.
It involves a server to its processing.
e.g: java, python, php etc.
 Client-side programming language – a client-side
language requires a browser to run the program on the client
machine but does not interact with the server when
processing the client-side code.
Client-side programming language does not involve any
server. It gets executed on the client’s browser.
 Server-side programming language involves a server but
the client-side programming language does not involve a
server.
 Server-side language executed on the server but the
client-side language executed on the client’s browser.

NOTE: Modern JavaScript can be used both server-side and

client-side programming language.
By using node.js we can make the js into server-side
programming language.
Running JavaScript code?
JS code always embedded in the html document.
When we client-side programming language we need to
embedded the JS into HTML document.

HTML document
executed Browser
JS code

A client-side JavaScript always attached to an html

document and is executed by the browser.
They are 2 ways to embed a JavaScript code in html
document.
 1. <script>
/// lines of code
/// lines of code
</script>
2. <script src = “index.js”></script>
Why learn JavaScript?
JavaScript contains a lot of frameworks and libraries out there
which is purely built on the JavaScript which make developers
life easy and productive.
e.g: jQuery, Angular, React, Node.js etc.
Where to use JavaScript?
It is used in webpages to add functionality.
To make webpages more dynamic and interactive instead of
displaying a static webpage to the user.
You can use JS to create mobile apps, desktop apps and even
games.
You can also use JavaScript as a server-side language for
backend development with the help of framework node.js.
Use of client-side JavaScript?
You can use the JavaScript to validate user inputs in a form
before submitting it to the server.
You can show dynamic popup on the webpages to display
some message or get some inputs etc.
You can add animations to your webpage with JS.
You can use asynchronous JS code to perform long running
tasks like loading data from the backend, without blocking the
user interface. This will give amazing experience to your
website users.
You can modify webpages content dynamically on runtime to
modify look and feel of your website based on some event or
device.
You can do some events like mouse click, pointer movement,
button click, key press etc.
Limitations of JavaScript on browser?
 Client-side JavaScript does not allow reading or writing of
files on the hard disk, copy them or execute any program.
 JavaScript from one page may not access the other if they
come from different domain, protocol or port number. This
is called “Same Origin Policy”.
 JavaScript does not have any multi-threading or
multiprocessor capabilities. JavaScript is a single
threaded programming language. (It cannot execute 2
codes simultaneously it executes codes only one after the
other)
[These limitations are only for the sake of user safety
 by preventing a web page accessing a private information
or harming the user’s data]
{NOTE: some of the limitations does not exist if we use the
JavaScript outside of the browser. E.g : In server-side
JavaScript we need to reading and writing files on the client’s
machine}

Variables in JavaScript
we can store a value in variable.
We can create variable using let or const keyword. Which is
the latest version of es6.
let- when we create a variable using let, we can change the
value of variable anytime.
  When we assign different values to the same variable then
final assigned value will be shown.
Const- it creates a constant whose value cannot be changed
later.
 We can declare a variable and initialize/assign a value in
the same line.
 E.g: const pi = 3.14;
In es5 and older version we use the var to assign the variable.
Rules & limitations on naming a variable in JS:
 Variable names can contain only letters, digits,
underscores, and dollar ($) signs.
 The first character of a variable name must not be a
digit.
 A variable name starts with letters, underscores or
dollar ($) signs.
 JS variable names are case sensitive.
 JS reserved words can’t be used as variable name.

Datatypes in JavaScript
There are 7 basic primitive datatypes in JS:
1. Number – any number like floating point, intergers etc.
 let age = 21;
 let percentage = 8.17;
 console.log(1/0); // infinity
 console.log(-1/0); // -infinity
 console.log(‘hello’/10); // NaN (not a number)
 when we perform incorrect or undefined
mathematical operation that will be NaN.
 infinity, -infinity, integer, floating point, NaN these
are all number datatype.
 2. BigInt – store a very large number which number type
cannot store.
3. String – sequence of character used to create a text.
 E.g: let str1 = “hello” or ‘hello’;
 let str2 = `hello ${str1}`; // hello hello --- back ticks are
used to write string and do expression also.
Template Literal Syntax
 A single character are also treated as a string in JS.
4. Boolean – logical datatype that can be true or false.
 let isEligible = true;
 let isEligible = false;
 let isEligible = 10 > 15; // false
 Every comparison operator must be a Boolean value.
5. Undefined – datatype of a variable which is not initialized
yet.
 let name;
console.log(name); // undefined
6. Null – non-existing
 let time = null;
7. Symbol – the symbol type is used to create unique
identifiers for object.

Dynamic typing:
The datatype is automatically assigned to a variable based on
the value we are store in it
We don’t have to manually specify the datatype.
e.g: let myVar = 100;
myVar = ‘Hello’;
console.log(typeof myVar); - it defines the type of the
current variable. i.e. string
So JavaScript is dynamically typed programming language.
[datatype is dynamically assigned]

{In typescript we can mention data type i.e.static datatype as

we mention datatype num then we store numbers only
typescript is superset of JS}

TYPESCRIPT

JAVASCRIPT

Type Coercion:
Converts the value of one datatype to another datatype.
Let age = 28;
console.log(age); // 28 – it is a number
console.log(‘My age is ’+age); // My age is 28 – here 28 is
converted into a string.

o Single line comments - //

o Multiple line comments - /*…. */
Operator – An operator performs some operation on single or
multiple operands & produces a result.
Operand – An operand is what an operand applies to.
e.g. 2 + 3 [ here 2 & 3 are operands and’+’ is an operator that
perform on an operand]
3 types of operators are there are:
Unary operator: An operator will apply to a single operand.
e.g.
let x = 5;
x = -x;
console.log(x); // -5
Binary operator: The operator will apply to the 2 operands
e.g.
let y = 2 – 1;
let z = 2*3;
[NOTE: ‘-’ will act both binary & unary operator]
Ternary Operator: If it operates on 3 operands.
Types of operators:
 Arithmetic Operator: for mathematical operations.
 Assignment Operator: for assigning values.
 Comparison Operator: for comparing values.
 Logical Operator: