Module II: Variables in JavaScript
U23CS381 - ADD Session by
Dr. S. Sampath Kumar, AP/CSE
31-10-2023 Variables in JavaScript 1
2 31-10-2023
Agenda
JavaScript Variables
Rules to be followed While Declaring a Variable
Syntax (Correct & Incorrect)
Valid and Invalid Declaration
Initializing a Variable
Javascript Dynamic Typing
JavaScript Variable Scope
JavaScript Data Types
JavaScript Arithmetic
When to Use var, let, or const?
Variables in JavaScript
3 31-10-2023
Module II: Interactive Web Design using JavaScript
Introduction - JavaScript including Techniques -
Variables and Operators - Conditional and Control
Statements - Data Types and Functions – Events - Form
Validation - Page Redirect - Java Script Exception
Handling - Document Object Model (DOM)
Variables in JavaScript
4 31-10-2023
Course Outcomes:
CO. Outcome K Level
CO1 (Apply) Understand and apply HTML and CSS concepts K3
(Apply) Understand and apply JavaScript concepts for dynamic web page
CO2 K3
design
CO3 (Apply) Understand and apply shell commands and GIT workflow K2
CO4 (Apply) Design and develop mobile applications K3
CO5 (Apply) Design and develop mobile applications K2
Variables in JavaScript
5 31-10-2023
Challenge time:
➢ Different ways to include JS in HTML
➢ Tag to include JS in HTML
➢ How to display alert message using JS?
Variables in JavaScript
6 31-10-2023
JavaScript Variables:
➢ Variable is a name given to a memory location that is used to
store any type of data.
➢ As the name suggests, variables mean it can vary, i.e., data
stored in a variable can be changed or updated later in the
program if required.
➢ Highlight: A Javascript variable is a container, not a value; this
means that variables aren’t themselves values; they are a
container for values.
Variables in JavaScript
7 31-10-2023
Rules to be followed While Declaring a Variable:
➢ Variables are case-sensitive in Javascript. (This means that
schoolName and schoolname are considered different
variables).
➢ We can use letters, digits, symbols like dollar sign ($) and
underscore ( _ ) in a variable name.
➢ We cannot start a variable name with a digit.
➢ We cannot use any of the reserved keywords (function, return,
typeof, break, etc.) of Javascript as a variable name.
Variables in JavaScript
9 31-10-2023
Syntax (Correct & Incorrect)
➢ Correct Syntax:
var <variable-name>;
var <variable-name> = <value>;
Examples:
var aVariable;
var name = 'Mark';
➢ Incorrect Syntax:
aVariable; // This is not a valid declaration,
name var; //"var" keyword should be written first.
var 'Mark' = name; //value should be on the right-
// hand side of the equals sign
Variables in JavaScript
10 31-10-2023
Example Declaration:
➢ Declaring a JavaScript variable using line breaks and spaces:
var a = 25;
➢ Declaring two variables in a single line separated by a comma:
var b=1, c=2;
➢ Using reserve keywords while declaring a variable:
var return = 5;
//Will give an error, as the return is a keyword
//in Javascript
Variables in JavaScript
11 31-10-2023
Valid and Invalid Declaration:
➢ var my_school; //using underscore
➢ var one$23; //using digit and dollar sign
➢ var 123name;
//variable cannot start with a digit
➢ var variable@ ;
//variable cannot contain '@' symbol
➢ var break;
//break is a reserved keyword in JS, so we can't use
it as a variable
Variables in JavaScript
12 31-10-2023
Initializing a Variable:
➢ After you have declared a variable, you can initialise that
variable with a value.
➢ This initialisation can be done by just writing the variable name
followed by an equals sign and then the value you want the
variable to store.
//declaring and initializing at the same time
var age = 20;
schoolName = 'XYZ School’;
//address stores "abc"
address = 'abc’; //Global Variable
Variables in JavaScript
13 31-10-2023
Javascript Dynamic Typing:
The data type of a variable is not fixed.
A variable can store any type of data, and the user can
achieve this without specifying the type of data he/she wants
to store(eg: number, string, objects, arrays, etc).
Also, one can change the stored value to any type of data,
anytime freely.
Variables in JavaScript
14 31-10-2023
JavaScript Variable Scope:
➢ Scope of a variable means the visibility of a variable. That is, the
parts of our program where you can use a variable.
➢ In JavaScript, there are only two types of variable scopes:
❖ Local Scope
❖ Global Scope
Variables in JavaScript
15 31-10-2023
JavaScript Data Types:
➢ JavaScript variables can hold numbers like 100 and text values
like “Pooja Sri".
➢ Strings are written inside double or single quotes. Numbers are
written without quotes.
➢ If you put a number in quotes, it will be treated as a text string.
const pi = 3.14;
let person = “Karthi";
let answer = 'Yes I am!';
Variables in JavaScript
16 31-10-2023
JavaScript Arithmetic
➢ let x = 5 + 2 + 3;
➢ let x = “Karthick" + " " + “Raja";
➢ let x = "5" + 2 + 3; //Any Guess
➢ let x = 2 + 3 + "5";
Variables in JavaScript
17 31-10-2023
When to Use var, let, or const?
➢ Always declare variables
➢ Always use const if the value should not be changed
➢ Always use const if the type should not be changed (Arrays and
Objects)
➢ Only use let if you can't use const
➢ Variables defined with let can not be redeclared.
➢ Only use var if you MUST support old browsers.
➢ var has global scope, and let has block scope.
Variables in JavaScript
18 31-10-2023
Summary:
➢ Variables are containers that store values.
➢ Variables can be declared using var and let keywords.
➢ Variables can be updated or modified anytime and anywhere
in its scope.
➢ We cannot use any javascript reserved keywords as a variable
name.
➢ In JavaScript, there are only two types of variable scopes:
➢ Global scope
➢ Local scope
➢ Constants in JavaScript are those values that do not change
throughout the code.
Variables in JavaScript
19 31-10-2023
Text Books & References
TEXT BOOKS:
➢ Internet & World Wide Web How to Program, 5th edition, by Paul Deitel Harvey
Deitel, Abbey Deitel, Pearson Publication, 2018.
➢ App Inventor 2: Create Your Own Android Apps 2nd Edition by David Wolber,
Hal Abelson, Ellen Spertus, Liz Looney, 2014.
REFERENCES:
➢ CS50's Web Programming with Python and JavaScript -
https://cs50.harvard.edu/web/2020
➢ “Get Coding! Learn HTML, CSS & JavaScript & Build a Website, App & Game”
by Young Rewired State, Walker Books, 2016.
➢ Version Control with Git, by Jon Loeliger, Matthew McCullough, 2nd Edition,
2012.
➢ Ultimate web design course: https://university.webflow.com/courses/ultimate-
web-design-course . Variables in JavaScript
20 31-10-2023
Variables in JavaScript
21 31-10-2023
Variables in JavaScript
