![Prepared By: Kale J. N.
let i = 1;
do {
console.log(i);
i++;
} while (i <= 5);
2.4 for...in Loop
Used to iterate over object properties.
Example:
const person = {
name: "ABC",
age: 25
};
for (let key in person) {
console.log(key + " : " + person[key]);
}
2.5 for...of Loop
Used to iterate over iterable objects.
Example:
let colors = ["red", "green", "blue"];
for (let color of colors) {
console.log(color);
}
3. Jump Statements
3.1 break
Terminates loop immediately.
Example:
for (let i = 1; i <= 10; i++) {
if (i === 5) break;
console.log(i);
}
3.2 continue
Skips current iteration.
Example:
for (let i = 1; i <= 5; i++) {
if (i === 3) continue;
Prepared By: Kale J. N.
July 17, 2026 | Page 3 of 18](https://image.slidesharecdn.com/jspart2controlstructurearrayobjectdom-260717030813-ab43bc4e/85/Comprehensive-Guide-to-JavaScript-Control-Structures-Arrays-Objects-and-DOM-Manipulation-3-320.jpg)
![Prepared By: Kale J. N.
Arrays in Java Script
1. What is an Array?
An array is a special variable that can hold multiple values.
Example:
let numbers = [10, 20, 30, 40];
2. Creating Arrays
Method 1: Array Literal
let fruits = ["Apple", "Banana", "Mango"];
Method 2: Using new Array()
let nums = new Array(1, 2, 3, 4);
3. Accessing Elements
let arr = ["A", "B", "C"];
arr[0];
arr[arr.length - 1];
4. Array Property
length
let arr = [1,2,3];
arr.length; // 3
5. Modifying Arrays
push() - Add at end
unshift() - Add at beginning
pop() - Remove from end
shift() - Remove from beginning
6. Looping Through Arrays
For Loop
for(let i = 0; i < arr.length; i++){
console.log(arr[i]);
}
for...of
for(let value of arr){
console.log(value);
}
Prepared By: Kale J. N.
July 17, 2026 | Page 5 of 18](https://image.slidesharecdn.com/jspart2controlstructurearrayobjectdom-260717030813-ab43bc4e/85/Comprehensive-Guide-to-JavaScript-Control-Structures-Arrays-Objects-and-DOM-Manipulation-5-320.jpg)
![Prepared By: Kale J. N.
8. Spread Operator
The spread operator […] is used to expand elements of an array into individual values. It
helps in copying arrays, merging arrays, and adding new elements without modifying the
original array.
Example:
let arr2 = [...arr1, 4, 5]; → Creates a new array by copying arr1 elements and adding 4 and 5.
9. Destructuring
Destructuring is a feature in JavaScript that allows you to extract values from arrays or
objects and assign them to variables in a simple way.
let [a, b] = [10, 20];
10. Important Concepts
- Arrays are objects
- Dynamic size
- Can store mixed data types
11. Shallow vs Deep Copy
Shallow Copy:
let arr2 = arr1;
This does not create a new array.
It only copies the reference (memory address).
Both arr1 and arr2 point to the same array.
Proper Copy:
let arr2 = [...arr1];
This creates a new array and copies elements.
Prepared By: Kale J. N.
July 17, 2026 | Page 7 of 18](https://image.slidesharecdn.com/jspart2controlstructurearrayobjectdom-260717030813-ab43bc4e/85/Comprehensive-Guide-to-JavaScript-Control-Structures-Arrays-Objects-and-DOM-Manipulation-7-320.jpg)
![Prepared By: Kale J. N.
2.3 Using Constructor Function
function Person(name, age) {
this.name = name;
this.age = age;
}
const p1 = new Person("Alice", 30);
2.4 Using Class (Modern Method – ES6)
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
}
const p1 = new Person("Alice", 30);
3️. Accessing Object Properties
3.1 Dot Notation
console.log(person.name);
//prints the value of the name property of the person object to the console.
3.2 Bracket Notation
console.log(person["age"]);
Bracket notation is useful when:
Property name is dynamic
Property name has spaces
Example:
const user = {
"first name": "Rahul"
};
console.log(user["first name"]);
Prepared By: Kale J. N.
July 17, 2026 | Page 9 of 18](https://image.slidesharecdn.com/jspart2controlstructurearrayobjectdom-260717030813-ab43bc4e/85/Comprehensive-Guide-to-JavaScript-Control-Structures-Arrays-Objects-and-DOM-Manipulation-9-320.jpg)
![Prepared By: Kale J. N.
4️. Adding, Updating & Deleting Properties
4.1 Add Property
person.city = "Mumbai";
//adds a new property city to the person object (or updates it) with the value "Mumbai".
4.2 Update Property
person.age = 26;
4.3 Delete Property
delete person.isStudent;
//removes the isStudent property from the person object.
5️. Object Methods
When a function is stored inside an object, it is called a method.
const person = {
name: "John",
greet: function() {
console.log("Hello!");
}
};
person.greet();
6️. Looping Through Objects
6.1 for...in Loop
const person = {
name: "John",
age: 25
};
for (let key in person) {
console.log(key + ": " + person[key]);
Prepared By: Kale J. N.
July 17, 2026 | Page 10 of 18](https://image.slidesharecdn.com/jspart2controlstructurearrayobjectdom-260717030813-ab43bc4e/85/Comprehensive-Guide-to-JavaScript-Control-Structures-Arrays-Objects-and-DOM-Manipulation-10-320.jpg)
![Prepared By: Kale J. N.
}
6.2 Object Methods
Object.keys()
console.log(Object.keys(person));
//prints an array of all property names (keys) of the person object.
Object.values()
console.log(Object.values(person));
//prints an array of all property values of the person object.
Object.entries()
console.log(Object.entries(person));
//prints an array of [key, value] pairs for each property in the person object.
7️. Nested Objects
Objects inside another object.
const student = {
name: "Amit",
marks: {
math: 90,
science: 85
}
};
console.log(student.marks.math);
8️. Object Destructuring (ES6)
Extract properties into variables.
const person = {
name: "John",
age: 25
};
const { name, age } = person;
console.log(name);
Prepared By: Kale J. N.
July 17, 2026 | Page 11 of 18](https://image.slidesharecdn.com/jspart2controlstructurearrayobjectdom-260717030813-ab43bc4e/85/Comprehensive-Guide-to-JavaScript-Control-Structures-Arrays-Objects-and-DOM-Manipulation-11-320.jpg)
Skip to main content
JK
Uploaded byJaydeep Kale
230 views
Comprehensive Guide to JavaScript Control Structures, Arrays, Objects, and DOM Manipulation
Master the core building blocks of JavaScript in one comprehensive guide! This deck covers everything from decision-making (if/else, switch) and loops (for, while, for...of) to powerful array methods (map, filter, reduce), object fundamentals, and hands-on DOM manipulation — including element selection, event handling, and dynamic content updates. Packed with clear code examples, perfect for beginners and anyone looking to strengthen their JavaScript fundamentals.
