IndexedDB

# IndexedDB [source : https://jsfiddle.net/softm/Lxfh1spc/](https://jsfiddle.net/softm/Lxfh1spc/ "softm.tistory.com")

※ 참고
    https://code.tutsplus.com/tutorials/working-with-indexeddb--net-34673
    https://horajjan.blog.me/220974929135

    https://deardiary11.blog.me/220204501837
    https://bitsofco.de/an-overview-of-client-side-storage/
    http://blog.naver.com/horajjan/220300960759
    https://www.w3.org/TR/IndexedDB/

1. IndexedDB 는 객체 데이터베이스이다.
2. IndexedDB API에서 데이터베이스는 해당 이름에 저장된 컬렉션이다.
3. 저장소 내에서 같은 키는 유일해야 한다.
4. 문자열 , 숫자, Date 객체를 유효한 키로 사용한다.
5. 기본 키 값을 사용하여 객체 저장소에서 객체를 가져올 수 있다.
6. 검색을 위해 객체의 다른 프로퍼티에 값을 설정할 수 있다.
6. 객체 저장소에 다수의 인덱스를 정의할 수 있으며,
   객체 저장소에 인덱스를 정의할 수 있기 때문에 'IndexedDB'라는 이름을 갖게 되었다.
7. 인덱스는 저장된 갯체를 위한 보조키를 정의한다.
8. 일반적으로 이 인덱스들은 유일하지 않고, 하나의 키 값에 여러 객체가 일치할 수 있다.
9. 인덱스를 통해 객체 저장소에 질의할 때는 보통 커서를 사용하게 된다.
10. IndexedDB는 원자성을 보장한다.
11. IndexedDB API는 메인 UI 스레드를 중단시키지 않기 위해서 비동기적 API이다.
12. IndexedDB 규격에는 워커 스레드에서 사용하기 위한 동기 버전의 API도 정의되어 있다.
13. 트랜잭션을 생성하고 객체 저장소와 인덱스를 생성하는 것은 동기화작업이다.
14. 데이터베이스를 연 다음 put()을 사용하여 객체 저장소를 업데이트하고 
                           get()또는 openCursor() 사용하여 저장소나, 인덱스에 질의하는 것은 모두 비동기 작업이다.

15. success 또는 error 이벤트에대한 onsuccess , onerror 핸들러를 프로퍼트로 정의되고,
    요청 객체의 result 프로퍼티로 접근할 수 있다.

16. 비동기 API의 편리한 점 하나는 트랜잭션 관리를 쉽게 만든다는 것이다.
17. IndexedDB는 최초의 onsuccess 이벤트 핸드러를 수행하여 생성되어 있는 트랜잭션을 종료하고,
    브라우저의 자체적인 이벶늩 루프로 복귀하며, 해당 트랜잭션에 걸려있는 모든 작업이 완료된 다음
    (해당 콜백 함수에서 새 작업을 시작하지 않는다면)에야 트랜잭션이 커밋된다.

18. serVersion()은 암묵적으로 데이터베이스 객체의 createObjectStore() 메서드와 
                                    객체 저장소의 createIndex() 메서드를 호출할 수 있도록 특별한 종류의
    트랜잭션을 시작한다.

# 데이터베이스 질의, 수정 절차.
    1. 데이터베이스이름으로 객체저장소를 연다.
    2. 트랜잭션 객체를 생성한다.
    3. 객체를 사용하여 데디터베이스 내부에서 대상 객체 저장소의 이름을 찾는다.
    4. get() 메서드를 호출해 객체를 찾는다.
    5. put() 메서드를 호출해 새 객체를 덮어써 저장한다.
    6 .add() 메서드를 호출해 새 객체를 추가해 저장한다.
    7. IDBRange 객체를 생성해 키의 범의에 해당하는 객체를 색인하고,
       해당 객체를 객체 저장소의 openCursor() 메서드로 전달해야 한다.
    8. 보조키를 사용한 질의를 만들려면 객체 저장소의 인덱스명으로 색인하고,
       인덱스 객체의 get() 또는 openCursor() 메서드를 호출한다.

```html

```