{"id":7959,"date":"2021-08-14T13:13:49","date_gmt":"2021-08-14T13:13:49","guid":{"rendered":"https:\/\/www.scmgalaxy.com\/tutorials\/?p=7959"},"modified":"2022-04-13T16:30:44","modified_gmt":"2022-04-13T16:30:44","slug":"local-storage-and-session-storage-in-javascript","status":"publish","type":"post","link":"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/","title":{"rendered":"Local Storage And Session Storage in JavaScript"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\"><strong>Local Storage<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">The localStorage is a read-only property of the window objects. It stores data in a web browser specifically to the domain and protocol. It doesn\u2019t get sent to the server as it is stored locally in the web browser with no expiration date. The data will not be deleted when the browser is closed and reopened.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Syntax:- window.localStorage<\/strong><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Methods<\/strong><\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>setItem (key, value) \u2013 It allows to add a key\/value pair to the storage object. If the key already exists, the name value will overwrite the old value.<\/li><li>getItem(key) \u2013 It returns the value of the item that is set with the given key.<\/li><li>key(n) \u2013 It returns the key of the item in the storage object at the nth index which can be useful for looping.<\/li><li>removeItem(key) \u2013 It removes the item in the storage object with the given key.<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Session Storage<\/strong><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">The sessionStorage is a read-only property of the window object. It stores data in a web browser specifically to the domain and protocol for a particular session. It doesn\u2019t get sent to the server. Data stored in sessionStorage gets cleared when the page session ends. A page session lasts for as long as the browser is open and survives over page reloads and restores.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Syntax:- window.sessionStorage<\/strong><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Methods<\/strong><\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>setItem (key, value) \u2013 It allows to add a key\/value pair to the storage object. If the key already exists, the name value will overwrite the old value.<\/li><li>getItem(key) \u2013 It returns the value of the item that is set with the given key.<\/li><li>key(n) \u2013 It returns the key of the item in the storage object at the nth index which can be useful for looping.<\/li><li>removeItem(key) \u2013 It removes the item in the storage object with the given key.<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.scmgalaxy.com\/tutorials\/wp-content\/uploads\/2021\/08\/local-storage-and-session-storage-in-javascrip.png\" alt=\"\" class=\"wp-image-7964\" width=\"833\" height=\"474\" srcset=\"https:\/\/www.scmgalaxy.com\/tutorials\/wp-content\/uploads\/2021\/08\/local-storage-and-session-storage-in-javascrip.png 615w, https:\/\/www.scmgalaxy.com\/tutorials\/wp-content\/uploads\/2021\/08\/local-storage-and-session-storage-in-javascrip-300x171.png 300w\" sizes=\"auto, (max-width: 833px) 100vw, 833px\" \/><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>Local Storage The localStorage is a read-only property of the window objects. It stores data in a web browser specifically [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":7965,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_joinchat":[],"footnotes":""},"categories":[16],"tags":[5095,6323,5173,6324],"class_list":["post-7959","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript","tag-javascript","tag-local-storage","tag-methods","tag-session-storage"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Local Storage And Session Storage in JavaScript - scmGalaxy<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Local Storage And Session Storage in JavaScript - scmGalaxy\" \/>\n<meta property=\"og:description\" content=\"Local Storage The localStorage is a read-only property of the window objects. It stores data in a web browser specifically [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/\" \/>\n<meta property=\"og:site_name\" content=\"scmGalaxy\" \/>\n<meta property=\"article:published_time\" content=\"2021-08-14T13:13:49+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-04-13T16:30:44+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.scmgalaxy.com\/tutorials\/wp-content\/uploads\/2021\/08\/local-storage-and-session-storage.png\" \/>\n\t<meta property=\"og:image:width\" content=\"615\" \/>\n\t<meta property=\"og:image:height\" content=\"350\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"rajeshkumar\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"rajeshkumar\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/local-storage-and-session-storage-in-javascript\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/local-storage-and-session-storage-in-javascript\\\/\"},\"author\":{\"name\":\"rajeshkumar\",\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/#\\\/schema\\\/person\\\/a40e0dd38feee7c2779460a804d49361\"},\"headline\":\"Local Storage And Session Storage in JavaScript\",\"datePublished\":\"2021-08-14T13:13:49+00:00\",\"dateModified\":\"2022-04-13T16:30:44+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/local-storage-and-session-storage-in-javascript\\\/\"},\"wordCount\":305,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/local-storage-and-session-storage-in-javascript\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/local-storage-and-session-storage.png\",\"keywords\":[\"Javascript\",\"Local Storage\",\"methods\",\"Session Storage\"],\"articleSection\":[\"JavaScript\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/local-storage-and-session-storage-in-javascript\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/local-storage-and-session-storage-in-javascript\\\/\",\"url\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/local-storage-and-session-storage-in-javascript\\\/\",\"name\":\"Local Storage And Session Storage in JavaScript - scmGalaxy\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/local-storage-and-session-storage-in-javascript\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/local-storage-and-session-storage-in-javascript\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/local-storage-and-session-storage.png\",\"datePublished\":\"2021-08-14T13:13:49+00:00\",\"dateModified\":\"2022-04-13T16:30:44+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/#\\\/schema\\\/person\\\/a40e0dd38feee7c2779460a804d49361\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/local-storage-and-session-storage-in-javascript\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/local-storage-and-session-storage-in-javascript\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/local-storage-and-session-storage-in-javascript\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/local-storage-and-session-storage.png\",\"contentUrl\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/local-storage-and-session-storage.png\",\"width\":615,\"height\":350},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/local-storage-and-session-storage-in-javascript\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Local Storage And Session Storage in JavaScript\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/#website\",\"url\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/\",\"name\":\"scmGalaxy\",\"description\":\"A Platform for Software Engineers\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/#\\\/schema\\\/person\\\/a40e0dd38feee7c2779460a804d49361\",\"name\":\"rajeshkumar\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/82337e1fc8642c7f36795aa0775af055a4f38882994004b593efd31758d4434e?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/82337e1fc8642c7f36795aa0775af055a4f38882994004b593efd31758d4434e?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/82337e1fc8642c7f36795aa0775af055a4f38882994004b593efd31758d4434e?s=96&d=mm&r=g\",\"caption\":\"rajeshkumar\"},\"url\":\"https:\\\/\\\/www.scmgalaxy.com\\\/tutorials\\\/author\\\/rajeshkumar\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Local Storage And Session Storage in JavaScript - scmGalaxy","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/","og_locale":"en_US","og_type":"article","og_title":"Local Storage And Session Storage in JavaScript - scmGalaxy","og_description":"Local Storage The localStorage is a read-only property of the window objects. It stores data in a web browser specifically [&hellip;]","og_url":"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/","og_site_name":"scmGalaxy","article_published_time":"2021-08-14T13:13:49+00:00","article_modified_time":"2022-04-13T16:30:44+00:00","og_image":[{"width":615,"height":350,"url":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-content\/uploads\/2021\/08\/local-storage-and-session-storage.png","type":"image\/png"}],"author":"rajeshkumar","twitter_card":"summary_large_image","twitter_misc":{"Written by":"rajeshkumar","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/#article","isPartOf":{"@id":"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/"},"author":{"name":"rajeshkumar","@id":"https:\/\/www.scmgalaxy.com\/tutorials\/#\/schema\/person\/a40e0dd38feee7c2779460a804d49361"},"headline":"Local Storage And Session Storage in JavaScript","datePublished":"2021-08-14T13:13:49+00:00","dateModified":"2022-04-13T16:30:44+00:00","mainEntityOfPage":{"@id":"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/"},"wordCount":305,"commentCount":0,"image":{"@id":"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/#primaryimage"},"thumbnailUrl":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-content\/uploads\/2021\/08\/local-storage-and-session-storage.png","keywords":["Javascript","Local Storage","methods","Session Storage"],"articleSection":["JavaScript"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/","url":"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/","name":"Local Storage And Session Storage in JavaScript - scmGalaxy","isPartOf":{"@id":"https:\/\/www.scmgalaxy.com\/tutorials\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/#primaryimage"},"image":{"@id":"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/#primaryimage"},"thumbnailUrl":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-content\/uploads\/2021\/08\/local-storage-and-session-storage.png","datePublished":"2021-08-14T13:13:49+00:00","dateModified":"2022-04-13T16:30:44+00:00","author":{"@id":"https:\/\/www.scmgalaxy.com\/tutorials\/#\/schema\/person\/a40e0dd38feee7c2779460a804d49361"},"breadcrumb":{"@id":"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/#primaryimage","url":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-content\/uploads\/2021\/08\/local-storage-and-session-storage.png","contentUrl":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-content\/uploads\/2021\/08\/local-storage-and-session-storage.png","width":615,"height":350},{"@type":"BreadcrumbList","@id":"https:\/\/www.scmgalaxy.com\/tutorials\/local-storage-and-session-storage-in-javascript\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.scmgalaxy.com\/tutorials\/"},{"@type":"ListItem","position":2,"name":"Local Storage And Session Storage in JavaScript"}]},{"@type":"WebSite","@id":"https:\/\/www.scmgalaxy.com\/tutorials\/#website","url":"https:\/\/www.scmgalaxy.com\/tutorials\/","name":"scmGalaxy","description":"A Platform for Software Engineers","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.scmgalaxy.com\/tutorials\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.scmgalaxy.com\/tutorials\/#\/schema\/person\/a40e0dd38feee7c2779460a804d49361","name":"rajeshkumar","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/82337e1fc8642c7f36795aa0775af055a4f38882994004b593efd31758d4434e?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/82337e1fc8642c7f36795aa0775af055a4f38882994004b593efd31758d4434e?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/82337e1fc8642c7f36795aa0775af055a4f38882994004b593efd31758d4434e?s=96&d=mm&r=g","caption":"rajeshkumar"},"url":"https:\/\/www.scmgalaxy.com\/tutorials\/author\/rajeshkumar\/"}]}},"_links":{"self":[{"href":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-json\/wp\/v2\/posts\/7959","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-json\/wp\/v2\/comments?post=7959"}],"version-history":[{"count":2,"href":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-json\/wp\/v2\/posts\/7959\/revisions"}],"predecessor-version":[{"id":7967,"href":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-json\/wp\/v2\/posts\/7959\/revisions\/7967"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-json\/wp\/v2\/media\/7965"}],"wp:attachment":[{"href":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-json\/wp\/v2\/media?parent=7959"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-json\/wp\/v2\/categories?post=7959"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.scmgalaxy.com\/tutorials\/wp-json\/wp\/v2\/tags?post=7959"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}