Scribd
Upload
5 views

Javascript

The document provides an overview of JavaScript as a client-side scripting language that enhances web page interactivity. It covers various programming concepts including escape sequences, decision-making structures, loops, built-in objects, and regular expressions with examples. Additionally, it explains the use of modifiers and quantifiers in regular expressions for pattern matching in strings.

Uploaded by

amudhanmanogaran
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
5 views

Javascript

The document provides an overview of JavaScript as a client-side scripting language that enhances web page interactivity. It covers various programming concepts including escape sequences, decision-making structures, loops, built-in objects, and regular expressions with examples. Additionally, it explains the use of modifiers and quantifiers in regular expressions for pattern matching in strings.

Uploaded by

amudhanmanogaran
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/ 73

JAVASCRIPT

Client-side Scripting language


Makes web page more dynamic and interactive.
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<title>A First Program in JavaScript</title>
<?xml version = "1.0" encoding = "utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<title>A First Program in JavaScript</title>
<script type = "text/javascript">
<!--
document.writeln(
"<h1>Welcome to JavaScript Programming!</h1>" );
// -->
</script>
</head><body></body>
</html>
ESCAPE SEQUENCE

• \n- newline
• \t – horizontal tab
• \r –carriage return
• \\- back slash
• \’ – single quotes
• \” – double quotes
• No need to create new operator for document
or window object because these objects are
created by browsers
• Date object is JS built-in object
Precedence and Associativity
Decision making
• if ( studentGrade >= 60 )
document.writeln( "Passed" );
else
document.writeln( "Failed" );
• document.writeln( studentGrade >= 60 ? "Passed" :
"Failed" );
• if ( grade >= 90 )
document.writeln( "A" );
else if ( grade >= 80 )
document.writeln( "B" );
else if ( grade >= 70 )
document.writeln( "C" );
else if ( grade >= 60 )
document.writeln( "D" );
else
document.writeln( "F" );
Dangling-else problem
• if ( x > 5 )
if ( y > 5 )
document.writeln( "x and y are > 5" );
else
document.writeln( "x is <= 5" );
• if ( x > 5 )
if ( y > 5 )
document.writeln( "x and y are > 5" );
else
document.writeln( "x is <= 5" );
Nested if
• if ( x > 5 )
{
if ( y > 5 )
document.writeln( "x and y are > 5" );
}
else
document.writeln( "x is <= 5" );
while
Sentinel controlled loop
INCREMENT AND DECREMENT
OPERATOR
BREAK AND CONTINUE
MATH BUIT-IN OBJECTS
STRING OBJECTS
DATE OBJECTS
DOCUMENT- METHODS OR
PROPERTIES
REGULAR EXPRESSION

• A regular expression is a pattern of characters.


• The pattern is used for searching and
replacing characters in strings.
• The RegExp Object is a regular expression
with added Properties and Methods.
• Modifier Description
• /g Perform a global match (findall)
• /i Perform case-insensitive matching
• /m Perform multiline matching
• Bracket Description
• [abc] Find any character between the
brackets
• [^abc] Find any character NOT between the
brackets
• [0-9] Find any character between the
brackets (any digit)
• [^0-9] Find any character NOT between the
brackets (any non-digit)
• (x|y) Find any of the alternatives specified
MATCH()
<!DOCTYPE html> • JavaScript Regular
<html> Expression
<body> • The g Modifier
<h1>JavaScript Regular Expression</h1> • A global search for "is"
in a string:
<h2>The g Modifier</h2>
• is,is
<p>A global search for "is" in a string:</p>

<p id="demo"></p>

<script>
let text = "Is this all there is?";
let pattern = /is/g;
let result = text.match(pattern);

document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>
EXEC()
<!DOCTYPE html>
<html> • JavaScript
<body>
<h2>JavaScript Regular Expressions</h2>
Regular
<p>Do a global search for "is" in a string:</p> Expressions
<p id="demo"></p>
<p id="demo1"></p> • Do a global
<h1 id="r5">cse</h1>
<script>
search for
let text = "Is this all there is?";
let pattern = /is/g;
"is" in a
let result = pattern.exec(text); string:
let result1 = pattern.exec(text);
let result2 = pattern.exec(text); • is
document.getElementById("demo").innerHTML = result;
document.getElementById("demo1").innerHTML = result1; • is
document.getElementById("r5").innerHTML = result2;
</script>
</body>
</html>
TEST()

<!DOCTYPE html> • JavaScript Regular Expressions


<html> • The test() method returns true if
<body> it finds a match, otherwise false.
• Search a string for the character
"e":
<h2>JavaScript Regular Expressions</h2>
• true
<p>The test() method returns true if it finds a match, otherwise false.</p>

<p>Search a string for the character "e":</p>

<p id="demo"></p>

<script>
let text = "The best things in life are free";
let pattern = /e/;
let result = pattern.test(text);

document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>
<!DOCTYPE html> • JavaScript Regular Expression
<html> • Using [ ] to find a range of characters
<body> • A global search for the character "h":
<h1>JavaScript Regular Expression</h1> • h,h
<h2>Using [ ] to find a range of characters</h2>

<p>A global search for the character "h":</p> • I,s, ,t,i,s, ,a,l,l, ,t,e,r,e, ,i,s,?

<p id="demo"></p>

<script>
let text = "Is this all there is?";
let pattern = /[h]/g;
let result = text.match(pattern);

document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

let pattern = /[^h]/g;


<!DOCTYPE html> • JavaScript Regular Expression
<html> • Using [ ] to find a range of characters
<body> • A global search for the numbers 1 to 4:
<h1>JavaScript Regular Expression</h1> • 1,2,3,4
<h2>Using [ ] to find a range of characters</h2>

<p>A global search for the numbers 1 to 4:</p>


• 5,6,7,8,9
<p id="demo"></p>

<script>
let text = "123456789";
let pattern = /[1-4]/g;
let result = text.match(pattern);

document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>
• let pattern = /[^1-4]/g;
<!DOCTYPE html> • JavaScript Regular Expression
<html> • The + Quantifier
<body> • A global search for at least one "o" in a string:
<h1>JavaScript Regular Expression</h1> • ooo,o,o,oo
<h2>The + Quantifier</h2>

<p>A global search for at least one "o" in a string:</p>


• l,looo,l,l,lo,l
<p id="demo"></p>

<script>
let text = "Hellooo World! Hello W3Schools!";
let pattern = /o+/g;
let result = text.match(pattern);

document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

let pattern = /lo*/g;


<!DOCTYPE html> • JavaScript Regular Expression
<html> • The ? Quantifier
<body> • A global search for a "1", followed by zero or one
<h1>JavaScript Regular Expression</h1> "0" characters:
<h2>The ? Quantifier</h2> • 1,10,10

<p>A global search for a "1", followed by zero or one "0"


characters:</p>

<p id="demo"></p>

<script>
let text = "1, 100 or 1000?";
let pattern = /10?/g;
let result = text.match(pattern);

document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>
<!DOCTYPE html> • JavaScript Regular Expression
<html> • The {} Quantifier
<body> • A global search for sequence of four digits:
<h1>JavaScript Regular Expression</h1> • 1000,1000
<h2>The {} Quantifier</h2>

<p>A global search for sequence of four digits:</p>

<p id="demo"></p>

<script>
let text = "100, 1000 or 10000?";
let pattern = /\d{4}/g;
let result = text.match(pattern);

document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>
• let pattern = /\d{3,}/g; // ATLEAST 3
• let pattern = /\d{3,4}/g; //substring 3 to 4 digits
• A search for "is" at the end of a string:
let text = "Is this his";
let pattern = /is$/;
• A global search for "Is" at the beginning of a string:
let text = "Is this his";
let pattern = /^Is/g;
• A search for "is" followed by " all":
• let text = "Is this all there is";
let pattern = /is(?= all)/g;
• Do a global, case insensitive search for "is" not followed by " all":
• let text = "Is this all there is";
let pattern = /is(?! all)/gi;
•

You might also like