Menu
4.2 āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻ:
localStorage
 āĻšāϞ āĻāϝāĻŧā§āĻŦ āϏā§āĻā§āϰā§āĻ āĻ
āĻŦāĻā§āĻā§āĻ āϝāĻž āĻŦā§āϰāĻžāĻāĻāĻžāϰ⧠āĻā§/āĻŽāĻžāύ āĻā§āĻĄāĻŧāĻž āϏāĻāϰāĻā§āώāĻŖ āĻāϰāĻžāϰ āĻ
āύā§āĻŽāϤāĻŋ āĻĻā§āϝāĻŧāĨ¤ āϤāĻžāĻĻā§āϰ āϏāĻŽā§āĻĒāϰā§āĻā§ āϝāĻž āĻŽāĻāĻžāϰ āϤāĻž āĻšāϞ āϝ⧠āĻĄā§āĻāĻž āĻāĻāĻāĻŋ āĻĒā§āĻāĻ āϰāĻŋāĻĢā§āϰā§āĻļ āĻāĻŦāĻ āĻāĻŽāύāĻāĻŋ āĻāĻāĻāĻŋ āϏāĻŽā§āĻĒā§āϰā§āĻŖ āĻŦā§āϰāĻžāĻāĻāĻžāϰ āϰāĻŋāϏā§āĻāĻžāϰā§āĻ āĻāϰ āĻĒāϰāĻ āĻāĻŋāĻā§ āĻĨāĻžāĻā§āĨ¤ āĻāĻŽāϰāĻž āĻā§āĻŦ āĻļā§āĻā§āϰāĻ āĻ āĻŦāĻŋāώā§ā§ āĻŦāĻŋāϏā§āϤāĻžāϰāĻŋāϤ āĻĻā§āĻāϤ⧠āĻĒāĻžāĻŦāĨ¤
āĻāĻŽāĻžāĻĻā§āϰ āĻŽāύ⧠āĻĒā§āϰāĻļā§āύ āĻāϏāϤ⧠āĻĒāĻžāϰ⧠āĻĄāĻžāĻāĻž āϰāĻžāĻāĻžāϰ āĻāύā§āϝ āϤ⧠āĻāϤāĻŋāĻŽāϧā§āϝ⧠āĻā§āĻāĻŋāĻ āĻāĻā§. āϤāĻžāĻšāϞ⧠āĻāĻŦāĻžāϰ āĻāĻ localStorage āĻŦāĻžÂ sessionStorage āĻāϰ āĻĻāϰāĻāĻžāϰ āĻāĻŋ?
- āĻāϝāĻŧā§āĻŦ āϏā§āĻā§āϰā§āĻ āĻ āĻŦāĻā§āĻā§āĻāĻā§āϞ⧠āĻĒā§āϰāϤāĻŋāĻāĻŋ āĻ āύā§āϰā§āϧā§āϰ āϏāĻžāĻĨā§ āϏāĻžāϰā§āĻāĻžāϰ⧠āĻĒāĻžāĻ āĻžāύ⧠āĻšāϝāĻŧ āύāĻžāĨ¤ āϝ⧠āĻāĻžāϰāĻŖā§, āĻāĻŽāϰāĻž āĻāϰ⧠āĻ āύā§āĻ āĻĄāĻžāĻāĻž āϏāĻāϰāĻā§āώāĻŖ āĻāϰāϤ⧠āĻĒāĻžāϰāĻŋ. āĻŦā§āĻļāĻŋāϰāĻāĻžāĻ āĻŦā§āϰāĻžāĻāĻāĻžāϰ āĻāĻŽāĻĒāĻā§āώ⧠2 āĻŽā§āĻāĻžāĻŦāĻžāĻāĻ āĻĄā§āĻāĻž (āĻŦāĻž āϤāĻžāϰ āĻŦā§āĻļāĻŋ) āĻ āύā§āĻŽāϤāĻŋ āĻĻā§āϝāĻŧ āĻāĻŦāĻ āϏā§āĻāĻŋ āĻāύāĻĢāĻŋāĻāĻžāϰ āĻāϰāĻžāϰ āĻāύā§āϝ āϏā§āĻāĻŋāĻāϏ āĻĨāĻžāĻā§āĨ¤
- āϏāĻžāϰā§āĻāĻžāϰ HTTP āĻšā§āĻĄāĻžāϰā§āϰ āĻŽāĻžāϧā§āϝāĻŽā§ āϏā§āĻā§āϰā§āĻ āĻ āĻŦāĻā§āĻā§āĻāĻā§āϞāĻŋāĻā§ āĻŽā§āϝāĻžāύāĻŋāĻĒā§āϞā§āĻ āĻāϰāϤ⧠āĻĒāĻžāϰ⧠āύāĻžāĨ¤ āĻāĻžāĻāĻžāϏā§āĻā§āϰāĻŋāĻĒā§āĻā§āĻ āϏāĻŦāĻāĻŋāĻā§ āĻāϰāĻž āĻšāϝāĻŧā§ āĻĨāĻžāĻā§āĨ¤
setItem(key, value)
 â āϏā§āĻā§āϰ āĻā§/āĻā§āϝāĻžāϞ⧠āĻā§āĻĄāĻŧāĻžāĨ¤getItem(key)
 â āĻā§ āĻĻā§āĻŦāĻžāϰāĻž āĻŽāĻžāύ āĻĒāĻžāĻā§āĻžāĨ¤removeItem(key)
 â āĻā§āϝāĻžāϞ⧠āĻĻā§āĻŦāĻžāϰāĻž āĻā§ āϰāĻŋāĻŽā§āĻ āĻāϰāĻžāĨ¤clear()
 â āϏāĻŦāĻāĻŋāĻā§ āĻŽā§āĻā§ āĻĢā§āϞāĻžāĨ¤key(index)
 â āĻāĻāĻāĻŋ āύāĻŋāĻĻāĻŋāώā§āĻ āĻ āĻŦāϏā§āĻĨāĻžāύā§āϰ āĻā§ āĻĒāĻžāĻā§āĻžāĨ¤length
 â āϏāĻā§āĻāĻŋāϤ āĻāĻāĻā§āĻŽ āϏāϰā§āĻŦāĻŽā§āĻ āϏāĻāĻā§āϝāĻžāĨ¤
localStorage
 āĻĄā§āĻŽā§:
āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻā§āϰ āĻĄāĻžāĻāĻžāĻā§āϞ⧠āĻŦā§āϰāĻžāĻāĻāĻžāϰā§āϰ āĻŦāĻŋāĻāĻŋāύā§āύ āĻā§āϝāĻžāĻŦ āĻāϰ āĻāĻāύā§āĻĄā§āϰ āĻŽāϧā§āϝ⧠āĻļā§ā§āĻžāϰ āĻšā§āĨ¤ āĻāĻāĻŋ āĻŦā§āϰāĻžāĻāĻāĻžāϰ āϰāĻŋāϏā§āĻāĻžāϰā§āĻ āĻāĻŦāĻ āĻāĻŽāύāĻāĻŋ OS āϰāĻŋāĻŦā§āĻ āĻšāĻāϝāĻŧāĻžāϰ āĻĒāϰā§āĻ āĻĄāĻžāĻāĻžāϰ āĻŽā§ā§āĻžāĻĻ āĻļā§āώ āĻšā§ āύāĻžāĨ¤ āĻāĻĻāĻžāĻšāϰāĻŖāϏā§āĻŦāϰā§āĻĒ, āύāĻŋāĻā§āϰ āĻā§āĻĄāĻāĻŋ āĻāĻžāϞāĻžāύāĨ¤
localStorage.setItem(‘test’, 1);
alert( localStorage.getItem(‘test’) );
āĻ āĻŦāĻā§āĻā§āĻā§āϰ āĻŽāϤ⧠āĻ ā§āϝāĻžāĻā§āϏā§āϏāĻ
āĻāĻŽāϰāĻž āĻāĻžāĻāϞ⧠āĻ āĻŦāĻā§āĻā§āĻā§āϰ āĻŽāϤ⧠āĻāϰā§āĻ āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻā§ āĻĄāĻžāĻāĻž get/set āĻāϰāϤ⧠āĻĒāĻžāϰāĻŋāĨ¤ āĻāĻŽāύāĻāĻŋ āĻĄāĻžāĻāĻž āĻĄāĻŋāϞāĻŋāĻāĻ āĻāϰāϤ⧠āĻĒāĻžāϰāĻŋāĨ¤ āĻāϞā§āύ āĻĻā§āĻāĻŋ āĻāĻŋāĻāĻžāĻŦā§ āĻāϰāĻŦāĨ¤// For setting key
localStorage.test = 2;
// For getting key
alert( localStorage.test ); // 2
// For removing key
delete localStorage.test;
āϞā§āĻĒā§āϰ āĻŽāĻžāϧā§āϝāĻŽā§ āĻā§ āĻ ā§āϝāĻžāĻā§āϏā§āϏāĻ
āĻāĻŽāϰāĻž āĻāϤāĻŋāĻŽāϧā§āϝ⧠āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻā§āϰ āĻĄāĻžāĻāĻž āĻāĻŋ āĻāϰā§Âset,get,delete
 āĻāϰāĻž āϝāĻžā§ āϤāĻž āĻĻā§āĻāϞāĻžāĻŽāĨ¤ āĻāĻāύ āĻŽāύ⧠āĻĒā§āϰāĻļā§āύ āĻāϏāϤ⧠āĻĒāĻžāϰā§, āĻāĻŋ āĻāϰ⧠āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻā§āϰ āϏāĻŦāĻā§āϞ⧠āĻā§/āĻā§āϝāĻžāϞ⧠āĻā§āĻĄāĻŧāĻž āĻ
ā§āϝāĻžāĻā§āϏā§āϏ āĻāϰāĻž āϝāĻžā§?
āĻĻā§āϰā§āĻāĻžāĻā§āϝāĻŦāĻļāϤ, āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻā§āϰ āĻ
āĻŦāĻā§āĻā§āĻ Iterable
 āύā§āĨ¤ āϤāĻŦā§ āĻāĻāĻāĻŋ āĻāĻĒāĻžāϝāĻŧ āĻšāϞ āĻ
ā§āϝāĻžāϰā§āϰ āĻāĻĒāϰ āϤāĻžāĻĻā§āϰ āϞā§āĻĒ āĻāϰāĻžāĨ¤
for(let i=0; i<localStorage.length; i++) {
let key = localStorage.key(i);
alert(`${key}: ${localStorage.getItem(key)}`);
}
for key in localStorage
āϞā§āĻĒ āĻŦā§āϝāĻŦāĻšāĻžāϰ āĻāϰāĻž, āĻ āĻŋāĻ āϝā§āĻŽāύ āĻāĻŽāϰāĻž āύāĻŋāϝāĻŧāĻŽāĻŋāϤ āĻ
āĻŦāĻā§āĻā§āĻā§āϰ āϏāĻžāĻĨā§ āĻāϰ⧠āĻĨāĻžāĻāĻŋāĨ¤
for(let key in localStorage) {
if (!localStorage.hasOwnProperty(key)) {
continue;
}
alert(`${key}: ${localStorage.getItem(key)}`);
}
āĻļā§āϧā§āĻŽāĻžāϤā§āϰ āϏā§āĻā§āϰāĻŋāĻāĻ
āĻŽāύ⧠āϰāĻžāĻāĻŦā§āύ, āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻā§āϰ  āĻā§ āĻāĻŦāĻ āĻā§āϝāĻžāϞ⧠āĻāĻāϝāĻŧāĻ āϏā§āĻā§āϰāĻŋāĻ āĻšāϤ⧠āĻšāĻŦā§āĨ¤ āϝāĻĻāĻŋ āĻ āύā§āϝ āĻā§āύ āĻĒā§āϰāĻāĻžāϰ āĻšāϝāĻŧ, āϝā§āĻŽāύ āĻāĻāĻāĻŋ āϏāĻāĻā§āϝāĻž, āĻŦāĻž āĻāĻāĻāĻŋ āĻŦāϏā§āϤā§, āĻāĻāĻŋ āϏā§āĻŦāϝāĻŧāĻāĻā§āϰāĻŋāϝāĻŧāĻāĻžāĻŦā§ āϏā§āĻā§āϰāĻŋāĻ āĻ āϰā§āĻĒāĻžāύā§āϤāϰāĻŋāϤ āĻšāϝāĻŧāĨ¤localStorage.user = {name: “Rajib”};
alert(localStorage.user);
JSON
 āĻ
āĻŦāĻā§āĻā§āĻ āϏāĻāϰāĻā§āώāĻŖ āĻāϰā§āĻ āĻāĻāĻŋāĻā§ āĻŦā§āϝāĻŦāĻšāĻžāϰ āĻāϰāϤ⧠āĻĒāĻžāϰāĻŋāĨ¤
localStorage.user = JSON.stringify({name: “Rajib”});
let user = JSON.parse( localStorage.user );
alert( user.name );
alert( JSON.stringify(localStorage, null, 2) );
- āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻ āĻ āĻāĻāĻā§āĻŽ āϏā§āĻ āĻāϰāĻž, āĻā§āĻā§ āĻŦā§āϰ āĻāϰāĻž, āĻĄāĻŋāϞāĻŋāĻ āĻāϰāĻž āĻāĻŦāĻ āϏā§āĻā§āϰ āĻĨā§āĻā§ āϏāĻŦ āĻāĻāĻā§āĻŽ āĻā§āϞāĻŋā§āĻžāϰ āĻāϰāĻžāĨ¤
//setting a item on local storagelocalStorage.setItem(“lastname”, “Doe”);localStorage.setItem(“firstname”, “John”);localStorage.setItem(“age”, “34”);//getting a item from local storageconst age = localStorage.getItem(‘age’);//removing a itemlocalStorage.removeItem(“lastname”);//removing everything from Local StoragelocalStorage.clear();
- āĻāĻāĻāĻŋ āĻŦāĻžāĻāύ⧠āĻāϤāĻŦāĻžāϰ āĻā§āϞāĻŋāĻ āĻšāϞ āĻāĻŖāύāĻž āĻāϰāĻžāĻ
Function showTotalClicks() {
if(typeof(Storage) !== “undefined”) {
if (localStorage.totalClick) {
localStorage.totalClick = Number(localStorage.totalClick)+1;
} else {
localStorage.totalClick = 1;
}
document.getElementById(“result”).innerHTML = “You have clicked the button “ + localStorage.totalClick + ” time(s).”;
}
}
- localstorage āĻāϰ āϏāĻŦ āĻāĻāĻā§āĻŽ āĻĒā§āϰāĻŋāύā§āĻāĻ
for (var i = 0; i < localStorage.length; i++){
let val = localStorage.getItem(localStorage.key(i));
console.log(val);
}
- āĻā§āĻāĻŋ āĻāĻāĻ āύāĻž āĻāϰ⧠āĻā§āύ āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻ āĻŦā§āϝāĻŦāĻšāĻžāϰ āĻāϰāĻŦ?
- āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻ āĻāϰ āĻŽā§āĻŽāϰāĻŋ āϏā§āĻĒā§āϏ āĻāϤ?
- āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻ āĻ āĻā§āύ âāĻāĻŋâ āĻāϰ āĻŦāĻŋāĻĒāϰā§āϤā§āϰ āĻā§āϝāĻžāϞ⧠āĻāĻŋāĻāĻžāĻŦā§ āĻā§āĻā§ āĻĒāĻžāĻŦā§?
- āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻ āĻāϰ āϏāĻŦ āĻā§āϞ⧠āĻāĻŋ-āĻā§āϝāĻžāϞ⧠āĻĒā§āϰāĻŋāύā§āĻ āĻāϰāĨ¤
- āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻ āĻā§āύ āĻā§āύ āĻā§āώā§āϤā§āϰ⧠āĻŦā§āϝāĻŦāĻšāĻžāϰ āĻāϰāĻž āϝā§āϤ⧠āĻĒāĻžāϰā§?
- āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻ āĻāϰ āĻā§āϝāĻžāϞ⧠āĻāĻŋ āĻāĻāĻžāϰā§āĻŦāϞ?
- āϞā§āĻāĻžāϞ āϏā§āĻā§āϰā§āĻ āĻāϰ āĻā§āϝāĻžāϞāĻŋāĻĄāĻŋāĻāĻŋ āĻāϤāĻā§āώāĻŖ āĻĨāĻžāĻā§?