Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
0% found this document useful (0 votes)
5 views

Javascript 1 - Basic JavaScript

Uploaded by

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

Javascript 1 - Basic JavaScript

Uploaded by

zozo
Copyright
© © All Rights Reserved
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