0% found this document useful (0 votes)
8K views

L4 Data Types Variable (1.3)

The document provides an overview of JavaScript programming basics including features of JavaScript, values and variables, data types, operators and expressions, control flow statements like if, else and switch case statements, loops and functions. It also discusses querying, setting and deleting object properties as well as property getters and setters.

Uploaded by

Aryan K
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
8K views

L4 Data Types Variable (1.3)

The document provides an overview of JavaScript programming basics including features of JavaScript, values and variables, data types, operators and expressions, control flow statements like if, else and switch case statements, loops and functions. It also discusses querying, setting and deleting object properties as well as property getters and setters.

Uploaded by

Aryan K
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 31

Overview :

Client Side Scripting


Language (22519)

P R O G R A M : IN F O R M ATI O N T E C H N O L O G Y ( N B A
A C C R E D ITED )
S E M E S T ER : V
N A M E O F FA C U LTY: M S . Y O G I TA J O R E
Unit 1 :
Basics of JavaScript
Programming
(12 M)

P R O G R A M : IN F O R M ATI O N T E C H N O L O G Y ( N B A
A C C R E D ITED )
: V
N A M E O F FA C U LTY: M S . E M A I L :
y o g it a . k h a n d a g a le@v p t . e d u . in
Basics of JavaScript
Programming
1.1 Features of JavaScript
1.2 Object Name, Property, Method, Dot Syntax, Main Event
1.3 Values and Variables
1.4 Operators and Expressions
1.5 if statement , if…else. If…elseif, Nested if
1.6 switch… case statement
1.7 Loop statement
1.8 Querying and setting properties and Deleting properties,
Property Getters and Setters
1.3 Values and Variables
A JavaScript variable is simply a name of storage location.
Two types of variables in JavaScript :
local variable
global variable.
There are some rules while declaring a JavaScript variable (also
known as identifiers).
Name must start with a letter (a to z or A to Z), underscore( _ ), or
dollar( $ ) sign.
After first letter we can use digits (0 to 9), for example value1.
JavaScript variables are case sensitive, for example x and X are
different variables.
Local Variables
A JavaScript local variable is declared inside block or function.
It is accessible within the function or block only.
For example:
<script> <script>
function abc() If(10<13)
{ {
var x=10; var y=20;//JavaScript local variable
Variable
Value of is
x isx
} }
</script> 10(Local) </script>
Global Variables
A JavaScript global variable is accessible from any function.
A variable i.e. declared outside the function or declared with window
object is known as global variable.
For example:
<html> function b()
<body> {
<script> document.write(data);
var data=200; //gloabal }
variable a(); //calling JavaScript
function a() function
{ b();
document.write(data); </script>
} </body> 200 200
</html>
Global Variables
A JavaScript global variable is declared outside the function or
declared with window object.
It can be accessed from any function.
For example:
<html> a();
<body> </script>
<script> </body>
var value=50; //global variable </html>
function a()
{
alert(value);
}
Data Types
JavaScript provides different data types to hold different types of
values.
There are two types of data types in JavaScript:
1.Primitive data type
2.Non-primitive (reference) data type/ Composit Data Types
JavaScript is a dynamic type language, means you don't need to
specify type of the variable.
 You need to use var here to specify the data type.
It can hold any type of values such as numbers, strings etc.
For example: var a=40;//holding number
var b=“Info Technology”//holding string
Data Types

JavaScript Data
Types

Primitive (Primary) Non-Primitive (Composite)

String Number Boolean Undefined Null

Object Array Function


Data Types: Primitive
Primitive data types can hold only one value at a time.
1) The String Data Type
The string data type is used to represent textual data (i.e. sequences
of characters).
Strings are created using single or double quotes surrounding one
or more characters, as shown below:
var a = ‘Welcome'; // using single quotes
var b = “Welcome”;// using double quotes
Data Types: Primitive
2) The Number Data Type
The number data type is used to represent positive or negative
numbers with or without decimal place.
The Number data type also includes some special values
which
are: Infinity,-Infinity, NaN
Example,
var a = 25; // integer
var b = 80.5; // floating-point number
var c = 4.25e+6; // exponential notation, same as 4.25e6 or 4250000
var d = 4.25e-6; // exponential notation, same as 0.00000425
Data Types: Primitive
3) The Boolean Data Type
The Boolean data type can hold only two values: True/False
Example,
var a = 2, b = 5, c = 10;
alert(b > a) // Output: true
alert(b > c) // Output: false
Data Types: Primitive
4) The Undefined Data Type
The undefined data type can only have one value-the special value
“undefined”.
If a variable has been declared, but has not been assigned a value, has
the value ”undefined”.
 Example,
var a;
var b = “Welcome”;
alert(a) // Output: undefined
alert(b) // Output: Welcome
Data Types: Primitive
5) The Null Data Type
A Null value means that there is no value.
It is not equivalent to an empty string (“ “) or zero or it is simply nothing.
Example,
var a = null;
alert(a); // Output: null
var b = "Hello World!“
alert(b); // Output: Hello World!
b = null;
alert(b) // Output: null
Data Types: Non-primitive
1) The Object Data Type
a complex data type that allows you to store collections of data.
An object contains properties, defined as a key-value pair.
 A property key (name) is always a string, but the value can be any
data type, like strings, numbers, Boolean, or complex data types like
arrays, function and other objects.
Example,
var car =
{ "modal": “SUZUKI", "color": “WHITE", “model": 2019 }
Data Types: Non-primitive
2) The Array Data Type
An array is a type of object used for storing multiple values in single
variable.
Each value (also called an element) in an array has a numeric position,
known as its index, and it may contain data of any data type-numbers,
strings, Booleans, functions, objects, and even other arrays.
The array index starts from 0, so that the first array element is arr [0].
The simplest way to create an array is by specifying the array elements
as a comma-separated list enclosed by square brackets, as shown in the
example below:
var cities = ["London", "Paris", "New York"];
alert(cities[2]); // Output: New York
Data Types: Non-primitive
3) The Function Data Type
The function is callable object that executes a block of code.
 Since functions are objects, so it is possible to assign them to variables, as
shown in the example below:
var ab = function()
{
return “Welcome”;
}
alert(typeof ab);//output: function
alert(ab());//output:Welcome
Example : Non- Primitive
<html>
<body>
<h1>JavaScript Array</h1>
<script>
var stringArray = ["one", "two", "three"];
var mixedArray = [1, "two", "three", 4];
document.write(stringArray+"<br>");
document.write( mixedArray);
</script>
</body> JavaScript Array
</html> OUTPUT one,two,three
1,two,three,4
Values/Literals
They are types that can be assigned a single literal value such as the
number 5.7, or a string of characters such as "hello".
Types of Literals:
Array Literal
Integer Literal
Floating number Literal
Boolean Literal (include True and False)
Object Literal
String Literal
Array Literal
 an array literal is a list of expressions, each of which represents an array
element, enclosed in a pair of square brackets ' [ ] ‘ .
When an array is created using an array literal, it is initialized with the
specified values as its elements, and its length is set to the number of
arguments specified.
Creating an empty array :
var tv = [ ];

Creating an array with four elements.


var tv = [“LG", “Samsung", “Sony", “Panasonic"]
Array Literal
Comma in array literals:
In the following example, the length of the array is four, and tv[0] and
tv[2] are undefined.
var tv = [ , “Samsung“ , , “Panasonic"]
This array has one empty element in the middle and two elements with
values. ( tv[0] is “LG", tv[1] is set to undefined, and tv[2] is “Sony")

Var tv = [“LG", ,“Sony", ]


Integer Literal
An integer must have at least one digit (0-9).
• No comma or blanks are allowed within an integer.
• It does not contain any fractional part.
• It can be either positive or negative if no sign precedes it is assumed to be
positive.
In JavaScript, integers can be expressed in three different bases.
1. Decimal ( base 10) Decimal numbers can be made with the digits 0, 1, 2, 3, 4, 5,
Example: 123, -20, 12345 6, 7, 8, 9 and there will be no leading zeros.
2. Hexadecimal ( base 16)
Hexadecimal numbers can be made with the digits 0, 1, 2, 3, 4,
Example: 7b, -14, 3039 5, 6, 7, 8, 9 and letters A, B, C, D, E, F or a, b, c, d, e, f.
3. Octal (base 8) A leading 0x or 0X indicates the number is hexadecimal.
Example: 173, -24, 30071
Octal numbers can be made with the digits 0, 1, 2, 3, 4, 5, 6, 7.
A leading 0 indicates the number is octal.
Floating Number Literal
A floating number has the following parts.
• A decimal integer.
• A decimal point ('.').
• A fraction.
• An exponent.
The exponent part is an "e" or "E" followed by an integer, which can be signed
(preceded by "+" or "-").
Example of some floating numbers :
•8.2935
•-14.72
•12.4e3 [ Equivalent to 12.4 x 103 ]
•4E-3 [ Equivalent to 4 x 10-3 => .004 ]
Object Literal
An object literal is zero or more pairs of comma-separated list of property names
and associated values, enclosed by a pair of curly braces.
In JavaScript an object literal is declared as follows:

1. An object literal without properties:


var userObject = {}
2. An object literal with a few properties :
var student = { Syntax Rules
First-name : "Suresy", •There is a colon (:) between property name and value.
Last-name : "Rayy", •A comma separates each property name/value from
Roll-No : 12 the next.
}; •There will be no comma after the last property
name/value pair.
String Literal
JavaScript has its own way to deal with string literals.
A string literal is zero or more characters, either enclosed in single
quotation (') marks or double quotation (") marks. You can also use +
operator to join strings.
The following are the examples of string literals :
string1 = "w3resource.com"
string1 = 'w3resource.com’
string1 = "1000“
In addition to ordinary characters, you can include special characters in
strings, as shown in the following.
string1 = "First line. \n Second line."
Comments
The JavaScript comments are meaningful way to deliver message.
 It is used to add information about the code, warnings or suggestions so
that end user can easily interpret the code.
The JavaScript comment is ignored by the JavaScript engine i.e.
embedded in the browser.
Types of JavaScript Comments
There are two types of comments in JavaScript.
1. Single-line Comment

It is represented by double forward slashes (//).


It can be used before and after the statement.

<script>
// It is single line comment
document.write("hello javascript");
</script>
Types of JavaScript Comments
There are two types of comments in JavaScript.
2. Multi-line Comment

It can be used to add single as well as multi line comments.


It is represented by forward slash with asterisk then asterisk with
forward slash.

<script>
/* It is multi line comment.
It will not be displayed */
document.write("example of javascript multiline comment");
</script>
Quiz Time !
Q1. A ________is simply a name of storage location.
Ans : JavaScript Variable

Q2. _______ is accessible within the function or block only.

Ans: Local Variable


Q3. State 2 types of Data Types in JavaScript.

Ans : Primitive
Non- Primitive
Quiz

https://forms.office.com/Pages/DesignPage.aspx?auth
_pvr=OrgId&[email protected]
&origin=shell#FormId=QEUap70T20yz690UXwrJwIuVSI
KHZ3RDo4EeJ2CYjgFUNjhLQ1hVMEVNTkVVQUtKWUxC
S1JVSzcwRy4u

You might also like