I need to convert a string value to its primitive type in JavaScript. Other values that are not of type String should just be returned.Example:String '34' should be converted to 34String '34px' should be kept as '34px'true should return true'true' should return trueHere is a working example (please look at console).I would like to know:If there is any better way to write the same function, in term of performance.If I missed some type or any other issues.function convert(value) {    var result = value;    if (typeof value === 'string') {        // check if it is a empty character        value.trim();        if (value.length > 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;}
Converting a string to a corresponding type in JavaScript
javascript;strings;converting
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 > 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 < 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;}<div class=table>  <div class=headerRow>    <div class=headerCell>Input String</div>    <div class=headerCell>Output Value</div>    <div class=headerCell>Output Type</div>  </div>  <div class=row>    <div class=in cell></div>    <div class=out cell></div>    <div class=type cell></div>  </div>  <div class=row>    <div class=in cell value= 9e99 ></div>    <div class=out cell></div>    <div class=type cell></div>  </div>  <div class=row>    <div class=in cell value=Infinity></div>    <div class=out cell></div>    <div class=type cell></div>  </div>  <div class=row>    <div class=in cell value=></div>    <div class=out cell></div>    <div class=type cell></div>  </div>  <div class=row>    <div class=in cell value=0x9></div>    <div class=out cell></div>    <div class=type cell></div>  </div>  <div class=row>    <div class=in cell value=0x1A9></div>    <div class=out cell></div>    <div class=type cell></div>  </div>  <div class=row>    <div class=in cell value=099.90></div>    <div class=out cell></div>    <div class=type cell></div>  </div>  <div class=row>   <div class=in cell value=1e8></div>   <div class=out cell></div>    <div class=type cell></div>  </div>  <div class=row>   <div class=in cell value=true></div>   <div class=out cell></div>    <div class=type cell></div>  </div>  <div class=row>   <div class=in cell value=TRUE></div>   <div class=out cell></div>    <div class=type cell></div>  </div>  <div class=row>   <div class=in cell value=12px></div>   <div class=out cell></div>    <div class=type cell></div>  </div>  <div class=row>   <div class=in cell value=false></div>   <div class=out cell></div>    <div class=type cell></div>  </div></div>Boolean values are also considered numbers, but your function has that covered.