Scribd
Upload
8 views

Javascript 1 - Basic JavaScript

Uploaded by

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

Javascript 1 - Basic JavaScript

Uploaded by

zozo
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 27

JAVASCRIPT 1

1
Objectives
2

 Describe JavaScript

 Understand foundation of JavaScript syntax

 Control Structure

 Functions
What is JavaScript
3

 It is a scripting language that can be used to create client-side

scripts and server-side scripts.

 JavaScript makes it easier to create dynamic and interactive Web

pages.

 JavaScript is a scripting language developed by Sun Microsystems


and Netscape.

 JavaScript developed from Netscapes’s Livescript.

 Client applications run in a browser such as chrome, MS Edge,


Firefox, Opera ….
JavaScript effects and rules
4

 JavaScript can enhance the dynamics and interactivity

of the site by using its effects.

• Provide User Interaction


• Dynamically Change Content
• Validate data
• Using function
JavaScript run-time environment
5

 Run Time Environment

– Client Side Scripting


– Java Script on Web Server
Enabling JavaScript in Browsers
6

 JavaScript in Internet Explorer

Tools → Internet Options → Security → Custom Level →


Scripting → Active scripting

 JavaScript in Firefox

New tab → type about: config → javascript.enabled → select


toggle

 JavaScript in Chrome

Settings → Show advanced settings → Privacy → Javascript →


Allow
Embedding JavaScript in Web Page
7

 The JavaScript can be inserted into an HTML document

in the following ways :


• Using <script> tag
• Using an external File
• Using JavaScript in event handlers
Program Using Msg box and write method
8

<html>
<head>
<script language = "JavaScript">
confirm ("Are you Sure?");
alert("OK");
document.write("Thank You!");
</script>
</head>
</html>
JavaScript Comments
9

 JavaScript comments can be used to explain JavaScript code,


and to make it more readable.

 JavaScript comments can also be used to prevent execution,


when testing alternative code.

// line comment
/* Block comment */
Variables
10

 A variable is a container that refers to a memory location.


 It is used to hold values that may change while the script is
executing.
 Variables follow some naming conventions.
 A variable is declared using the keyword ‘var’. ex. var x = 10;
 Variables have a scope that is determined by where they are
declared in the script.
• Global Variable
• Local Variable
 Literals are fixed values that can be used in the script.
Data Types
11

 JavaScript has a relatively small set of data types.


 Numbers
 Logical or Boolean
 Strings
 Null
 Array
 Object
Data Types
12

 In JavaScript, two variables of different types can be

combined.
Example: var x = 'This apple costs = ' +
5;
will result in a string with value "This apple costs =
5".
Primitive Data Type
13

 Integer – These can be expressed in decimal, hexadecimal


and binary number system.
 Floating- point - These number can have a decimal point
or an “e” or “”E” followed by an integer.
 String - A string literal is zero or more characters enclosed
in single or double quotation marks.
 Boolean - This can take only two values: True or False.
 null - The null type has only one value: null. Null implies no
data
Operators
14

 Operators take one or more variables or values (operands) and return a


new value.

 JavaScript uses both binary and unary operators.

 Operators are classified depending on the relation they perform like:


– Arithmetic Operator
– Comparison Operator
– Logical Operator
– String Operator
– Evaluation Operator
– Operator Precedence
Arithmetic Operator
15

 Arithmetic operators take numerical values (either literals or variables)


as their operands and return a single numerical value.
 Arithmetic Operators include:
– Addition (+)
– Subtraction (-)
– Multiple (*)
– Division (/)
– Modulus (%)
– Increment (++)
– Decrement (- -)
– Exponentiation (**)
Comparison Operator
16

 A comparison operator compares its operands and returns a


logical value based on whether the comparison is true or not.
 Comparison Operators include:
– Equal to (==)
– Not Equal to (!=)
– Greater than (>)
– Greater than or equal to (>=)
– Less than (<)
– Less than or equal to (<=)
Logical Operators
17

 Logical operators are typically used to combine

multiple comparisons into a conditional expression.


 Logical Operators include:

– AND (&&)
– OR (||)
– NOT (!)
String Operator
18

 The string operator takes two string operators as operands and


creates a new string, which is same, as the two original strings run
together.
Example:

x = "yellow";

y = "green";

z = x + y + "white";
which means z is “yellowgreenwhite”
w = y + 9, which means w is “green9”
Evaluation Operator
19

 These operators generally includes:


– Conditional operator
(condition) ? trueVal : falseVal
– Assigns a specified value to a variable if a condition is true,
otherwise assigns an alternate value if condition is false.
status = (age >= 18) ? "adult" : "minor"
– Typeof operator: The typeof operator returns a string indicating the
type of the operand.
var x = 5;

document.write(typeof(x));
Operator Precedence
20

 When there are several operators to be

valuated in an expression, the precedence of


the operator determines the sequence in
which the operators are evaluated.
 https://www.w3schools.com/js/js_arithmetic.asp
Regular Expression
21

 A regular expression is defined pattern that can be used to match the


character combinations of a string.
 Regular expressions can be used to search for character patters in a
string input by the user.
 Regular expression can include:
– Simple patterns
– Combination of simple and special characters
 Regular expressions can be created in one of two ways:
– Using an object initializer
– Calling the constructor function of the RegExp object
Using Regular Expression
22

 The methods that can be used with Regular Expression

includes:
– Exec, Test, Match, Search, Replace, Split
 The syntax to use a method:

objectname.method = function_name
 The syntax for calling the method in the context of the

object is:
objectname.methodname(parameters)
 https://www.w3schools.com/js/js_regexp.asp
Method for JS regular expressions
23
Function
24

 JavaScript has several pre-defined functions that we can use within the script.

 Some of pre-defined JavaScript functions includes:


– eval function
– isNaN function

 Creating User Defined Functions function


function funcName(argument1, argument2, etc){

statements;

}
• Calling a Function
• Return Statement
Q&A
25
Exercise
26

 https://www.w3schools.com/js/js_exercises.asp

 http://

www.asmarterwaytolearn.com/js/index-of-exercises.h
tml
Debugging
27

You might also like