JSFiddle - React, Tailwind, and code Playground

HTML

<div id="result"></div>

JavaScript

var commandArr = ["cat", "dog", "fish", "copy", "delete"]
var testCommand = "bopy";

function closestMatch(str, arr)
{
    //console.log("match called");
    var matchDist = [];
    var min, pos;
    for(var i=0; i<arr.length; i++)
    {
        matchDist[i]=calcLevDist(str, arr[i]);
        console.log("Testing "+ str + " against " + arr[i]);
    }
    //http://stackoverflow.com/questions/5442109/how-to-get-the-min-elements-inside-an-array-in-javascript
    min = Math.min.apply(null,matchDist);
    pos = matchDist.indexOf(min);
    
    var output = { match : arr[pos],
                  distance : matchDist[pos]
                 };
    
    return output;
}

function calcLevDist (str1, str2)
{
    //console.log("calc running");
    
    var cost = 0 , len1, len2;
    var x = 1;
    while(x > 0)
    {
	    len1 = str1.length;
	    console.log("Length of String 1 = " + len1);
	    len2 = str2.length;
	    console.log("Length of String 2 = " + len2);
	    
	    if(len1 == 0)
	    {
	        cost+= len2;
	        return cost;
	    }
	    if(len2 == 0)
	    {    
	        cost+= len1;
	        return cost;
	    }
	    x = Math.min(len1,len2);
	    
	    if(str1.charAt(len1 -1) != str2.charAt(len2 -1))
        {
        	cost++;
    	}
    	else
    		console.log(str1.charAt(len1-1) + " matches " + str2.charAt(len2-1));
	    
	    str1 = str1.substring(0, len1 -1 );
	    str2 = str2.substring(0, len2 -1 );
	    
	    
	    console.log("Current Cost = " + cost);
   }
    
    
}

var matchObj = closestMatch(testCommand, commandArr);
var match = matchObj["match"];
var dist = matchObj["distance"];

$("#result").html("Closest match to " + testCommand + " = " + match + " with a Lev Distance of " + dist + "." )