Real World Use Case of a Tree

NOTE: to the prospective reader of this blog post: you may find it entirely “skippable”, unless you’re curious about how I think. This blog may appear “messy” as it’s me trying to work through an idea, breathe some life into it that I might have an easier time coding it. It’s basically a forward-looking-reflection on a side project I’m working on with another dude: a chatbot experience to help us learn Japanese that we might better communicate with our in-laws.

There is no Japanese in the code examples below, but the idea is to test it conceptually with English, to reduce the number of moving parts, to make it easier to focus on what problem to solve first. Once things are working, the next step will be to setup the trees with Japanese interchanges to get “language-learning” immediately… OR, to expand on the project “programmatically” create a CRUD interface that enables the user to create chat-trees.

Right now a sample tree is coded below:

class conversationNode {
  constructor(val, left = null, right = null) {
    this.val = val;
    this.left = left;
    this.right = right;
  }
}

const howAreYou = new conversationNode("How are you?");
howAreYou.left = new conversationNode(["I'm good.", "I'm great!", "I'm wonderful!"]) // this would give a random response
howAreYou.left.left = new conversationNode("That's great to hear. How's the family?")
howAreYou.left.left.left = new conversationNode(["They're awesome!", "They're doing great, thank you for asking!"])
howAreYou.left.left.left.left = new conversationNode("Fantastic!")


howAreYou.right = new conversationNode("I'm terrible.")
howAreYou.left.right = new conversationNode("I'm glad you're doing well")
howAreYou.right.left = new conversationNode("I'm sorry to hear that...")
howAreYou.right.right = new conversationNode("BOO HOO.")

const jNodes = [howAreYou, howAreYou.left, howAreYou.left.left, howAreYou.left.left.left, howAreYou.left.left.left.left]

Right now, the meat of the program works like so:

thePrompt.value = jNodes[0].val

function properResponse(input) {
  if (input.value == jNodes[1].val[0]) {
    showSuccess(input);
    thePrompt.value = jNodes[2].val
    clearUserResponse()
  } else if (input.value == jNodes[3].val[0]) {
    showSuccess(input);
    thePrompt.value = jNodes[4].val
    clearUserResponse()
  }
    else {
    showError(input, 'WRONG-O');
  }

… with a submit button being responsible for iterating through the tree. What I’d really like to happen is for the user to submit a response, and if the response has a match in the “left array” then it’ll traverse to the next left node. The above code uses a if/else if/else statement, which would ideally be refactored to keep track of itself.

Ultimately, this follows the pattern of a Depth First Search, in that the user is going deeper down the tree, but whether they go “left” or “right” is determined by their input.

The main question on my mind is whether or not each node should keep track of the user input that determines which “leg” is traversed, OR if it’s an outside function that keeps outside reference. As both options seems equally difficult, I wonder aloud (here) if the best way to go might be to create something of a helper function that will match left or right, AND if a match is found trigger something of a left or right switch.