IndexedDB - What is Key, keyPath and indexName?

Question

I am coming from MySQL and I am used to the conventional database table scheme. I am having trouble understanding IndexedDB and some of its terminology. I looked up these definitions in the documentation:

Key A data value by which stored values are organized and retrieved in the object store.

indexName The name of the index to create.

keyPath The key path for the index to use.

Basically, Key is like a Primary Key in MySQL, right? Is indexName the same thing as a column? And I don't understand what a keyPath is.

Can someone explain these for me? Thank you again for you patience :).

Answer 1

Yes, key is like a primary key in SQL. But others seem to be missing an example explaining the main part of your question, and that is the distinction between indexName and keyPath. Per the Mozilla page on creating an index,

indexName The name of the index to create. Note that it is possible to create an index with an empty name.

keyPath The key path for the index to use. Note that it is possible to create an index with an empty keyPath, and also to pass in a sequence (array) as a keyPath.

The indexName is what you use to access that index. Indexes are used to search that "column" in the database. The keyPath is the actual name of the "column." See other questions and answers for what forms a keyPath may take. Note that "column" is not technically correct, but I'm using it because that's what you used.

For example, suppose your data has the column hours and you want to be able to search your database on that column. When creating your database you would create an index for that column:

objectStore.createIndex(indexName, keyPath, { unique: false });

where indexName can be anything you want, let's say hoursColumn, and keyPath would be hours.

objectStore.createIndex("hoursColumn", "hours", { unique: false });

unique: false just means that other rows of data may have the same value for hours.

I can write data to the objectStore as follows:

db.transaction(storeName, "readwrite").objectStore(storeName).add({hours: 20, minutes: 30});

So to search your data on the column hours, you could write:

var data = db.transaction(storeName).objectStore(storeName).index("hoursColumn").get(20)

and the result would be the first row of data where hours = 20, e.g. {hours: 20, minutes: 30}

So to summarize, indexName is just what you call the index you created that you want to search, and keyPath is the actual name of the stored data on which you want to search.

Answer 2

Indexes are a way to make it possible to query data in the indexeddb database. As you know objects are stored into the objectstores. These objectstore don't have a schema like you have in an normal SQL database.

An index exists out of 3 important properties:

indexName: The indexname is just a name you provide to the index. You will need this name if you want to use the index to query data.

keyPath: This defines which property of the object you want to address in your index. For example: you have an object

{ foo: "bar" } 

and you want to query on the foo property, "foo" will be your keypath. The keypath can even go further. You can access nested properties

{ foo: { bar: "bla" } }

If you want to query the bar property the keypath will be "foo.bar"

key: The keys are the values inside the keypath. As you mentioned this key is unique for the index, but this doens't mean this value must be unique over all your objects in the objectstore.

The indexes in the indexeddb work like this: When you create an index, it creates a new objectstore in which the object will be stored. Instead of storing these object bosed on primary key they are stored based on the values present in the keypath. This means that for a single key in an index you can have multiple objects. So if you start querying an index, it will filter on the keys and return the values that are present in these keys.

Hope this makes indexes clear for you.