loading...

JavaScript Data Structures: Hash Table: Get keys

miku86 profile image miku86 ・3 min read

JavaScript Data Structures (40 Part Series)

1) JavaScript Data Structures: Singly Linked List 2) JavaScript Data Structures: Singly Linked List: Setup 3 ... 38 3) JavaScript Data Structures: Singly Linked List: Push 4) JavaScript Data Structures: Singly Linked List: Pop 5) JavaScript Data Structures: Singly Linked List: Unshift 6) JavaScript Data Structures: Singly Linked List: Shift 7) JavaScript Data Structures: Singly Linked List: Get 8) JavaScript Data Structures: Singly Linked List: Set 9) JavaScript Data Structures: Singly Linked List: Insert 10) JavaScript Data Structures: Singly Linked List: Remove 11) JavaScript Data Structures: Singly Linked List: Recap 12) JavaScript Data Structures: Doubly Linked List: Intro and Setup 13) JavaScript Data Structures: Doubly Linked List: Push / Add data to the end 14) JavaScript Data Structures: Doubly Linked List: Pop / Remove data from the end 15) JavaScript Data Structures: Doubly Linked List: Unshift / Add data to the beginning 16) JavaScript Data Structures: Doubly Linked List: Shift / Remove data from the beginning 17) JavaScript Data Structures: Doubly Linked List: Get a specific node by its index 18) JavaScript Data Structures: Doubly Linked List: Set / Update a specific node 19) JavaScript Data Structures: Doubly Linked List: Insert a new node at a specific index 20) JavaScript Data Structures: Doubly Linked List: Remove a node at a specific index 21) JavaScript Data Structures: Doubly Linked List: Recap 22) JavaScript Data Structures: Stack: Intro 23) JavaScript Data Structures: Stack: Push / Add a new node 24) JavaScript Data Structures: Stack: Pop / Remove the last node 25) JavaScript Data Structures: Stack: Recap 26) JavaScript Data Structures: Queue: Intro 27) JavaScript Data Structures: Queue: Enqueue 28) JavaScript Data Structures: Queue: Dequeue 29) JavaScript Data Structures: Queue: Recap 30) JavaScript Data Structures: Recap: Lists, Stack, Queue 31) JavaScript Data Structures: Hash Table: Intro 32) JavaScript Data Structures: Hash Table: Hash Function 33) JavaScript Data Structures: Hash Table: Collisions 34) JavaScript Data Structures: Hash Table: Setup 35) JavaScript Data Structures: Hash Table: Add data 36) JavaScript Data Structures: Hash Table: Get data 37) JavaScript Data Structures: Hash Table: Get keys 38) JavaScript Data Structures: Hash Table: Get values 39) JavaScript Data Structures: Hash Table: Get all entries 40) JavaScript Data Structures: Hash Table: Recap

Intro 🌐

Last time, we learned how to get data from our hash table .

Today, we'll learn how to get the keys of our Hash Table.


Requirements πŸ’­

We need the following parts to get the keys from our Hash Table:

  • a method to get the keys (keys)

Starter Code ▢️

We start with the code with the set method, so that we can use the set method to add some data.

class Hashtable {
  constructor() {
    this.data = [];
    this.size = 0;
  }

  hash(key) {
    const chars = key.split("");
    const charCodes = chars.map((char) => char.charCodeAt());
    const charCodeSum = charCodes.reduce((acc, cur) => acc + cur);
    return charCodeSum;
  }

  set(key, value) {
    const hash = this.hash(key);

    if (!this.data[hash]) {
      this.data[hash] = [];
    }

    this.data[hash].push([key, value]);

    this.size++;
  }
}

If you are not familiar with the hash function, re-read this post.


Thoughts πŸ’­

First, we should think about the constraints and possibilities:

  • first, we declare an empty array for the keys
  • then we iterate over the data array
  • if there is data (= array of key-value pairs) at this specific index, iterate over this data (= the single key-value pairs)
  • add the data (= key) to the keys array
  • return the keys array

Example

We want to get the key-value pair with the key name.

// current hash table data:
[
  [["age", 33]],
  [
    ["name", "miku86"],
    ["mean", false],
  ],
];

// desired data:
["age", "name", "mean"];

Steps

// current hash table data:
[
  [["age", 33]],
  [
    ["name", "miku86"],
    ["mean", false],
  ],
];

// then we iterate over the data array
[["age", 33]];

// if there is data (= array of key-value pairs) at this specific index
// then iterate over this data (= the single key-value pairs)
["age", 33];

// add the data (= key) to the keys array
["age"];

// then we iterate over the data array
[
  ["name", "miku86"],
  ["mean", false],
];

// if there is data (= array of key-value pairs) at this specific index
// then iterate over this data (= the single key-value pairs)
["name", "miku86"];

// add the data (= key) to the keys array
["age", "name"];

// if there is data (= array of key-value pairs) at this specific index
// then iterate over this data (= the single key-value pairs)
["mean", false];

// add the data (= key) to the keys array
["age", "name", "mean"];

// desired data:
["age", "name", "mean"];

βœ…


Implementation β›‘

// a Hash Table class
class Hashtable {
  constructor() {
    this.data = [];
    this.size = 0;
  }

  hash(key) {
    const chars = key.split("");
    const charCodes = chars.map((char) => char.charCodeAt());
    const charCodeSum = charCodes.reduce((acc, cur) => acc + cur);
    return charCodeSum;
  }

  set(key, value) {
    const hash = this.hash(key);

    if (!this.data[hash]) {
      this.data[hash] = [];
    }

    this.data[hash].push([key, value]);

    this.size++;
  }

  keys() {
    // declare an empty array for the keys
    const keys = [];

    // iterate over the data array (I call a single array a "bucket")
    for (let bucket of this.data) {
      // if there is data (= array of key-value pairs) at this specific index
      if (bucket) {
        // iterate over this data (= the single key-value pairs)
        for (let item of bucket) {
          // add the data (= key) to the keys array
          keys.push(item[0]);
        }
      }
    }

    // return the keys array
    return keys;
  }
}

Note: I'm using a for ... of-loop. If you don't know how this works, you can read about it on MDN. You can use whatever you want to use, a default for-loop, a for ... in-loop, a functional approach etc.


Result

// create a new hash table
const newHashtable = new Hashtable();

// add three new key-value pairs
newHashtable.set("name", "miku86");
newHashtable.set("mean", false);
newHashtable.set("age", 33);

// show the hash table data
console.log(newHashtable.data);
// [ <301 empty items>, [ [ 'age', 33 ] ], <115 empty items>, [ [ 'name', 'miku86' ], [ 'mean', false ] ] ]

// show the keys
console.log(newHashtable.keys());
// [ 'age', 'name', 'mean' ] βœ…

βœ…


Next Part ➑️

We managed to write a function to get all keys, great work!

Next time, we'll learn how to get all values from our Hash Table.

Need some mentoring? Click here!


Further Reading πŸ“–


Questions ❔

  • How would you implement the keys-function?
  • How would you write this code in a functional style?

JavaScript Data Structures (40 Part Series)

1) JavaScript Data Structures: Singly Linked List 2) JavaScript Data Structures: Singly Linked List: Setup 3 ... 38 3) JavaScript Data Structures: Singly Linked List: Push 4) JavaScript Data Structures: Singly Linked List: Pop 5) JavaScript Data Structures: Singly Linked List: Unshift 6) JavaScript Data Structures: Singly Linked List: Shift 7) JavaScript Data Structures: Singly Linked List: Get 8) JavaScript Data Structures: Singly Linked List: Set 9) JavaScript Data Structures: Singly Linked List: Insert 10) JavaScript Data Structures: Singly Linked List: Remove 11) JavaScript Data Structures: Singly Linked List: Recap 12) JavaScript Data Structures: Doubly Linked List: Intro and Setup 13) JavaScript Data Structures: Doubly Linked List: Push / Add data to the end 14) JavaScript Data Structures: Doubly Linked List: Pop / Remove data from the end 15) JavaScript Data Structures: Doubly Linked List: Unshift / Add data to the beginning 16) JavaScript Data Structures: Doubly Linked List: Shift / Remove data from the beginning 17) JavaScript Data Structures: Doubly Linked List: Get a specific node by its index 18) JavaScript Data Structures: Doubly Linked List: Set / Update a specific node 19) JavaScript Data Structures: Doubly Linked List: Insert a new node at a specific index 20) JavaScript Data Structures: Doubly Linked List: Remove a node at a specific index 21) JavaScript Data Structures: Doubly Linked List: Recap 22) JavaScript Data Structures: Stack: Intro 23) JavaScript Data Structures: Stack: Push / Add a new node 24) JavaScript Data Structures: Stack: Pop / Remove the last node 25) JavaScript Data Structures: Stack: Recap 26) JavaScript Data Structures: Queue: Intro 27) JavaScript Data Structures: Queue: Enqueue 28) JavaScript Data Structures: Queue: Dequeue 29) JavaScript Data Structures: Queue: Recap 30) JavaScript Data Structures: Recap: Lists, Stack, Queue 31) JavaScript Data Structures: Hash Table: Intro 32) JavaScript Data Structures: Hash Table: Hash Function 33) JavaScript Data Structures: Hash Table: Collisions 34) JavaScript Data Structures: Hash Table: Setup 35) JavaScript Data Structures: Hash Table: Add data 36) JavaScript Data Structures: Hash Table: Get data 37) JavaScript Data Structures: Hash Table: Get keys 38) JavaScript Data Structures: Hash Table: Get values 39) JavaScript Data Structures: Hash Table: Get all entries 40) JavaScript Data Structures: Hash Table: Recap

Posted on Aug 24 '19 by:

miku86 profile

miku86

@miku86

Developer & Explorer with a passion for web development, learning and the world we live in | Need some mentoring? => https://miku86.com/mentoring

Discussion

markdown guide