JavaScript – Code Examples & Exercise Solutions
Class 9 – Federal Board / National Curriculum
🧠 1. Basic JavaScript Syntax
✅ Example 1: Displaying a Message
[Link]("Hello, JavaScript!");
Explanation:
[Link]() is used to print text on the web page.
✅ Example 2: Popup Message
alert("Welcome to JavaScript!");
Explanation:
alert() shows a message in a popup window.
✅ Example 3: Taking User Input
var name = prompt("Enter your name:");
[Link]("Hello, " + name + "!");
Explanation:
prompt() takes input from the user.
+ is used to concatenate strings.
📦 2. Variables & Data Types
✅ Example 4: Declaring Variables
var studentName = "Ali";
var age = 15;
var isPassed = true;
[Link]("Name: " + studentName + "<br>");
[Link]("Age: " + age + "<br>");
[Link]("Passed: " + isPassed);
Explanation:
Variables store data of different types: string, number, boolean.
📊 3. Arithmetic Operations
✅ Example 5: Performing Calculations
var num1 = 10;
var num2 = 5;
var sum = num1 + num2;
var diff = num1 - num2;
var product = num1 * num2;
var quotient = num1 / num2;
[Link]("Sum: " + sum + "<br>");
[Link]("Difference: " + diff + "<br>");
[Link]("Product: " + product + "<br>");
[Link]("Quotient: " + quotient);
Explanation:
+ - * / are arithmetic operators.
🔎 4. Conditional Statements
✅ Example 6: Checking Even or Odd
var number = parseInt(prompt("Enter a number:"));
if (number % 2 == 0) {
[Link](number + " is Even");
} else {
[Link](number + " is Odd");
}
Explanation:
% is the modulus operator.
if...else is used for decision-making.
✅ Example 7: Grade Calculator
var marks = parseInt(prompt("Enter your marks:"));
if (marks >= 80) {
[Link]("Grade: A+");
} else if (marks >= 70) {
[Link]("Grade: A");
} else if (marks >= 60) {
[Link]("Grade: B");
} else if (marks >= 50) {
[Link]("Grade: C");
} else {
[Link]("Grade: Fail");
}
Explanation:
Multiple conditions can be checked using if...else if...else.
🔁 5. Loops (Iteration)
✅ Example 8: Printing 1 to 10
for (var i = 1; i <= 10; i++) {
[Link](i + "<br>");
}
Explanation:
for loop is used for repeating a task a specific number of times.
✅ Example 9: Multiplication Table
var num = parseInt(prompt("Enter a number:"));
for (var i = 1; i <= 10; i++) {
[Link](num + " x " + i + " = " + (num * i) + "<br>");
}
Explanation:
Loops are useful for printing tables and sequences.
🧩 6. Functions
✅ Example 10: Simple Function
function greet() {
[Link]("Hello, welcome to JavaScript!");
}
greet(); // Calling the function
Explanation:
Functions group code for reusability.
✅ Example 11: Function with Parameters
function add(a, b) {
var sum = a + b;
[Link]("Sum = " + sum);
}
add(5, 8); // Output: Sum = 13
Explanation:
Functions can take inputs (parameters) and perform actions.
🖱️7. Events & DOM Manipulation
✅ Example 12: Button Click Event
<!DOCTYPE html>
<html>
<head>
<script>
function showMessage() {
[Link]("output").innerHTML = "Button Clicked!";
}
</script>
</head>
<body>
<button Me</button>
<p id="output"></p>
</body>
</html>
Explanation:
onclick event calls the showMessage() function.
getElementById() accesses an element in the HTML.
📘 Exercise Solutions (From Textbook)
🧪 Exercise 1: Display Student Info
var name = prompt("Enter your name:");
var age = prompt("Enter your age:");
var grade = prompt("Enter your class:");
[Link]("Name: " + name + "<br>");
[Link]("Age: " + age + "<br>");
[Link]("Class: " + grade);
🧪 Exercise 2: Find the Largest Number
var a = parseInt(prompt("Enter first number:"));
var b = parseInt(prompt("Enter second number:"));
if (a > b) {
[Link](a + " is greater.");
} else if (b > a) {
[Link](b + " is greater.");
} else {
[Link]("Both are equal.");
}
🧪 Exercise 3: Check Positive, Negative, or Zero
var num = parseInt(prompt("Enter a number:"));
if (num > 0) {
[Link]("Positive");
} else if (num < 0) {
[Link]("Negative");
} else {
[Link]("Zero");
}
🧪 Exercise 4: Factorial of a Number
var n = parseInt(prompt("Enter a number:"));
var fact = 1;
for (var i = 1; i <= n; i++) {
fact *= i;
}
[Link]("Factorial of " + n + " is " + fact);
🧪 Exercise 5: Calculator Program
var a = parseInt(prompt("Enter first number:"));
var b = parseInt(prompt("Enter second number:"));
var op = prompt("Enter operator (+, -, *, /):");
if (op == "+") {
[Link]("Result: " + (a + b));
} else if (op == "-") {
[Link]("Result: " + (a - b));
} else if (op == "*") {
[Link]("Result: " + (a * b));
} else if (op == "/") {
[Link]("Result: " + (a / b));
} else {
[Link]("Invalid operator");
}
✅ Exam Tip: Most practical questions in board exams are based on:
Variables & input/output
Conditional statements (if, else if)
Loops (for)
Functions
Basic DOM manipulation (getElementById, innerHTML)