Scribd
Upload
20 views32 pages

Javascript 1

Javascript

Uploaded by

Kim
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
20 views32 pages

Javascript 1

Javascript

Uploaded by

Kim
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
You are on page 1/ 32

JavaScript

Introduction
• Object-oriented scripting language that is dynamic, weakly
typed and has first-class functions.
• used in the form of client-side JavaScript, implemented as part
of a web browser in order to provide enhanced user interfaces
and dynamic websites
JavaScript:

• JavaScript was designed to add interactivity to HTML pages

• JavaScript is a scripting language

• A scripting language is a lightweight programming language

• JavaScript is usually embedded directly into HTML pages

• JavaScript is an interpreted language (means that scripts execute

without preliminary compilation)

• Everyone can use JavaScript without purchasing a license


Writing to The HTML Document
• The HTML <script> tag is used to insert a JavaScript into an HTML page.
Example
• The example below writes a <p> element with current date information to the
HTML document:
<html>
<body>
<h1>My First Web Page</h1>
<script type="text/javascript">
document.write("<p>" + Date() + "</p>");
</script>
</body>
</html>
Statements
• A statement is a section of
Examples:
JavaScript that can be
Last_name = “Dunn”;
evaluated by a Web browser
x = 10 ;
• A script is simply a collection
y = x*x ;
of statements
Programming Tips
Recommended:
• It is a good idea to end each a = 3;
b = 4;
program statement with a Acceptable:
a = 3; b = 4;
semi-colon; Wrong:
a =
3;
• Although this is not

necessary, it will prevent

coding errors
Variables
• A variable is a name associated with a piece of data

• Variables allow you to store and manipulate data in your

programs

• Think of a variable as a mailbox which holds a specific piece of

information
Variables
• In JavaScript variables are • Example:
created using the keyword var
• var x = 10;

• var y = 17;

• var color = “red”;

• var name = “Katie”;


Variables
• It is vitally important to distinguish between the name of the

variable and the value of the variable

• For example, in the expression var color=“red”, color is the

name of the variable and red is the value. In other words, color is

the name of the box while red is what is inside the box
Data Types
Primitive Data Types

• Numbers

• Strings

Boolean (True, False)

Composite Data Types

• Arrays

• Objects
Primitive Data Types
• Numbers - A number can be either an integer or a decimal

• Strings - A string is a sequence of letters or numbers enclosed in

single or double quotes

• Boolean - True or False


Variables & Data Types

• JavaScript is untyped; It does not have explicit data types

• For instance, there is no way to specify that a particular

variable represents an integer, string, or real number

• The same variable can have different data types in different

contexts
Implicit Data Types
• Although JavaScript does not have explicit data types, it does

have implicit data types

• If you have an expression which combines two numbers, it will

evaluate to a number

• If you have an expression which combines a string and a

number, it will evaluate to a string


Example: Variables
var x = 4; Ans = x + y;
Ans => 15
var y = 11;
Ans = z + x;
var z = “cat”; Ans => cat4

var q = “17”; Ans = x + q;


Ans => 417
More Examples
var x = 4; Ans = x + y + z;
Ans => 15cat
var y = 11;
Ans = q + x + y;
var z = “cat”; Ans => 17411

var q = “17”;
Variable Names
• JavaScript is case sensitive

• Variable names cannot contain spaces, punctuation, or start with

a digit

• Variable names cannot be reserved words


Programming Tips
• It is bad practice to change the implicit type of a variable. If a

variable is initialized as a number, it should always be used as

an number.

• Choose meaningful variable names


Operators
+ Addition == Equality
- Subtraction != Inequality
* Multiplication ! Logical NOT
/ Division && Logical AND
% Modulus || Logical OR
++ Increment ? Conditional
-- Decrement Selection
Aggregate Assignments
• Aggregate assignments provide a shortcut by combining the

assignment operator with some other operation

• The += operator performs addition and assignment

• The expression x = x + 7 is equivalent to the expression x += 7


Increment and Decrement
• Both the increment (++) and x = 10; x = 10;

decrement (- -) operator y = ++ x; z = x ++;

come in two forms: prefix and

postfix  y = 11

• These two forms yield  z = 10

different results  x = 11 in both cases


Control Structures
• There are three basic types of control structures in JavaScript:

the if statement, the while loop, and the for loop

• Each control structure manipulates a block of JavaScript

expressions beginning with { and ending with }


The If Statement
If ( x = = 10)
• The if statement allows { y = x*x;
}
JavaScript programmers to a else
{ x = 0;
make decision }

• Use an if statement whenever

you come to a “fork” in the

program
Repeat Loops
• A repeat loop is a group of statements that is repeated until a

specified condition is met

• Repeat loops are very powerful programming tools; They allow

for more efficient program design and are ideally suited for

working with arrays


The While Loop
• The while loop is used to
count = 0;
execute a block of code while
while (count <= 10) {
a certain condition is true
document.write(count);

count++;

}
The For Loop
• The for loop is used when there is a need to have a counter of

some kind

• The counter is initialized before the loop starts, tested after each

iteration to see if it is below a target value, and finally updated

at the end of the loop


Example: For Loop

// Print the numbers 1 through i=1 initializes the counter


10
i<=10 is the target
for (i=1; i<= 10; i++) value
document.write(i);
i++ updates the
counter at the end
of the loop
Example: For Loop

<SCRIPT <SCRIPT
LANGUAGE= LANGUAGE=
"JavaScript"> "JavaScript">
document.write("1");
document.write("2");
for (i=1; i<=5; i++)
document.write("3");
document.write(i);
document.write("4");
document.write("5");
</SCRIPT>
Functions

• Functions are a collection of JavaScript statement that performs

a specified task

• Functions are used whenever it is necessary to repeat an

operation
Functions
• Functions have inputs and outputs

• The inputs are passed into the function and are known as

arguments or parameters

• Think of a function as a “black box” which performs an

operation
Defining Functions
• The most common way to define a function is with the function

statement.

• The function statement consists of the function keyword

followed by the name of the function, a comma-separated list of

parameter names in parentheses, and the statements which

contain the body of the function enclosed in curly braces


Example: Function
function square(x)
{return x*x;} Name of Function: square

z = 3; Input/Argument: x
sqr_z = square(z);
Output: x*x
Example: Function

function sum_of_squares(num1,num2)
{return (num1*num1) + (num2*num2);}

function sum_of_squares(num1,num2)
{return (square(num1) + square(num2));}

You might also like