Storage : Object

Storage allows saving data in the web browser that can be retrieved in future views of the web page. The browser has two types of storage: localStorage which stores data across page views, browser restarts and computer restarts, and sessionStorage which only stores data across page views. sessionStorage is deleted when the user closes the browser.

Instance Indexers

this[key : String] : String

Gets or sets the data for key in the Storage. Only Strings may be saved in Storage. You can also use getItem() to retrieve the value and setItem() to set the value. For keys that are valid JavaScript property names, you can access the value by using the storage.key syntax.

Example:

<script>
  if (!sessionStorage.createdExamples) {
    // Set a few values
    sessionStorage.simpleKey = 'foo';
    sessionStorage['complex key!'] = 'bar';
    sessionStorage.createdExamples = 'true';

    console.log('Added examples to sessionStorage');
  }
  else {
    console.log('Using existing examples in sessionStorage');
  }

  for (var i = 0; i < sessionStorage.length; i++) {
    var key = sessionStorage.key(i);
    console.log('"' + key + '" = "' + sessionStorage[key] + '"');
  }
</script>

Run

Results:

Instance Properties

length : Number readonly

Returns the number of items saved in the Storage.

Example:

<script>
  if (!sessionStorage.createdExamples) {
    // Set a few values
    sessionStorage.simpleKey = 'foo';
    sessionStorage['complex key!'] = 'bar';
    sessionStorage.createdExamples = 'true';

    console.log('Added examples to sessionStorage');
  }
  else {
    console.log('Using existing examples in sessionStorage');
  }

  console.log(sessionStorage.length + ' items in storage');
  for (var i = 0; i < sessionStorage.length; i++) {
    var key = sessionStorage.key(i);
    console.log('"' + key + '" = "' + sessionStorage[key] + '"');
  }
</script>

Run

Results:

Instance Methods

clear() : undefined

Removes all items from the storage. See also removeItem().

Example:

<button onclick='clearStorage()'>Clear Storage</button>
<script>
  if (!sessionStorage.createdExamples) {
    // Set a few values
    sessionStorage.simpleKey = 'foo';
    sessionStorage['complex key!'] = 'bar';
    sessionStorage.createdExamples = 'true';

    console.log('Added examples to sessionStorage');
  }
  else {
    console.log('Using existing examples in sessionStorage');
  }

  var printStorage = function() {
    console.log(sessionStorage.length + ' items in storage');
    for (var i = 0; i < sessionStorage.length; i++) {
      var key = sessionStorage.key(i);
      console.log('  "' + key + '" = "' + sessionStorage[key] + '"');
    }
  };

  var clearStorage = function() {
    sessionStorage.clear();

    printStorage();
  };
</script>

Run

Results:

getItem(key : String) : String

Gets the data for key in the Storage. You may also use this[key] to retrieve the value. For keys that are valid JavaScript property names, you can access the value by using the storage.key syntax.

Example:

<script>
  if (!sessionStorage.createdExamples) {
    // Set a few values
    sessionStorage.simpleKey = 'foo';
    sessionStorage['complex key!'] = 'bar';
    sessionStorage.createdExamples = 'true';

    console.log('Added examples to sessionStorage');
  }
  else {
    console.log('Using existing examples in sessionStorage');
  }

  for (var i = 0; i < sessionStorage.length; i++) {
    var key = sessionStorage.key(i);
    console.log('"' + key + '" = "' + sessionStorage.getItem(key) + '"');
  }
</script>

Run

Results:

key(index : Number) : String

Returns the key for the item at index in this. Use this[key] or this.getItem(key) to retrieve the value for the returned key.

Example:

<script>
  if (!sessionStorage.createdExamples) {
    // Set a few values
    sessionStorage.simpleKey = 'foo';
    sessionStorage['complex key!'] = 'bar';
    sessionStorage.createdExamples = 'true';

    console.log('Added examples to sessionStorage');
  }
  else {
    console.log('Using existing examples in sessionStorage');
  }

  for (var i = 0; i < sessionStorage.length; i++) {
    var key = sessionStorage.key(i);
    console.log('"' + key + '" = "' + sessionStorage[key] + '"');
  }
</script>

Run

Results:

removeItem(key : String) : undefined

Removes the item with the specified key from the storage. You may also use the delete storage[key] syntax or delete storage.key syntax to remove the item. See also clear().

Example:

<button onclick='removeItems()'>Remove Items</button>
<script>
  if (!sessionStorage.createdExamples) {
    // Set a few values
    sessionStorage.simpleKey = 'foo';
    sessionStorage['complex key!'] = 'bar';
    sessionStorage.createdExamples = 'true';

    console.log('Added examples to sessionStorage');
  }
  else {
    console.log('Using existing examples in sessionStorage');
  }

  var printStorage = function() {
    console.log(sessionStorage.length + ' items in storage');
    for (var i = 0; i < sessionStorage.length; i++) {
      var key = sessionStorage.key(i);
      console.log('  "' + key + '" = "' + sessionStorage[key] + '"');
    }
  };

  var removeItems = function() {
    // The following are all equivalent ways of deleting a key
    delete sessionStorage.simpleKey;
    sessionStorage.removeItem('complex key!');
    delete sessionStorage['createdExamples'];

    printStorage();
  };
</script>

Run

Results:

setItem(key : String, value : String) : undefined

Sets the data for key in the Storage. Only Strings may be saved in Storage. You can also use getItem() to retrieve the value and setItem() to set the value. For keys that are valid JavaScript property names, you can access the value by using the storage.key syntax.

Example:

<script>
  if (!sessionStorage.createdExamples) {
    // Set a few values
    sessionStorage.simpleKey = 'foo';
    sessionStorage['complex key!'] = 'bar';
    sessionStorage.createdExamples = 'true';

    console.log('Added examples to sessionStorage');
  }
  else {
    console.log('Using existing examples in sessionStorage');
  }

  for (var i = 0; i < sessionStorage.length; i++) {
    var key = sessionStorage.key(i);
    console.log('"' + key + '" = "' + sessionStorage[key] + '"');
  }
</script>

Run

Results:

home license contribute feedback toggle light/dark mode