Scribd
Upload
20 views14 pages

Java Script Programs

The document discusses JavaScript programs covering primitive data types, embedding external scripts, mathematical operations, control structures, popup boxes, variable scope, working with objects, and array methods and properties. The programs provide examples of JavaScript concepts and features through code snippets.

Uploaded by

reyojiw404
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
20 views14 pages

Java Script Programs

The document discusses JavaScript programs covering primitive data types, embedding external scripts, mathematical operations, control structures, popup boxes, variable scope, working with objects, and array methods and properties. The programs provide examples of JavaScript concepts and features through code snippets.

Uploaded by

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

JAVA SCRIPT PROGRAMS

1 A . Program for primitive datatypes in javascript.


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Primitive Datatypes in JavaScript</title>

</head>

<body>
<h1>Primitive Data Types Example</h1>
<script>
// Number data type
let x = 250;
let y = 40.5;
document.write("Value of x: " + x +'<br>');
document.write("Value of y: " + y +'<br>');

// String data type


let str = 'Hello All';
let str1 = "Welcome to all";
document.write("Value of str: " + str +'<br>');
document.write("Value of str1: " + str1 +'<br>');

// Undefined data type


let z;
document.write("Value of z: " + z +'<br>');

// Boolean data type


let bool = true;
document.write("Value of bool: " + bool +'<br>');

// Null data type


let n = null;
document.write("Value of n: " + n +'<br>');

// BigInt data type


let bigNum = 123422227653456n;
document.write(bigNum +'<br>');
</script>
</body>
</html>
b. Program to embedding the external java script
<!DOCTYPE html>
<html>
<head>
<title>Your Web Page</title>
<script src="./script.js" defer></script>
</head>
<body>
<h1>These are some external java script buttons</h1>
<button onclick="Clickme()">Try !</button>
<button onclick="greet()">Click me</button>
<button onclick="ok()">OK</button>
</body>
</html>
c. Program for mathematical operations
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mathematical Operations in JavaScript</title>
<style>
*{
background-color: aquamarine;
}
</style>
</head>
<body style="text-align: left; font-weight: bold;">
<h1>Math Operations in JavaScript</h1>
<script>
var addition = 20 + 3;
var subtraction = 95 - 35;
var multiplication = 12 * 4;
var division = 50 / 4;
var remainder = 11 % 9;
var exponent = 2 ** 2;

document.write('Addition: 20 + 3 = ' + addition + '<br>');


document.write('Subtraction: 95 - 35 = ' + subtraction + '<br>');
document.write('Multiplication: 12 * 4 = ' + multiplication + '<br>');
document.write('Division: 50 / 4 = ' + division + '<br>');
document.write('Remainder: 11 % 9 = ' + remainder + '<br>');
document.write('Exponent: 2 ** 2 = ' + exponent + '<br>');
</script>
</body>
</html>

d. Program for control structures


<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Control statements in javascript</title>
</head>

<body style="font-size: 22px;">


<h1 style="text-align: center;">Control structures in JavaScript:</h1>
<script>
document.write('If Statement:<br>');
const num1 = 10;

if (num1 > 0) {
document.write("The number " + num1 + " is positive.<br><br>");
};

document.write('If-Else Statement:<br>');
let num = -10;
if (num > 0)
document.write(num + "The number is positive.");
else
document.write(num + "The number is negative.<br><br>");

document.write('Switch Statement:<br>');
let x = 10
switch (x) {
case 0:
document.write(x + "Number is zero.");
break;
case 1:
document.write(x + "Number is one.");
break;
default:
document.write(x + " is greater than 2.<br><br>");
};
document.write('For Loop:<br>');

for (var i = 0; i <= 20; i++) {


if (i % 5 === 0) {
document.write(i+"<br>");
}
};
</script>
</body>
</html>

e. Program for Popup boxes alert confirm and prompt box


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>

<h1>JavaScript Alert</h1>
<h3>This is an Alert box</h3>
<button onclick="myFunction()">Click here</button>

<br>

<h3> This is an Cofirm box</h3>


<button onclick="confirm()">Try it</button>

<br>

<h3> This is an Prompt box</h3>


<button onclick="ok()">Try it</button>

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

<script>
function myFunction() {
var txt;
if (confirm("Press a button!")) {
txt = "You pressed OK!";
} else {
txt = "You pressed Cancel!";
}
document.getElementById("demo").innerHTML = txt;
}

function myFunction() {
alert("I am an alert box!");
}

function ok() {
let text;
let person = prompt("Please enter your name:", "");
if (person == null || person == "") {
text = "User cancelled the prompt.";
} else {
text = "Hello you clicked ok ";
}
document.getElementById("demo2").innerHTML = text;
}
</script>
</body>
</html>

f. Program for functions variable with local and global scope


Local scope:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Javascript scope</title>

</head>
<body>
<h2>JavaScript Scope</h2>

<p id="demo1"></p>

<p id="demo2"></p>
<script>
myFunction();

function myFunction() {
let carName = "Volvo";
document.getElementById("demo1").innerHTML = typeof carName + " " + carName;
}

document.getElementById("demo2").innerHTML = typeof carName;


</script>

</body>
</html>

Global scope:
<body>
<p id="demo3"></p>
<script>
let carName = "Volvo";
myFunction();

function myFunction() {
document.getElementById("demo3").innerHTML = "I can display " + carName;
}
</script>

g. Program to create object insert and delete properties


<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Object properties</title>
</head>

<body>
<h1>Object properties</h1>
<p>Add a new property to an existing object:</p><br>
<p>Deleting object properties.</p>

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

//deleting
<p id="demo2"></p>

<script>
{
const person = {
firstname: "John",
lastname: "smith",
};

person.age = 45;
document.getElementById("demo").innerHTML =
person.firstname + " is " + person.age + " Years old.";
}

{
// deleting object
const person = {
firstname: "John",
lastname: "smith",
age: 50,
}
;

delete person.age;

document.getElementById("demo2").innerHTML =
person.firstname + " is " + person.age + " years old.";
}
</script>

</body>

</html>
h. Program to working with methods and properties of array objects.

2.

You might also like