Scribd
Upload
8 views73 pages

JavaScript Basics and Regular Expressions

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
8 views73 pages

JavaScript Basics and Regular Expressions

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

JAVASCRIPT

Client-side Scripting language


Makes web page more dynamic and interactive.
<html xmlns = "[Link]
<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"
"[Link]
<html xmlns = "[Link]
<head>
<title>A First Program in JavaScript</title>
<script type = "text/javascript">
<!--
[Link](
"<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 )
[Link]( "Passed" );
else
[Link]( "Failed" );
• [Link]( studentGrade >= 60 ? "Passed" :
"Failed" );
• if ( grade >= 90 )
[Link]( "A" );
else if ( grade >= 80 )
[Link]( "B" );
else if ( grade >= 70 )
[Link]( "C" );
else if ( grade >= 60 )
[Link]( "D" );
else
[Link]( "F" );
Dangling-else problem
• if ( x > 5 )
if ( y > 5 )
[Link]( "x and y are > 5" );
else
[Link]( "x is <= 5" );
• if ( x > 5 )
if ( y > 5 )
[Link]( "x and y are > 5" );
else
[Link]( "x is <= 5" );
Nested if
• if ( x > 5 )
{
if ( y > 5 )
[Link]( "x and y are > 5" );
}
else
[Link]( "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 = [Link](pattern);

[Link]("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 = [Link](text); string:
let result1 = [Link](text);
let result2 = [Link](text); • is
[Link]("demo").innerHTML = result;
[Link]("demo1").innerHTML = result1; • is
[Link]("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 = [Link](text);

[Link]("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 = [Link](pattern);

[Link]("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 = [Link](pattern);

[Link]("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 = [Link](pattern);

[Link]("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 = [Link](pattern);

[Link]("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 = [Link](pattern);

[Link]("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;
•

Common questions

Powered by AI

Quantifiers in '{}' specify a precise number of occurrences to match, offering control over repeated patterns. The pattern '\d{4}' enforces the match of exactly four digits, useful for extracting four-digit sequences such as years in a text related to numerical data processing.

Quantifiers like '+' and '?' adjust the number of occurrences matched by a pattern. '+' matches one or more occurrences of the preceding element, while '?' matches zero or one occurrence, controlling pattern flexibility in searches like '/o+/' for one or more 'o's and '/10?/' for '1' followed optionally by '0'.

The exec() function returns the first match it finds in a string and remembers the index of the last match allowing subsequent calls to resume searching from the end of the previous match. In contrast, match() returns all matches if a global flag is used, not just the first match.

Escape sequences in JavaScript are used to represent special characters within a string. Examples include '\n' for newline, '\t' for horizontal tab, '\r' for carriage return, '\\' for backslash, '\'' for single quote, and '\"' for double quote.

JavaScript acts as a client-side scripting language that enhances the interactivity and dynamism of web pages by allowing modifications of web page content and structure without the need for server reloading.

The test() method in JavaScript checks whether a pattern is found within a string, returning true if a match exists and false otherwise. This method is useful for simple existence checks but does not provide the location or total number of matches.

The 'dangling-else problem' arises when an else clause could potentially match with multiple if statements in a nested condition. This ambiguity can lead to unexpected program behavior unless the code is properly structured or nested using braces to clarify the intended matching.

JavaScript uses conditional operators like if-else and ternary operators for decision-making. For grading, conditions can be set such as `if (grade >= 90) { document.writeln('A'); }`, allowing for a sequence of conditions to determine the letter grade based on the numeric grade achieved.

JavaScript regular expressions are patterns used to match character combinations in strings, enabling effective text search and replacement. The global modifier `/g` allows multiple occurrences in the text to be matched. For example, in `let text = 'Is this all there is?'; let pattern = /is/g;`, applying `text.match(pattern)` would return all instances of 'is' globally in the string, resulting in 'is,is'.

In JavaScript, the '^' anchors a pattern to the start of a string while '$' anchors a pattern to the end. For instance, '^Is' matches 'Is' at the string beginning and 'is$' looks for 'is' at the string's conclusion, facilitating precise pattern targeting at string boundaries.

You might also like