Scribd
Upload
8 views12 pages

JavaScript Variables and Data Types Guide

The document provides an overview of JavaScript variables, including their declaration, initialization, and data types such as numeric, string, and boolean. It also covers naming conventions for variables, arithmetic operators, and the use of arrays to store lists of values. Additionally, it includes examples of manipulating the DOM with JavaScript to display variable values and change background colors.

Uploaded by

Kosaksi Pasapugazh
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
8 views12 pages

JavaScript Variables and Data Types Guide

The document provides an overview of JavaScript variables, including their declaration, initialization, and data types such as numeric, string, and boolean. It also covers naming conventions for variables, arithmetic operators, and the use of arrays to store lists of values. Additionally, it includes examples of manipulating the DOM with JavaScript to display variable values and change background colors.

Uploaded by

Kosaksi Pasapugazh
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

JavaScript Variables

A variable is a storage location and an associated symbolic


name (an identifier) which contains some known or unknown
quantity or information, a value.

var quantity; declaration

quantity=3; initialization

var quantity=3; declaration+initialization


Data Types

Numeric 0.75
String “Hello class”
Boolean true / false
Numeric

var price;
var quantity;
var total,
price=5;
quantity=3;
total=price*quantity;

var el=document.getElementById(‘cost’);
el.textContent=‘$’+total;
String

var username;
var message;
username=‘Molly’;
Message=“see our upcoming range’;

var elName=document.getElementById(‘name’);
elName.textContent=username;
var elNote=document.getElementById(‘note’);
elNote.textContent=message;
Boolean

var inStock;
var shipping;
inStock=true;
chipping-=false;

var elStock=document.getElementById(‘stock’);
elStock.className=inStock;
var elShip=document.getElementById(‘shipping’);
elShip.className=shipping;
Naming variables

Must begin with a letter


Can contain letters, numbers, $ or _ (no . Or hyphen-)
Cannot contain reserved keywords such as “if”, “while”, etc.
Case sensitive
Descriptive
No spaces
Arithmetic Operators

+ addition
- Subtraction
/ division
* Multiplication
++ Increment
-- Decrement
% modulus
Arrays

A list of values

var colors;
colors=[‘white’,’black’,’orange’];

var el = document.getElementById(‘colors’);
el.textContent=colors[0];
Arrays

colors=[‘white’,’black’,’orange’];

Index value
0 ‘white’
1 ‘black’
2 ‘orange’

var allColors;
allColors=colors.length;
Arrays

var colors;
colors=[‘white’,’black’,’orange’];
Colors[2]=‘beige’;

var el = document.getElementById(‘colors’);
el.textContent=colors[2];
Arrays

<html>
<head>
<title>bgcolor_change</title>
<script language="JavaScript”>
var myPix = new Array("red","blue","green")
function choosePic()
{
randomNum = Math.floor(Math.random()*myPix.length)
document.bgColor=myPix[randomNum]
}
Arrays

</script>
</head>
<body>

<center>
<a href="#" onmousedown="choosePic()"> random bgcolor</a>
</center>
</body>
</html>

You might also like