The IndexedDB Interfaces

IndexedDB is a client-side database system that provides a way to store and retrieve large amounts of structured data in a web browser. It offers several key interfaces that allow developers to interact with the database system, including the IDBDatabase, IDBObjectStore, IDBIndex, and IDBCursor interfaces.

The IDBDatabase interface

The IDBDatabase interface represents a database in an IndexedDB database system. It’s created when we open a database using the indexedDB.open() method and provides a way to interact with the database and its object stores. Some of the fundamental properties and methods of the IDBDatabase interface include the following:

Properties

  • name: A read-only property that returns the name of the database.
  • version: A read-only property that returns the version of the database.
  • objectStoreNames: A read-only property that returns a list of the object store names in the database.

Methods

  • transaction(): It creates a new transaction and returns a reference.
  • close(): It closes the database.
  • createObjectStore(): It creates a new object store in the database.
  • deleteObjectStore(): It deletes an object store from the database.

IDBObjectStore interface

The IDBObjectStore interface represents an object store in an IndexedDB database system. It provides a way to store and retrieve data in the form of key-value pairs, where the key is a unique identifier for the data, and the value is the data itself. Some of the key properties and methods of the IDBObjectStore interface include the following:

Properties

  • name: A read-only property that returns the object store’s name.
  • keyPath: A read-only property that returns the key path of the object store.
  • indexNames: A read-only property that returns a list of index names in the object store.

Methods

  • add(): It adds a new record to the object store.
  • get(): It retrieves a record from the object store based on its key.
  • put(): It updates a record in the object store.
  • delete(): It deletes a record from the object store based on its key.
  • clear(): It deletes all records from the object store.
  • createIndex(): It creates a new index in the object store.
  • deleteIndex(): It deletes an index from the object store.
  • openCursor(): It opens a cursor on the object store, allowing us to iterate over the records in the store.

Get hands-on with 1200+ tech skills courses.