Converting a string to a corresponding type in JavaScript
On thing to keep in mind is that certain inputs that you might not consider to be numbers will be considered numbers by the isNaN and Number functions.

Potentially Unexpected Numbers:


Infinity ("Infinity")
hexidecimal notation ("0x1a3")
scientific notation ("0e9" and "0e+9" and "0e-9")




function convert(value) {
    var result = value;
    if (typeof value === 'string') {
        // check if it is a empty character
        value.trim();
        if (value.length &gt; 0) {
            if (/\S/.test(value)) {
                if (value === 'true') {
                    result = true;
                } else if (value === 'false') {
                    result = false
                } else if (!isNaN(value)) {
                    result = new Number(value);
                }
            }
        }
    }
    return result;
}

var rows = document.querySelectorAll(".row");
for(var i = 0; i &lt; rows.length; i++){
  var input = rows[i].querySelector(".in");
  var output = rows[i].querySelector(".out");
  var type = rows[i].querySelector(".type")
  
  var value = input.getAttribute("value");
  if(value){input.innerHTML = "\""+value+"\""}
  
  var result = convert(input.getAttribute("value"));
  output.innerHTML = result
  
  var typeValue = typeof result === "object" ? isNaN(result) ? typeof result : result === null ? "null" : "number" : typeof result;
  type.innerHTML = typeValue;
  if(typeValue === "number"){if(type.classList){type.classList.add("highlight");}else{type.className = type.className + " " + "highlight";}}
}
.table{display:table;border-left:1px solid black;table-layout:fixed; min-width:300px;}
.headerRow{display:table-row;background-color:#dfdfdf;font-weight:bold;}
.headerCell{display:table-cell; border-right:1px solid black; border-bottom:1px solid black; border-top:1px solid black;}
.row{display:table-row;}
.cell{display:table-cell; border-right:1px solid black;border-bottom:1px solid #dfdfdf;}
.highlight{background-color:lightgreen;}
&lt;div class="table"&gt;
  &lt;div class="headerRow"&gt;
    &lt;div class="headerCell"&gt;Input String&lt;/div&gt;
    &lt;div class="headerCell"&gt;Output Value&lt;/div&gt;
    &lt;div class="headerCell"&gt;Output Type&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;div class="in cell"&gt;&lt;/div&gt;
    &lt;div class="out cell"&gt;&lt;/div&gt;
    &lt;div class="type cell"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;div class="in cell" value=" 9e99 "&gt;&lt;/div&gt;
    &lt;div class="out cell"&gt;&lt;/div&gt;
    &lt;div class="type cell"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;div class="in cell" value="Infinity"&gt;&lt;/div&gt;
    &lt;div class="out cell"&gt;&lt;/div&gt;
    &lt;div class="type cell"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;div class="in cell" value=""&gt;""&lt;/div&gt;
    &lt;div class="out cell"&gt;&lt;/div&gt;
    &lt;div class="type cell"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;div class="in cell" value="0x9"&gt;&lt;/div&gt;
    &lt;div class="out cell"&gt;&lt;/div&gt;
    &lt;div class="type cell"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;div class="in cell" value="0x1A9"&gt;&lt;/div&gt;
    &lt;div class="out cell"&gt;&lt;/div&gt;
    &lt;div class="type cell"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
    &lt;div class="in cell" value="099.90"&gt;&lt;/div&gt;
    &lt;div class="out cell"&gt;&lt;/div&gt;
    &lt;div class="type cell"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
   &lt;div class="in cell" value="1e8"&gt;&lt;/div&gt;
   &lt;div class="out cell"&gt;&lt;/div&gt;
    &lt;div class="type cell"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
   &lt;div class="in cell" value="true"&gt;&lt;/div&gt;
   &lt;div class="out cell"&gt;&lt;/div&gt;
    &lt;div class="type cell"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
   &lt;div class="in cell" value="TRUE"&gt;&lt;/div&gt;
   &lt;div class="out cell"&gt;&lt;/div&gt;
    &lt;div class="type cell"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
   &lt;div class="in cell" value="12px"&gt;&lt;/div&gt;
   &lt;div class="out cell"&gt;&lt;/div&gt;
    &lt;div class="type cell"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row"&gt;
   &lt;div class="in cell" value="false"&gt;&lt;/div&gt;
   &lt;div class="out cell"&gt;&lt;/div&gt;
    &lt;div class="type cell"&gt;&lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;




Boolean values are also considered numbers, but your function has that covered.