创建数据库的主键和字段

DBOpenRequest.onupgradeneeded = function(event) {
  let db = event.target.result;

  // 创建一个数据库存储对象，并指定主键
  let objectStore = db.createObjectStore('person', { 
    keyPath: 'id',
    autoIncrement: true
  });

  /* 定义存储对象的数据项 
   * 第一个参数是创建的索引名称，可以为空
   * 第二个参数是索引使用的关键名称，可以为空
   * 第三个参数是可选配置参数，可以不传，常用参数之一就是 unique ，表示该字段是否唯一，不能重复
   */ 
  objectStore.createIndex('id', 'id', {
    unique: true    
  });
  objectStore.createIndex('name', 'name');
  objectStore.createIndex('age', 'age');
  objectStore.createIndex('sex', 'sex');
};

在上述操作中，我们先定义了上文中提到的 IDBObjectStore 对象，并指定主键为 id ，随后又通过 createIndex 来创建字段。值得注意的是虽然创建了四个字段，但在 IndexedDb 中数据还是分为主键 id 和数据主体两个部分，并不会像 MYSQL 中在 Table 中呈现四列。

向数据库中添加数据

// 这里的 db 就是第二步中的 db 对象， 
// transaction api 的第一个参数是数据库名称，第二个参数是操作类型
let newItem = {
  id: 1,
  name: '徐嘻嘻',
  age: 3,
  sex: 'female'
};
let transaction = db.transaction('dataBaseName', "readwrite");
// 找到对应的存储对象
let objectStore = transaction.objectStore('person');
// 添加到数据对象中, 传入javascript对象
objectStore.add(newItem);

新建操作是在新建了一个 事务（ IDBTransaction 对象）的前提下完成的，传入的数据不需要做任何转换，可以无缝传入 Javascript 对象。

修改数据库中的数据

// 这里的 db 就是第二步中的 db 对象， 
// 新建事务
let transaction = db.transaction('dataBaseName', "readwrite");
// 新数据主体
let newRecord = {
  id: 1,
  name: '徐嘎嘎',
  age: 5,
  sex: 'male'
};
// 打开已经存储的数据对象
let objectStore = transaction.objectStore('person');
// 获取存储的对应键的存储对象, 传入主键 id，值为 1  
let objectStoreRequest = objectStore.get(1);
// 获取成功后替换当前数据
objectStoreRequest.onsuccess = function(event) {
  // 数据
  var record = objectStoreRequest.result;
  // 遍历替换
  for (let key in newRecord) {
    if (typeof record[key] != 'undefined' || key !== 'id') {
      record[key] = newRecord[key];
    }
  }
  // 更新数据库存储数据             
  objectStore.put(record);
};

基本思路是创建一个事务，先找到想要修改的数据主体，然后在更新该数据主体内容。 事务创建逻辑相同，并在创建之后调用事务的 get 和 put 操作。

删除数据库中的数据

// 这里的 db 就是第二步中的 db 对象， 
// 新建事务
let transaction = db.transaction('dataBaseName', "readwrite");
// 打开已经存储的数据对象
let objectStore = transaction.objectStore('person');
// 获取存储的对应键的存储对象, 传入主键 id，值为 1  
let objectStoreRequest = objectStore.delete(1);

调用 delete 接口，传入指定的 id 即可。