Blog

Local Storage, Session Storage & Cookies Kya Hote Hai – Local Storage, Session Storage & Cookies In JavaScript

Local Storage Kya Hota Hai?

Local Storage ek Web Storage API ka hissa hai jo JavaScript me use hota hai browser ke andar data ko permanently store karne ke liye. Iska matlab hai ki jab tak user manually data delete na kare, tab tak wo data browser me safe rehta hai, chahe browser close ho jaye ya computer restart ho jaye. Local Storage me data key-value pair ke form me store hota hai, aur ye sirf string format me data ko accept karta hai. Iska use karne ke liye localStorage.setItem(), localStorage.getItem(), localStorage.removeItem(), aur localStorage.clear() jaise methods use kiye jaate hain. Ye storage har domain ke liye alag hoti hai aur iska size limit approx 5MB hota hai. Ye mostly lightweight data jaise user preferences, form data, ya theme settings ko store karne ke liye kaam aati hai.

Local Storage Features:

  • Browser ke andar user ki machine (computer/mobile) mein data save karta hai.
  • Data kabhi expire nahi hota jab tak manually delete na karein.
  • Har domain ka apna local storage hota hai.
  • Maximum limit: Around 5–10 MB.
  • Sirf same-origin scripts hi access kar sakti hain.

Use Cases:

  • Dark mode ON/OFF settings
  • Cart items store karna
  • Language preferences ya filters

Example:

// Data store karna
localStorage.setItem("username", "Sandeep");

// Data read karna
let name = localStorage.getItem("username");

// Data delete karna
localStorage.removeItem("username");

// Sab kuch clear karna
localStorage.clear();

Session Storage Kya Hota Hai?

Session Storage JavaScript ka ek web storage feature hai jo browser ke andar temporary data store karta hai. Iska use tab hota hai jab hume kisi particular session (yaani tab ya window) ke liye data save karna ho. Jab tak user tab ya browser window close nahi karta, tab tak data available rehta hai. Jaise hi tab close hota hai, session storage ka data automatically delete ho jata hai. Isme stored data sirf usi tab ke liye accessible hota hai jisme use set kiya gaya tha. Session Storage key-value pairs mein data store karta hai, aur string format mein save hota hai. Iska syntax simple hota hai, jaise: sessionStorage.setItem(“key”, “value”). Ye localStorage se isliye alag hai kyunki localStorage ka data browser close hone ke baad bhi bana rehta hai, jabki sessionStorage ka nahi.

Session Storage Features:

  • Ek particular tab ke session ke liye data store karta hai.
  • Tab close karte hi data delete ho jata hai.
  • Har tab ka apna alag session storage hota hai.
  • Secure aur fast hota hai.
  • Limit: Around 5 MB

Use Cases:

  • Form fill data temporarily save karna
  • Temporary state track karna (page refresh tak)
  • Tab-specific cart ya settings

Example:

// Data store karna
sessionStorage.setItem("theme", "light");

// Data read karna
let theme = sessionStorage.getItem("theme");

// Data delete karna
sessionStorage.removeItem("theme");

// Sab clear karna
sessionStorage.clear();

Cookies Kya Hoti Hai?

Cookies ek chhoti si text file hoti hai jo browser ke through user ke computer ya device par store ki jaati hai. JavaScript ke madhyam se hum cookies ko create, read, aur delete kar sakte hain. Ye mainly user ki information ko temporarily ya permanently store karne ke liye use hoti hai, jaise ki login status, preferences, ya kisi shopping cart ka data. Cookies key-value pairs mein hoti hain, jahan “name” aur “value” assign kiya jata hai. JavaScript mein document.cookie property ka use karke hum cookies access karte hain. Cookies ka expiration time bhi set kiya ja sakta hai, taaki wo automatic delete ho jayein. Lekin cookies ka size limit hota hai (generally 4KB tak) aur security purpose ke liye sensitive information ko encrypted form mein hi store karna chahiye. Ye user experience ko personalize karne mein kaafi helpful hoti hain.

Cookies Features:

  • Server ya client dono cookies create kar sakte hain.
  • Small size (~4 KB).
  • Expiry date set ki ja sakti hai.
  • Automatically server ko send hoti hain via HTTP headers.

Use Cases:

  • Login credentials ya session ID
  • Tracking user activity
  • Remember me feature
  • Analytics tools

Example:

// Cookie set karna
document.cookie = "username=Sandeep; expires=Fri, 31 Dec 2025 12:00:00 UTC; path=/";

// Cookie read karna
console.log(document.cookie);

Comparison Table

Feature Local Storage Session Storage Cookies
Storage Time Permanently Tab close hone tak Expiry set ki ja sakti hai
Size Limit ~5–10 MB ~5 MB ~4 KB
Server ke saath data Nahin bheja jaata Nahin bheja jaata Haan, auto bheja jaata hai
Access Method JavaScript JavaScript JavaScript / HTTP
Use Case Preferences, Cart Temp data Authentication, tracking

Summary:

Local Storage, Session Storage aur Cookies teen tarah ke web storage options hain jo browser me data store karte hain.

  • Local Storage: Data tab tak rehta hai jab tak manually delete na ho. Ideal for user preferences, login info, etc.
  • Session Storage: Tab close hone par data delete ho jata hai. Ideal for temporary data.
  • Cookies: Server-client communication ke liye useful hoti hain. Size chhota hota hai, aur expiry set ki ja sakti hai.

Quiz: Test Your Knowledge on Local Storage, Session Storage & Cookies

Bonus: Practical Application!

Aaj hi apne JavaScript project mein Local Storage, Session Storage aur Cookies ka istemal karke dekhein!

Local Storage, Session Storage aur Cookies ko sahi tareeke se samajhne ke liye unke differences, lifetime, storage capacity, aur use-cases jaise login sessions, user preferences, ya form data saving ka upayog karein. Inka istemal karke apne web application ko aur bhi powerful aur user-friendly banayein.

Leave a Reply