0

I'm using javascript and html to develop a simple chatbot. The code below works and uses .split to check for a whole word, however, this means that anything entered longer than one word such as "how are you?" no longer works. How can change this so that it'll allow multiple words but still check for whole words like "hi" so that they aren't picked up in bigger words such as "high" etc.

Any help would be much appreciated! Thanks!

var know = {
<!--General Phrases-->  
"Hi": "Hello! &#128075",
"Hey": "Hello! &#128075",
"Hello":"Hello &#128075 How can I help?",    
"how are you":"Not bad, thanks!",
"Bye":"Have a nice day!",
"Goodbye":"See you later!", 

<!--Directory-->
"Help": `You can find help by searching below or by clicking <a href='https://www.page.com/news' target="_blank">here</a>`,
"contact":  `You can contact us by clicking <a href='https://www.page.com/contact' target="_blank">here</a>`,
"About": `You can find our About Us page by clicking <a href='https://www.page.com/about' target="_blank">here</a>` 
};

function goo() {
 var userBox = document.getElementById('userBox');
 var userInput = userBox.value;
 var chatLog = document.getElementById('chatLog');
 var chatLogContent = "";

 if (!userInput) {
     chatLogContent = ''
 }

 var hasKeyword = false;

 for (var key in know) {
      if (userInput.toLowerCase()
      .replace(/[.,\/#!$%\^&\*;:{}=\-_`~ ()]/g,"")
      .split(/\s+/)
      .includes(key.toLowerCase())) {
          hasKeyword = true;
          break;
      } else {
          hasKeyword = false;
      }
 }

if (hasKeyword) {
    chatLogContent += know[key] + "<br>"; //or use know.key
} else {
    chatLogContent += "No results found. Please enter another search term below.<br>";
}

var server = document.createElement('div');
server.setAttribute('class', 'server');
server.innerHTML = chatLogContent;
document.getElementById('chatLog').innerHTML = '';
chatLog.appendChild(server);
}
Bill Colins
  • 29
  • 5

1 Answers1

1

You can use the regex:

var yourText = "how are you";
var youKeyRegexEscaped = "how are you"
yourText.match(new RegExp('(^|\\s)'+youKeyRegexEscaped+'(\\s|$)'))

Rexgex explanation:

(^|\s) -> begining of the string or space
(\s|$) -> space or end of string

To escape the key, just look at Is there a RegExp.escape function in JavaScript?

Manuel Romeiro
  • 1,002
  • 12
  • 14
  • Thanks for the explanation and for the link! I appreciate it. I'm struggling to understand how I'd implement this into my code. Should it look something like: if (userInput.toLowerCase() .match(new RegExp('(^|\\s)'know'(\\s|$)')) .replace(/[.,\/#!$%\^&\*;:{}=\-_`~ ()]/g,"") .split(/\s+/) .includes(key.toLowerCase())) { – Bill Colins Oct 05 '21 at 15:01
  • In you case, the variable "yourText" is "userInput.toLowerCase()", and "youKeyRegexEscaped" is "key.toLowerCase()" (but if you have some special characters like ".", "\", "[ ", etc., you need to escape it). Then put only this on "if" condition. you don't need to split anyting – Manuel Romeiro Oct 05 '21 at 21:59
  • just: if (userInput.toLowerCase().match(new RegExp('(^|\\s)'+key.toLowerCase()+'(\\s|$)')) { hasKeyword = true; . . . – Manuel Romeiro Oct 05 '21 at 22:03