JavaScript Basics ‒ Step by Step

Author: maryum humayun

Created with Pi
JavaScript Basics

Leader : Teacher:

Muntaha Asif Minahil Irfan

Group Members: Institute:

SMIT

Inza

Tehreem

Amna

Maryam

Rubab

Zubi
CONTENTS

. Alerts . Variables for Strings

. Variables for Numbers . Variable Names: Legal and Illegal

. Math Expressions: Familiar . Math Expressions: Unfamiliar

Operators Operators

. Math Expressions: Eliminating . Concatenating Text Strings

Ambiguity

. Prompts . if Statements

. Comparison Operators . if...else and else if Statements

. Testing Sets of Conditions . if Statements Nested

. Arrays . Arrays: Adding and Removing

Elements

. Arrays: Removing, Inserting, and . for Loops

Extracting Elements

. for Loops: Flags, Booleans, Array . for Loops Nested

Length, and Breaks

Summar y & Next Steps

Alerts are a way to display messages to the user.

They can be useful for Use the alert() function to

debugging or notifying users. show a message.

Example:

alert("Hello, World!");
Variables for Strings
Variables for Strings

Variables can be used to store text data.

Strings are enclosed in They can be single (') or

quotes. double (").

Example:

let greeting = "Hello!";

Variables can also hold numeric data.

Numbers can be integers or They are not enclosed in

decimals. quotes.

Example:

let age = ;
Variable Names: Legal and Illegal
Variable Names: Legal and Illegal

Variable names follow certain rules.

They must start with a letter, underscore, or dollar They cannot contain spaces or special characters.

sign.

Example of legal names:

let $variable;

let _variable;
Math Expressions: Familiar Operators
Math Expressions: Familiar

Operators

Familiar operators include:

Addition (+) Subtraction (-)

Multiplication (*) Multiplication (*)

Modulus %

Example:

let sum = + ;
Math Expressions: Unfamiliar Operators
Math Expressions:

Unfamiliar Operators

Some operators may be less familiar, such as:

Modulus (%) Exponentiation (**)

returns the remainder of raises a number to the power

division. of another.

Example:

let remainder = % ;
Math Expressions: Eliminating Ambiguity
Math Expressions:

Eliminating Ambiguity

Use parentheses to clarify expressions.

Parentheses dictate the order of operations.

Example:

let result = ( + ) * ;
Concatenating Text Strings
Concatenating Text Strings

Strings can be combined using the + operator.

This is known as concatenation.

Example:

let fullName = "John" + " " + "Doe";

Prompts allow you to get user input.

Use the prompt() function to display a dialog box.

Example:

let userInput = prompt("Enter your name:");

if statements allow you to perform actions based on conditions.

They check if a condition is true.

Example:

if (age >= ) { alert("You are an adult."); }

Comparison operators are used in conditions:

Equal to (==) Not equal to (!=) Greater than (>) Less than (<)

Example:

if (score >= ) { alert("You passed!"); }

Statements

if...else statements allow for alternative actions.

Use else if for multiple conditions.

Example:

if (score >= ) { alert("A"); } else if (score >= ) { alert("B"); } else {

alert("C"); }
Testing Sets of Conditions
Testing Sets of Conditions

You can test multiple conditions using logical operators:

AND (&&) OR (||)

Example:

if (age >= && hasID) { alert("You can enter."); }

You can nest if statements within each other.

This allows for more complex conditions.

Example:

if (age >= ) { if (hasID) { alert("You can enter."); } else {

alert("You need an ID."); } }

Arrays store multiple values in a single variable.

They are created using square brackets.

Example:

let colors = ["red", "green", "blue"];

Removing Elements

You can modify arrays using methods:

push() to add elements. pop() to remove the last

element.

Example:

colors.push("yellow"); colors.pop();
Arrays: Removing, Inserting, and Extracting

Elements
Arrays: Removing, Inserting, and Extracting

Elements

Other array methods include:

shift() to remove the first unshift() to add an element at slice() to extract a portion of the

element. the beginning. array.

Example:

colors.shift(); colors.unshift("purple");
for Loops
for Loops

for loops allow you to repeat actions.

They are useful for iterating over arrays.

Example:

for (let i = ; i < colors.length; i++) { console.log(colors[i]); }

for (initialization; condition; increment) {

// Code to run each time the loop executes

}
for Loops: Flags, Booleans, Array Length,

and Breaks
for Loops: Flags, Booleans, Array Length,

and Breaks

You can use flags and conditions within loops:

Use a boolean to control when to stop looping.

Example:

let found = false; for (let i = ; i < colors.length; i++) { if (colors[i] === "green") { found = true; break; } }
for Loops Nested
for Loops Nested

Nested for loops allow for more complex iterations.

Useful for multi-dimensional arrays.

Example:

for (let i = ; i < ; i++) { for (let j = ; j < ; j++) { console.log(i, j); } }
Summary & Next Steps
Summary & Next Steps

Review the key Practice coding Explore

concepts covered examples to additional

in each chapter. reinforce resources to

learning. deepen your

understanding of

JavaScript.
Thank You