JavaScript Practical Notes for Class 8 Students
Introduction to JavaScript
JavaScript is a powerful programming language used to make web pages interactive. With JavaScript, you can add
features like buttons, animations, games, and much more.
Basic Concepts
1. Variables
- Variables are used to store data.
- Syntax:
let variableName = value;
- Example:
let name = "John";
let age = 13;
2. Data Types
- Common data types in JavaScript:
- String: Text (e.g., "Hello")
- Number: Numbers (e.g., 10, 3.14)
- Boolean: True or False
- Example:
let isStudent = true;
let score = 95;
3. Operators
- Operators are symbols used to perform actions.
- Arithmetic Operators: `+`, `-`, `*`, `/`, `%`
- Comparison Operators: `>`, `<`, `>=`, `<=`, `===`
- Example:
let sum = 5 + 10;
let isEqual = (10 === 10); // true
Writing Your First Program
Example 1: Display a Message
<!DOCTYPE html>
<html>
<head>
<title>Display a Message</title>
</head>
<body>
<script>
alert("Welcome to JavaScript!");
</script>
</body>
</html>
Example 2: Console Log
<!DOCTYPE html>
<html>
<head>
<title>Console Log</title>
</head>
<body>
<script>
console.log("Hello, world!");
</script>
</body>
</html>
Taking Input and Showing Output
Example: Asking the User’s Name
<!DOCTYPE html>
<html>
<head>
<title>Prompt and Alert</title>
</head>
<body>
<script>
let name = prompt("What is your name?");
alert("Hello, " + name + "!");
</script>
</body>
</html>
Conditional Statements
- Used to make decisions in the program.
- Syntax:
if (condition) {
// code to execute if condition is true
} else {
// code to execute if condition is false
- Example:
html
<!DOCTYPE html>
<html>
<head>
<title>Conditional Statements</title>
</head>
<body>
<script>
let age = 15;
if (age >= 18) {
alert("You are an adult.");
} else {
alert("You are a minor.");
</script>
</body>
</html>
Loops
- Loops are used to repeat a block of code.
1. For Loop
- Syntax:
for (let i = 0; i < 5; i++) {
console.log(i);
- Example:
html
<!DOCTYPE html>
<html>
<head>
<title>For Loop</title>
</head>
<body>
<script>
for (let i = 1; i <= 10; i++) {
console.log(i);
</script>
</body>
</html>
2. While Loop
- Syntax:
let i = 0;
while (i < 5) {
console.log(i);
i++;
- Example:
html
<!DOCTYPE html>
<html>
<head>
<title>While Loop</title>
</head>
<body>
<script>
let i = 1;
while (i <= 10) {
console.log(i);
i++;
</script>
</body>
</html>
Functions
- Functions are blocks of code designed to perform a task.
- Syntax:
function functionName(parameters) {
// code to execute
- Example:
<!DOCTYPE html>
<html>
<head>
<title>Functions</title>
</head>
<body>
<script>
function greet(name) {
console.log("Hello, " + name);
greet("Alice");
</script>
</body>
</html>
Practice Problems
1. Write a program to add two numbers.
<!DOCTYPE html>
<html>
<head>
<title>Add Two Numbers</title>
</head>
<body>
<script>
let num1 = prompt("Enter the first number:");
let num2 = prompt("Enter the second number:");
let sum = Number(num1) + Number(num2);
alert("The sum is: " + sum);
</script>
</body>
</html>
2. Write a program to check if a number is even or odd.
<!DOCTYPE html>
<html>
<head>
<title>Even or Odd</title>
</head>
<body>
<script>
let number = prompt("Enter a number:");
if (number % 2 === 0) {
alert("The number is even.");
} else {
alert("The number is odd.");
</script>
</body>
</html>
3. Write a program to display numbers from 1 to 10 using a loop.
<!DOCTYPE html>
<html>
<head>
<title>Numbers from 1 to 10</title>
</head>
<body>
<script>
for (let i = 1; i <= 10; i++) {
console.log(i);
</script>
</body>
</html>
Tips for JavaScript
1. Always end statements with a semicolon `;`.
2. Use meaningful variable names.
3. Debug your code using `console.log()`.
4. Practice writing small programs regularly.
