{"id":28811,"date":"2022-05-04T11:30:39","date_gmt":"2022-05-04T06:00:39","guid":{"rendered":"https:\/\/tutorial.eyehunts.com\/?p=28811"},"modified":"2023-09-05T17:43:25","modified_gmt":"2023-09-05T12:13:25","slug":"how-to-avoid-nan-in-javascript-basic-code","status":"publish","type":"post","link":"https:\/\/tutorial.eyehunts.com\/js\/how-to-avoid-nan-in-javascript-basic-code\/","title":{"rendered":"How to avoid NaN in JavaScript | Basic code"},"content":{"rendered":"\n

JavaScript NaN is the return value from operations that have an undefined numerical result. NaN is an error value that means not a number<\/a>. Below are 4 methods with examples to avoid NaN in JavaScript.<\/p>\n\n\n\n

<\/div>\n\n\n\n

Avoid NaN in JavaScript<\/h2>\n\n\n\n

Simple example code.<\/p>\n\n\n\n

1. Mathematical operations with non-numeric string values<\/strong><\/p>\n\n\n\n

Sometimes stringed values may come back from an API, just check if the value is NaN<\/code> in the first place.<\/p>\n\n\n\n

const y = 5 * \"Apples\"; \/\/ NaN\n\nisNaN(\"5\") || 0\n<\/code><\/pre>\n\n\n\n
To avoid it completely, it\u2019s best if you do all your mathematical operations with numbers.<\/p>\n\n\n\n
<\/div>\n\n\n\n
2. Mathematical operations with functions<\/strong><\/p>\n\n\n\n
Doing mathematical operations with a function will result in a NaN<\/code> value.<\/p>\n\n\n\n
function fooBar() {\n  \/\/ ...stuff\n}\nfooBar * 5 \/\/ NaN<\/code><\/pre>\n\n\n\n
<\/div>\n\n\n\n
3. Mathematical operations with objects<\/strong><\/p>\n\n\n\n
Doing mathematical operations with a JavaScript object will result in a NaN<\/code> value.<\/p>\n\n\n\n
\nconst obj = {};\n\nobj * 5 \/\/ NaN\n<\/code><\/pre>\n\n\n\n
<\/div>\n\n\n\n
4. Mathematical operations with falsy values<\/strong><\/p>\n\n\n\n
Avoid doing mathematical operations with falsy values such as:<\/p>\n\n\n\n