Get data from IndexedDB
Tags: javascript, webdev, programming, 100daysofcode
Published: 2022-01-04 18:05:12

There are several ways to get the stored data, each of them will be explained below:

## Individual data
To get a single specific object, the `get(key)` method is used, to which the `key` of the object to be obtained is passed as a parameter.
The requested data is returned as a result of the request.

> 💡 This method returns `undefined` as a result if the stored object has an `undefined` value or the object doens't exist.

```jsx
function getStudent(key){
    const request = db.transaction('students')
                   .objectStore('students')
                   .get(key);

    request.onsuccess = ()=> {
        const student = request.result;

        return student;
    }

    request.onerror = (err)=> {
        console.error(`Error to get student information: ${err}`)
    }
}

getStudent('andres@andres.com');
```

## Multiple data
To get all the data from an _Object Store_ there are two possible ways:


### `getAll()`
If you want to get an array with all the data inside an _Object Store_, the `getAll()` method is used, for this use case this method has a better performance than using a cursor to go through each of the stored data, since the cursor will create an object for each stored data as the _Object Store_ iterates. Otherwise, `getAll()` creates all the objects at the same time and returns the array.

```jsx
function getAllStudents(){
    const request = db.transaction('students')
                   .objectStore('students')
                   .getAll();

    request.onsuccess = ()=> {
        const students = request.result;

        console.log('Got all the students');
        console.table(students)

        return students;
    }

    request.onerror = (err)=> {
        console.error(`Error to get all students: ${err}`)
    }
}

getAllStudents();
```

### `cursor`
If you want to work with all the data stored in an `Object Store` independently, it is a good idea to use a cursor, which is a mechanism to iterate over multiple records based on their key.

To use a `cursor`, it must first be created with the `openCursor()` method of the **objectStore** object, once the request is made, the success event is handled where the result of the request is the `cursor`, within this result we can access the stored data or only its `key`. When there is no more data or a search result was not obtained, the cursor has the value of undefined. Finally, to move to the next stored data, we use the cursor's `continue()` method.

I find two use cases for the cursor:

- When you want to work with each object of an _Object Store_ as it is gotten.
- When you want to work with the keys of each stored object, since using a cursor is more efficient than the `getAll()` method for this specific case.

For the example, suppose you have a method that prints the properties of each stored object called `printInfo(obj)`:

```jsx
function printStudents(){
    const request = db.transaction('students')
                      .objectStore('students')
                      .openCursor();

    request.onsuccess = ()=> {
        const cursor = request.result;

        if(cursor){
            printInfo(cursor.value);
            cursor.continue();
        }else{
            console.log('No more entries')
        }

    }
}

printStudents();
```