Scribd
Upload
101 views12 pages

Ex2 Javascript

This document provides an overview of JavaScript concepts and examples of JavaScript programs. It discusses: 1. Why JavaScript is important for web development and some of its main uses 2. Examples of simple JavaScript programs to display text and use functions like prompt(), alert(), and write() 3. How to use control structures like if/else statements, for loops, and functions to add interactivity and perform calculations The document contains 19 sections that provide examples of JavaScript code to demonstrate basic programming concepts like user input, conditional logic, repetition with loops, and defining reusable functions.

Uploaded by

Sherril Vincent
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
101 views12 pages

Ex2 Javascript

This document provides an overview of JavaScript concepts and examples of JavaScript programs. It discusses: 1. Why JavaScript is important for web development and some of its main uses 2. Examples of simple JavaScript programs to display text and use functions like prompt(), alert(), and write() 3. How to use control structures like if/else statements, for loops, and functions to add interactivity and perform calculations The document contains 19 sections that provide examples of JavaScript code to demonstrate basic programming concepts like user input, conditional logic, repetition with loops, and defining reusable functions.

Uploaded by

Sherril Vincent
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/ 12

IT6503-WEB PROGRAMMING

Unit-1: Javascript

1. Why Study JavaScript?


JavaScript is one of the 3 languages all web developers must learn:
1. HTML to define the content of web pages
2. CSS to specify the layout of web pages
3. JavaScript to program the behavior of web pages

2. What is the need of JavaScript?


• It is used to enhance the functionality and appearance of web pages
• It is a client-side scripting language for web-based applications due to its highly
portable nature.
• It is a client-side scripting, which makes web pages more dynamic and interactive
• It provides the programming foundation for the server-side scripting
• JavaScript is case sensitive

3. Write a Program to display a line of text.


<html> <head> <title>A First Program in JavaScript</title> </head>
<body>
<script type = "text/javascript">
document.writeln("<h1>Welcome to JavaScript Programming!</h1>" );
</script>
</body>
</html>

4. Write a program to display a Line of Colored Text


 Displays the text in magenta, using the CSS color property
 The + operator (called the “concatenation operator”)
 JavaScript allows large statements to be split over many lines.
<html>
<head>
<title>Printing a Line with Multiple Statements</title>
<script type = "text/javascript">
document.write( "<h1 style = 'color: magenta'>" );
document.write( "Welcome to JavaScript " +"Programming!</h1>" );
</script>
</head><body></body></html>

1|Page H.Bemesha Smitha,AP/IT, LICET


IT6503-WEB PROGRAMMING
Unit-1: Javascript
5. What is Alert dialog in Javascript?
• To display information in windows called dialogs (or dialog boxes) that “pop up” on
the screen to grab the user’s attention.
• Dialogs typically display important messages to users browsing the web page.

6. What is window object in JavaScript?


The window Object:
 It is used to display an alert dialog
 The argument to the window object’s alert method is the string to display.

7. What is prompt box in JavaScript?


Predefined dialog box from the window object—a prompt dialog—which allows the user to
enter a value that the script can use

8. How to use the escape sequences in javascript?


Escape Sequences:
\n New line \" Double quote
\t Horizontal tab \' Single quote
\\ Backslash

9. Write a program to display Text in an Alert Dialog


<html>
<head>
<meta charset = "utf-8">
<title>Printing Multiple Lines in a Dialog Box</title>
<script type = "text/javascript">
<!--
window.alert( "Welcome to\nJavaScript\nProgramming!" );
// -->
</script>
</head>
<body><p>Click Refresh (or Reload) to run this script again.</p>
</body></html>

2|Page H.Bemesha Smitha,AP/IT, LICET


IT6503-WEB PROGRAMMING
Unit-1: Javascript
10. Write a program to obtaining User Input with prompt Dialogs to have a Dynamic
Welcome Page
<html>
<head>
<meta charset = "utf-8">
<title>Using Prompt and Alert Boxes</title>
<script type = "text/javascript">
<!--
var name; // string entered by the user

// read the name from the prompt box as a string


name = window.prompt( "Please enter your name" );

document.writeln( "<h1>Hello " + name +", welcome to JavaScript


programming!</h1>" );
// -->
</script>
</head>
<body></body></html>

3|Page H.Bemesha Smitha,AP/IT, LICET


IT6503-WEB PROGRAMMING
Unit-1: Javascript
11. Write a program to obtain user input with prompt dialogs to add integers
Function parseInt converts its string argument to an integer.

<html>
<head>
<title>An Addition Program</title>
<script type = "text/javascript">
<!--
var firstNumber;
var secondNumber;
var number1;
var number2;
var sum;

firstNumber = window.prompt( "Enter first integer" );

secondNumber = window.prompt( "Enter second integer" );

number1 = parseInt( firstNumber );


number2 = parseInt( secondNumber );

sum = number1 + number2;

document.writeln( "<h1>The sum is " + sum + "</h1>" );


// -->
</script>
</head>
<body></body>
</html>

4|Page H.Bemesha Smitha,AP/IT, LICET


IT6503-WEB PROGRAMMING
Unit-1: Javascript
12. Write a program to create and use a new date object
<html>
<head>
<title>Using Relational Operators</title>
<script type = "text/javascript">
<!--
var name;
var now = new Date(); // current date and time

var hour = now.getHours(); // current hour (0-23)

name = window.prompt( "Please enter your name" );

// determine whether it’s morning


if ( hour < 12 ) document.write( "<h1>Good Morning, " );

//determine whether the time is PM


if ( hour >= 12 ){
hour = hour - 12; // convert to a 12-hour clock

// determine whether it is before 6 PM


if ( hour < 6 )
document.write( "<h1>Good Afternoon, " );

if ( hour >= 6 )
// determine whether it is after 6 PM
document.write( "<h1>Good Evening, " );
} // end if
document.writeln( name +", welcome to JavaScript programming!</h1>" );
// -->
</script></head><body></body></html>

5|Page H.Bemesha Smitha,AP/IT, LICET


IT6503-WEB PROGRAMMING
Unit-1: Javascript

13. Write a program to calculate a class average


<html>
<head>
<title>Class Average Program</title>
<script>
var total;
var gradeCounter;
var grade;
var gradeValue;
var average;

total = 0;
gradeCounter = 1;

while ( gradeCounter <= 10 )


{
grade = window.prompt( "Enter integer grade:", "0" );
gradeValue = parseInt( grade );

total = total + gradeValue;

gradeCounter = gradeCounter + 1;
}

average = total / 10;

document.writeln("<h1>Class average is " + average + "</h1>" );


</script>
</head><body></body></html>

14. Write a program in javascript to find the sum the Even Integers from 2 to 100
<html>
<head>
<title>Sum the Even Integers from 2 to 100</title>
<script>
var sum = 0;

for ( var number = 2; number <= 100; number += 2 )


sum += number;

document.writeln( "The sum of the even integers " + "from 2 to 100 is " + sum );
</script>
</head><body></body></html>

6|Page H.Bemesha Smitha,AP/IT, LICET


IT6503-WEB PROGRAMMING
Unit-1: Javascript

15. Write a program in javascript to explain the use of break statement


<html>
<head>
<title>Using the break Statement in a for Statement </title>
<script>
for ( var count = 1; count <= 10; ++count )
{
if ( count == 5 )
break;
document.writeln( count + " " );
}
document.writeln( "<p>Broke out of loop at count = " + count + "</p>" );
</script>
</head><body></body></html>

16. Write a program in javascript to explain the use of continue statement


<html>
<head>
<title>Using the continue Statement in a for Statement </title>
<script>
for ( var count = 1; count <= 10; ++count )
{
if ( count == 5 )
continue;
document.writeln( count + " " );
}
document.writeln( "<p>Used continue to skip printing 5</p>" );
</script>
</head><body></body></html>

17. Write a program in javascript to display the heading in different levels using do..while
statement
<html>
<head> <title>Using the do...while Repetition Statement</title>
<script>
var counter = 1;
do {
document.writeln( "<h" + counter + ">Level" + counter + " </h" + counter + ">" );
++counter;
} while ( counter <= 6 );
</script>
</head><body></body></html>

7|Page H.Bemesha Smitha,AP/IT, LICET


IT6503-WEB PROGRAMMING
Unit-1: Javascript

18. Write a program in Javascript to find the square using function


<html>
<head>
<title>A Programmer-Defined square Function</title>
<style type = "text/css">
p { margin: 0; }
</style>
<script>
document.writeln( "<h1>Square the numbers from 1 to 10</h1>" );

for ( var x = 1; x <= 10; ++x )


document.writeln( "<p>The square of " + x + " is " + square( x )+ "</p>" );

function square( y )
{
return y * y;
}
</script>
</head><body></body> </html>

19. Write a program in Javascript to find the maximum of Three Values


<html>
<head>
<title>Maximum of Three Values</title>
<script>
var input1 = window.prompt( "Enter first number", "0" );
var input2 = window.prompt( "Enter second number", "0" );
var input3 = window.prompt( "Enter third number", "0" );

var value1 = parseFloat( input1 );


var value2 = parseFloat( input2 );
var value3 = parseFloat( input3 );

var maxValue = maximum( value1, value2, value3 );

document.writeln( "<p>Maximum is: " + maxValue + "</p>" );

function maximum( x, y, z )
{
return Math.max( x, Math.max( y, z ) );
}
</script>
</head><body></body> </html>

8|Page H.Bemesha Smitha,AP/IT, LICET


IT6503-WEB PROGRAMMING
Unit-1: Javascript

20. Write a program in Javascript to find the factorial using recursion with event handling
<html>
<head>
<title>Recursive Factorial Function</title>
<script>

var output = "";

function calculateFactorials()
{
for ( var i = 0; i <= 10; ++i )
output += "<p>" + i + "! = "+ factorial( i )+"</p>";

document.getElementById( "results" ).innerHTML = output;


}

// Recursive definition of function factorial


function factorial( number )
{
if ( number <= 1 )
return 1;
else
return number * factorial( number - 1 );
}

window.addEventListener( "load", calculateFactorials, false );


</script>
</head>
<body>

<h1>Factorials of 0 to 10</h1>

<div id = "results"></div>
</body>
</html>

9|Page H.Bemesha Smitha,AP/IT, LICET


IT6503-WEB PROGRAMMING
Unit-1: Javascript

21. Write a program in Javascript that simulates 30 rolls of a six-sided die and displays the
value of each roll
<html>
<head>
<title>Shifted and Scaled Random Integers</title>
<script>
var value;
document.writeln( "<p>Random Numbers</p><ol>" );
for ( var i = 1; i <= 30; ++i )
{
value = Math.floor( 1 + Math.random() * 6 );
document.writeln( "<li>" + value + "</li>" );
}
document.writeln( "</ol>" );
</script>
</head><body></body></html>

22. Write the difference between Recursion vs Iteration


Iteration Recursion
Iteration uses a repetition statement Recursion uses a selection statement
(e.g., for, while or do…while) (e.g., if, if…else or switch)
It involve repetition It involve repetition
It keeps modifying a counter until the It keeps producing simpler versions of the
counter assumes a value that makes the loop- original problem until the base case is
continuation condition fail; reached
It can occur infinitely It can occur infinitely
Iteration terminates when the loop- Recursion terminates when a base case is
continuation condition fails recognized

23. What are the global functions in JavaScript?


parseInt to convert the beginning of the string into an integer value.
parseFloat convert the beginning of the string into a floating-point value
isNaN Takes a numeric argument and returns true if the value of the argument is not
a number; otherwise, it returns false.
isFinite Takes a numeric argument and returns true if the value of the argument is not
NaN, Number.

24. What is counter-controlled repetition?


It uses a variable called a counter to control the number of times a set of statements executes.

25. What is Sentinel-controlled repetition (or) indefinite repetition?


• The number of repetitions is not known before the loop begins executing.
• A sentinel value (also called a signal value, a dummy value or a flag value) to indicate the
end of data entry

10 | P a g e H.Bemesha Smitha,AP/IT,
LICET
IT6503-WEB PROGRAMMING
Unit-1: Javascript

26. Explain the Javascript objects.


Math object:
The Math object’s methods enable you to conveniently perform many common mathematical
calculations
var result = Math.sqrt( 900 );

String Object:
A string is a series of characters treated as a single unit.
A string may include letters, digits and various special characters, such as +, -, *, /, and $.
var color = "blue";

String object’s character-processing methods, including:


charAt returns the character at a specific position
charCodeAt returns the Unicode value of the character at a specific position
fromCharCode returns a string created from a series of Unicode values
toLowerCase returns the lowercase version of a string
toUpperCase returns the uppercase version of a string

11 | P a g e H.Bemesha Smitha,AP/IT,
LICET
IT6503-WEB PROGRAMMING
Unit-1: Javascript

Date Object:
It provides methods for date and time manipulations
getDate() getMonth() setMinutes( m, s, ms )
getDay() getTime() setMonth( m, d )
getHours() setDate( val ) setSeconds( s, ms )
getMinutes() setHours( h, m, s, ms ) setTime( ms )
getSeconds() setMilliSeconds( ms ) toString()

Boolean and Number Objects:


• JavaScript provides the Boolean and Number objects as object wrappers for boolean true/
false values and numbers, respectively.
• These wrappers define methods and properties useful in manipulating boolean values and
numbers

The booleanValue specifies whether the Boolean object should contain true or false
var b = new Boolean( booleanValue );

JavaScript automatically creates Number objects to store numeric values in a script.


var n = new Number( numericValue );

document object:
• JavaScript code to manipulate the current document in the browser.
• The document object has several properties and methods, such as method
document.getElementByID,
Methods:

12 | P a g e H.Bemesha Smitha,AP/IT,
LICET

You might also like