PouchDB 教程 · ZetCode 中文系列教程

# PouchDB 教程 > 原文： [http://zetcode.com/javascript/pouchdb/](http://zetcode.com/javascript/pouchdb/) PouchDB 教程展示了如何在 JavaScript 中使用 PouchDB。本教程中的 PouchDB 代碼示例可在數據庫中插入，刪除和刪除文檔。 ## PouchDB PouchDB 是 CouchDB 的 JavaScript 實現。 PouchDB 可以在瀏覽器中，在 Node 中本地使用，也可以通過 HTTP 協議遠程使用。默認情況下，PouchDB 隨附用于瀏覽器的 IndexedDB 適配器，Node.js 中的 LevelDB 適配器和用于遠程數據庫的 CouchDB 適配器。 Apache CouchDB 是面向文檔的開源 NoSQL 數據庫。它以 Erlang 語言實現，并使用 JSON 存儲數據，將 JavaScript 作為其查詢語言以及用于 API 的 HTTP。 ## PouchDB 創建數據庫為了創建一個新的數據庫，我們實例化了一個新的`PouchDB`對象。如果數據庫已經存在，它將創建對數據庫的引用。 ```js const db = new PouchDB('mydb'); ``` 我們創建一個新的`mydb`數據庫。根據運行的位置，它將在瀏覽器，Node 或遠程 CouchDB 數據庫服務器中創建一個新數據庫。 ## 瀏覽器中的 PouchDB 我們展示了如何在瀏覽器中使用 PouchDB。 `public/index.html` ```js <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <script src="js/pouchdb-7.0.0.min.js"></script> <script> const db = new PouchDB('users'); db.info() .then((info) => { console.log(info); }) </script> </body> </html> ``` 我們下載了`pouchdb`的縮小版，并將其包含在`script`標簽中。然后，我們創建一個新的`users`數據庫，并將有關該數據庫的一些信息寫入控制臺。要檢查創建的數據庫，我們轉到瀏覽器開發者工具的存儲檢查器。 ![Storage browser in Chrome](https://img.kancloud.cn/ba/06/ba06ddaa4394d4f7886199e7509defde_596x243.jpg) 圖：Chrome 中的存儲瀏覽器這是 Google Chrome 瀏覽器中的存儲瀏覽器。只要選項卡存在，數據就是持久的。 ## 在 Node 上安裝 PouchDB 我們在 Node 上安裝 PouchDB。 ```js $ nodejs -v v9.11.2 ``` 我們使用 Node 版本 9.11.2。 ```js $ npm init -y $ npm i pouchdb ``` 我們創建一個新的 Node 項目并安裝 PouchDB。 ## PouchDB 創建文檔使用`put()`方法創建一個新的 PouchDB 文檔。 `insert_doc.js` ```js const PouchDB = require('pouchdb'); const db = new PouchDB('mydb'); doc = { _id: new Date().toISOString(), name: 'Peter', age: 23, occupation: 'designer' }; db.put(doc).then((res) => { console.log("Document inserted OK"); }).catch((err) => { console.error(err); }); ``` 該示例在本地創建一個新的`mydb`數據庫。 ```js doc = { _id: new Date().toISOString(), name: 'Peter', age: 23, occupation: 'designer' } ``` 這是一個要插入數據庫的新文檔。我們提供了`_id`。 ```js db.put(doc).then((res) => { console.log("Document inserted OK"); }).catch((err) => { console.error(err); }); ``` 該文檔已插入數據庫。 ```js $ ls mydb/ 000022.ldb 000024.ldb 000025.log CURRENT LOCK LOG LOG.old MANIFEST-000023 ``` 在`mydb`目錄中本地創建一個新數據庫。或者，我們可以使用`post()`創建一個新文檔。使用`post()`時，會自動為我們生成`_id`。 `insert_doc2.js` ```js const PouchDB = require('pouchdb'); const db = new PouchDB('mydb'); doc = { name: 'Peter', age: 23, occupation: 'designer' }; db.post(doc).then((res) => { console.log("Document inserted OK"); }).catch((err) => { console.error(err); }); ``` 在示例中，我們使用`post()`創建一個新文檔。為文檔提供自動生成的`_id`，例如`b781309e-0423-4b3e-96ad-238cf50debce`。 ## PouchDB 獲取文檔要從數據庫檢索文檔，我們使用`get()`函數。 `get_doc.js` ```js const PouchDB = require('pouchdb'); const db = new PouchDB('mydb'); db.get('b781309e-0423-4b3e-96ad-238cf50debce').then((doc) => { console.log(`${doc.name}, ${doc.age}, ${doc.occupation}`); }).catch((err) => { console.error(err); }); ``` 我們從數據庫中檢索文檔。我們為`get()`方法提供了`_id`。 ```js $ node get_doc.js Peter, 23, designer ``` 這是輸出。 ## PouchDB 刪除文檔要從數據庫中刪除文檔，我們使用`remove()`函數。 `get_doc.js` ```js const PouchDB = require('pouchdb'); const db = new PouchDB('mydb'); db.get('b781309e-0423-4b3e-96ad-238cf50debce').then((doc) => { return db.remove(doc); }).then((res) => { console.log("The document has been removed"); }).catch((err) => { console.error(err); }); ``` 為了刪除文檔，我們必須先使用`get()`進行獲取，然后再使用`remove()`進行刪除。 ## PouchDB `bulkDocs` 使用`bulkDocs()`方法，我們可以在單個批量操作中將許多文檔寫入數據庫。 `create_users.js` ```js const PouchDB = require('pouchdb'); const db = new PouchDB('users'); doc1 = { _id: 'peter43@gmail.com', name: 'Peter', age: 23, occupation: 'designer' }; doc2 = { _id: 'sofia23@gmail.com', name: 'Sofia', age: 44, occupation: 'teacher' }; doc3 = { _id: 'paul54@gmail.com', name: 'Paul', age: 25, occupation: 'driver' }; docs = [doc1, doc2, doc3]; db.bulkDocs(docs).then((res) => { console.log("Documents inserted OK"); }).catch(() => { console.error(err); }); ``` 在示例中，我們創建一個新的數據庫用戶，并使用`bulkDocs()`插入三個文檔。 ## PouchDB `allDocs` `allDocs()`是另一個 PouchDB 批量方法；一步即可檢索許多文檔。 `all_docs.js` ```js const PouchDB = require('pouchdb'); const db = new PouchDB('users'); db.allDocs({ include_docs: true, descending: true }, (err, doc) => { doc.rows.forEach(e => { console.log(e.doc); }); }).catch((err) => { console.error(err); });; ``` 在示例中，我們從`users`數據庫中獲取所有文檔。 ```js $ node all_docs.js { name: 'Sofia', age: 44, occupation: 'teacher', _id: 'sofia23@gmail.com', _rev: '1-80b0fba21acf487fc20ac499e928acd7' } { name: 'Peter', age: 23, occupation: 'designer', _id: 'peter43@gmail.com', _rev: '1-182869c3c446731fa8b6106910b87d8e' } { name: 'Paul', age: 25, occupation: 'driver', _id: 'paul54@gmail.com', _rev: '1-31bfc20f010c9a6127cb44d6621cee5c' } ``` 這是輸出。 ## PouchDB 更新文檔在下面的示例中，我們顯示了如何更新文檔。 `update_doc.js` ```js const PouchDB = require('pouchdb'); const db = new PouchDB('users'); db.get('sofia23@gmail.com').then((doc) => { doc.age = 45; return db.put(doc); }).then(() => { return db.get('sofia23@gmail.com'); }).then((doc) => { console.log(doc); }).catch((err) => { console.error(err); }); ``` 為了更新文檔，我們對其進行檢索，修改其屬性并將其放回數據庫。在本教程中，我們使用了 PouchDB 數據庫。我們創建了一些代碼示例，這些示例演示了如何創建與 PouchDB 交互的 JavaScript 程序。您可能也對以下相關教程感興趣： [JQuery 教程](/web/jquery/)， [Moment.js 教程](/javascript/momentjs/)，[從 JavaScript 中的 URL 讀取 JSON](/articles/javascriptjsonurl/) ， [JavaScript 貪食蛇教程](/javascript/snake/) ， [Node Sass 教程](/javascript/nodesass/)， [Lodash 教程](/javascript/lodash/)。