0% found this document useful (0 votes)
3 views17 pages

JavaScript Complete Guide

The document is a comprehensive JavaScript study guide covering key concepts such as variables, data types, operators, loops, functions, arrays, objects, and more. It includes examples, syntax, and best practices for each topic, making it a useful resource for learners. Additionally, it discusses advanced topics like JSON, debugging, and the differences between various data structures in JavaScript.

Uploaded by

Maaz Hasnain
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
0% found this document useful (0 votes)
3 views17 pages

JavaScript Complete Guide

The document is a comprehensive JavaScript study guide covering key concepts such as variables, data types, operators, loops, functions, arrays, objects, and more. It includes examples, syntax, and best practices for each topic, making it a useful resource for learners. Additionally, it discusses advanced topics like JSON, debugging, and the differences between various data structures in JavaScript.

Uploaded by

Maaz Hasnain
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

JavaScript

Complete Study Guide


Variables • Data Types • Operators • Loops • Functions • Arrays • Objects • Strings • Dates
──────────────────────────────

Ye document do files se bana hai:


[Link] + JavaScript_Cheatsheet.docx

JavaScript Complete Study Guide | Page 1 of 17


1. Variables (var, let, const)

Variable ek container hai jisme data store hota hai. JavaScript mein teen keywords hain: var, let,
aur const.

Scope Comparison Table


Keyword Scope Redeclare? Reassign? Kab Use Karein?

var Global / Function Haan Haan Purana code (avoid karein)

let Block { } Nahi Haan Jab value change ho sakti ho

const Block { } Nahi Nahi Jab value fix ho (recommended)

Rules
• let aur const ko use se pehle declare karna zaruri hai
• Ek hi scope mein let/const dobara declare nahi ho sakta
• const use karo jab value change na ho — ye best practice hai
• var global scope mein hota hai, isliye bugs aa sakte hain

Example Code
let name = "Maaz"; // value badal sakti hai
const PI = 3.14; // value fix hai
var old = "avoid this"; // global scope, purana tarika

JavaScript Complete Study Guide | Page 2 of 17


2. Data Types

Data type batata hai value ka nature kya hai — text, number, ya kuch aur.

Primitive Types (Simple Values)


Data Type Example Description

String "Hello", 'World' Text data

Number 10, 3.14, -5 Integer ya decimal number

Boolean true, false Sirf do values — true ya false

Null null Intentionally empty value

Undefined let x; Variable declared lekin assigned nahi

Symbol Symbol('id') Unique identifier (advanced use)

BigInt 9007199254740991n Bahut bade integers ke liye

Reference Types (Complex Values)


Data Type Example Description

Object {name: "Maaz", age: 20} Key-value pairs

Array [1, 2, 3, 4] Ordered list of values

Function function add(a,b){} Reusable code block

Date new Date() Date aur time

RegExp /abc/ String pattern matching

Map new Map() Key-value pairs (any key type)

Set new Set([1,2,3]) Unique values ka collection

JavaScript Complete Study Guide | Page 3 of 17


3. Operators

Operator data ya values pe kaam karte hain — calculations ya comparisons ke liye.

Types of Operators
Type Symbols Use

Arithmetic + - * / % ** Math calculations karna

Assignment = += -= *= /= Variable mein value assign karna

Comparison == === != !== > < >= <= Values compare karna

Logical && || ! True/false logic

Ternary condition ? a : b Short if-else

Important: == vs ===
• == (loose equality): sirf value compare karta hai, type ignore karta hai
• === (strict equality): value aur type dono compare karta hai — ALWAYS use this!
5 == "5" // true (type ignore hua)
5 === "5" // false (types alag hain: number vs string)

Ternary Operator Example


let age = 20;
let result = age >= 18 ? "Adult" : "Minor";
// age 18+ hai? haan → "Adult", nahi → "Minor"

JavaScript Complete Study Guide | Page 4 of 17


4. Loops

Loops kaam ko repeatedly execute karte hain jab tak condition true hai.

Kaunsa Loop Kab Use Karein?


Situation Loop Use Karo

Exact number of iterations pata hai for

Pata nahi kitni baar chalega, condition par depend while

Kam se kam ek baar zarur chalana hai do...while

Object ke keys chahiye for...in

Array ya string ke values chahiye for...of

Array ke har element pe kaam karna forEach()

Loop Syntax Examples


// for loop — jab iterations pata hain
for(let i = 0; i < 5; i++) { [Link](i); }

// while loop — condition par depend


let i = 0;
while(i < 5) { [Link](i); i++; }

// for...of — array values ke liye


let arr = [10, 20, 30];
for(let val of arr) { [Link](val); }

// for...in — object keys ke liye


let obj = {name: "Maaz", age: 20};
for(let key in obj) { [Link](key, obj[key]); }

JavaScript Complete Study Guide | Page 5 of 17


5. Functions

Function reusable code block hai jo input leta hai aur output deta hai.

Function Types
Type Syntax Notes

Regular Function function add(a,b){ return a+b; } Hoisting hoti hai

Arrow Function const add = (a,b) => a+b; Short syntax, modern way

Anonymous Function const greet = function(){ }; Named reference se call

Example
// Regular function
function greet(name) {
return "Hello, " + name + "!";
}
[Link](greet("Maaz")); // Hello, Maaz!

// Arrow function (same kaam, short syntax)


const greet = (name) => "Hello, " + name + "!";

JavaScript Complete Study Guide | Page 6 of 17


6. String Methods

Strings = text ke liye methods. Ye methods original string nahi badlate, naya result return karte
hain.

Common String Methods


Method Kya Karta Hai Example Output

length Characters ki count "Hello".length 5

toUpperCase() Uppercase mein convert "hello".toUpperCase() "HELLO"

toLowerCase() Lowercase mein convert "WORLD".toLowerCase() "world"

trim() Spaces remove karta hai " hi ".trim() "hi"


(dono sides se)

includes() Check karta hai substring "JS".includes("J") true


hai ya nahi

indexOf() Pehli position dhundta hai "hello".indexOf("e") 1

startsWith() Kya string se shuru hota "hello".startsWith("he") true


hai?

endsWith() Kya string se khatam hota "hello".endsWith("lo") true


hai?

slice(s, e) String ka hissa nikalta hai "JavaScript".slice(0,4) "Java"

replace(a, b) Ek part replace karta hai "Hi "Hi JS"


World".replace("World","JS")

split(sep) String ko array mein todta "a,b,c".split(",") ["a","b","c"]


hai

repeat(n) String ko repeat karta hai "Hi ".repeat(3) "Hi Hi Hi "


charAt(i) Index pe character deta hai "hello".charAt(1) "e"

padStart(n, ch) Start se pad karta hai "5".padStart(3,"0") "005"

padEnd(n, ch) End se pad karta hai "5".padEnd(3,"0") "500"

JavaScript Complete Study Guide | Page 7 of 17


7. Arrays

Array ordered list hai values ki, index ke through access hoti hain. Index 0 se shuru hota hai.

Array Banao
let fruits = ["Apple", "Banana", "Mango"];
[Link](fruits[0]); // "Apple"
[Link]([Link]); // 3

Add / Remove Methods


Method Kya Karta Hai Example

push() End mein add karta hai [Link](4)

pop() End se remove karta hai [Link]()

unshift() Start mein add karta hai [Link](0)

shift() Start se remove karta hai [Link]()

splice(i,n) Middle se add/remove (original change [Link](1, 2)


hota hai)

slice(s,e) Part nikalta hai (original same rehta hai) [Link](1, 3)

Search Methods
Method Kya Return Karta Hai Example

indexOf() Pehli position (number ya -1) [Link](3)

lastIndexOf() Aakhri position (number ya - [Link](3)


1)

includes() Boolean (true/false) [Link](3)

find() Pehla matching element [Link](x => x > 10)

findIndex() Pehle match ki index [Link](x => x > 10)

filter() Saare matching elements [Link](x => x > 10)


(new array)

Iteration Methods
Method Kya Karta Hai Return

forEach() Har element pe function chalata hai undefined

JavaScript Complete Study Guide | Page 8 of 17


Method Kya Karta Hai Return

map() Har element transform karta hai New array

filter() Matching elements return karta hai New array

reduce() Array ko single value mein reduce karta hai Single value

some() Koi ek element condition pass kare? Boolean

every() Sab elements condition pass karein? Boolean

flat() Nested arrays ko flatten karta hai New array

flatMap() map + flat ek saath New array

sort() Array sort karta hai Same array (changed)

reverse() Array ulta karta hai Same array (changed)

JavaScript Complete Study Guide | Page 9 of 17


8. Objects

Object key-value pairs ka collection hai. Arrays mein number index hota hai, Objects mein string
key hoti hai.

Object Banao aur Use Karo


let user = { name: "Maaz", age: 20, city: "Lahore" };

// Access karo
[Link]([Link]); // "Maaz" — dot notation
[Link](user["age"]); // 20 — bracket notation

// Add karo
[Link] = "maaz@[Link]";

// Loop karo
for(let key in user) { [Link](key, ":", user[key]); }

Arrays vs Objects
Feature Array Object

Index Type Number (0, 1, 2...) String (key)

Use Karo Jab Ordered list chahiye Named data chahiye

Example [1, 2, 3] {name: "Maaz"}

Access arr[0] [Link] ya obj["name"]

JavaScript Complete Study Guide | Page 10 of 17


9. this Keyword

this reference karta hai current object ko jisme code execute ho raha hai.

let obj = {
name: "Maaz",
greet: function() {
[Link]("Hello, " + [Link]); // this = obj
}
};
[Link](); // Hello, Maaz

• Regular function mein: this = jo object ne function call kiya


• Arrow function mein: this = parent scope se inherit hoti hai

JavaScript Complete Study Guide | Page 11 of 17


10. Number Methods

Number object mein built-in methods hain jo numbers check aur convert karne ke liye use hote
hain.

Number Object Methods


Method Description

[Link]() True return karta hai agar integer ho

[Link]() True return karta hai agar NaN ho

[Link]() True return karta hai agar Infinity ya NaN nahi ho

[Link]() True return karta hai agar safe integer ho

[Link]() String ko decimal number mein convert karta hai

[Link]() String ko whole number mein convert karta hai

Math Methods
Method Description Example Output

[Link]() Neeche round karta hai [Link](4.7) 4

[Link]() Upar round karta hai [Link](4.1) 5

[Link]() Nearest integer [Link](4.5) 5

[Link]() 0 se 1 ke beech random [Link]() [Link]


number

[Link]() Sabse bada number [Link](1,2,3) 3

[Link]() Sabse chota number [Link](1,2,3) 1

[Link]() Positive value deta hai [Link](-5) 5

[Link]() Power calculate karta hai [Link](2,3) 8

[Link]() Square root nikalta hai [Link](16) 4

JavaScript Complete Study Guide | Page 12 of 17


11. Date Methods

Date object se time aur date handle karte hain JavaScript mein.

let d = new Date(); // current date aur time

Date Get Methods


Method Description Range

getFullYear() Saal 4 digits mein e.g. 2025

getMonth() Mahina (0-based) 0 (Jan) - 11 (Dec)


getDate() Din number 1 - 31

getDay() Weekday number 0 (Sun) - 6 (Sat)

getHours() Ghante 0 - 23

getMinutes() Minute 0 - 59

getSeconds() Second 0 - 59

getMilliseconds() Millisecond 0 - 999

getTime() 1970 se milliseconds mein time Large number

Date Set Methods


Method Description

setFullYear(y) Saal set karo


setMonth(m) Mahina set karo (0-11)

setDate(d) Din set karo (1-31)

setHours(h) Ghante set karo (0-23)

setMinutes(m) Minute set karo (0-59)

setSeconds(s) Second set karo (0-59)

setTime(ms) 1970 se ms mein time set karo

JavaScript Complete Study Guide | Page 13 of 17


12. Sets aur Maps

Set = unique values store karta hai. Map = key-value pairs, koi bhi key type ho sakti hai.

Set
let s = new Set([1, 2, 2, 3]); // duplicates automatically remove
[Link](4); // 4 add karo
[Link](2); // true — 2 hai ya nahi?
[Link](1); // 1 remove karo
[Link]; // kitne unique elements hain

Map
let m = new Map();
[Link]("name", "Maaz"); // key-value add karo
[Link]("name"); // "Maaz" — value get karo
[Link]("name"); // true
[Link]("name"); // key remove karo
[Link]; // kitne entries hain

Set vs Map vs Object vs Array


Feature Array Object Set Map

Data Store Ordered values Key-value (string Unique values Key-value (any
key) key)

Duplicates Allowed Same key override Not allowed Same key


override

Order Maintained Not guaranteed Maintained Maintained

Use Karo Jab Ordered list Named properties Unique values Flexible keys
chahiye chahiye

JavaScript Complete Study Guide | Page 14 of 17


13. JSON

JSON (JavaScript Object Notation) — data ko string mein convert karke server ya file mein
store/transfer karne ke liye.

let obj = { name: "Maaz", age: 20 };

// Object → String (server ko bhejne ke liye)


let jsonStr = [Link](obj);
// Result: '{"name":"Maaz","age":20}'

// String → Object (server se aane ke baad)


let newObj = [Link](jsonStr);
[Link]([Link]); // "Maaz"

• [Link]() — Object/Array ko JSON string mein convert karta hai


• [Link]() — JSON string ko Object/Array mein convert karta hai
• JSON mein functions nahi ho sakte, sirf data types

JavaScript Complete Study Guide | Page 15 of 17


14. Debugging

Debugging tools help karte hain errors find karne aur code test karne mein. Browser DevTools
mein F12 press karo.

Method Use Example

[Link]() Value print karo — sabse common [Link](x)

[Link]() Error message print karo (red) [Link]("Error!")

[Link]() Warning print karo (yellow) [Link]("Warning!")

[Link]() Array/Object ko table mein dikhao [Link](arr)

debugger; Code ko us point pe rok do debugger;

typeof x Variable ka type check karo typeof "hello" // string

JavaScript Complete Study Guide | Page 16 of 17


15. Quick Reference — Yaad Rakhne Wali Cheezein

Variable Rules
• const prefer karo — sirf tab let use karo jab value change hogi
• var bilkul mat use karo modern code mein
• let aur const block scope mein hain

Common Mistakes se Bacho


• = (assignment) aur == (comparison) ko confuse mat karo
• === strict equality use karo, == nahi
• Array index 0 se shuru hota hai, 1 se nahi
• getMonth() 0-based hai: January = 0, December = 11
• forEach, map, filter — original array nahi badhte (forEach ke alawa)

Best Practices
• Meaningful variable names rakho: x mat likho, userName likho
• Functions ek kaam kare — ek kaam, ek function
• [Link]() se debugging karo
• Code ko comments se explain karo
• const se start karo, zarurat ho to let pe jao

Ye document dono files ([Link] aur JavaScript_Cheatsheet.docx) ka combined,


organized version hai. Sab topics ek jagah hain — variables se lekar debugging tak!

JavaScript Complete Study Guide | Page 17 of 17

You might also like