diff --git a/content/languages/javascript.yaml b/content/languages/javascript.yaml index ff08b2b2e4f..c744ace512c 100644 --- a/content/languages/javascript.yaml +++ b/content/languages/javascript.yaml @@ -364,6 +364,8 @@ references: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/trunc Number: >- https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number + Number(): >- + https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/Number Number.EPSILON: >- https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/EPSILON Number.MAX_SAFE_INTEGER: >- diff --git a/content/redirects.yaml b/content/redirects.yaml index 3b5ca0f7be5..811ea0759f4 100644 --- a/content/redirects.yaml +++ b/content/redirects.yaml @@ -2920,3 +2920,6 @@ - from: /js/s/count-substrings to: /js/s/count-occurences status: 301! +- from: /js/s/validate-number + to: /js/s/number-validation + status: 301! diff --git a/content/snippets/js/s/number-validation.md b/content/snippets/js/s/number-validation.md new file mode 100644 index 00000000000..0673980f6c9 --- /dev/null +++ b/content/snippets/js/s/number-validation.md @@ -0,0 +1,26 @@ +--- +title: Validate a number in JavaScript +shortTitle: Validate number +type: tip +language: javascript +tags: [math] +cover: flower-portrait-9 +excerpt: Check if a value can be safely converted to a number in JavaScript. +dateModified: 2024-05-17 +--- + +Number validation is probably one of the hardest things to do even for intermediate developers. However, it's a necessary evil, especially when working with **user input**. It's even more so in JavaScript, due to the language's quirks and the fact that it's loosely typed. + +While, a simple check that `parseFloat()` produces a sensible **numeric value** might seem enough, it's a little more involved than that. You also need to check for `NaN`, using `Number.isNaN()`, and for `Infinity`, using `Number.isFinite()`. + +And, as if that wasn't already enough, you also need to check if the **coercion** of the value to a number is correct, using `Number()` and the loose equality operator (`==`). Putting everything together, you get a pretty robust number validation function. + +```js +const validateNumber = n => { + const num = parseFloat(n); + return !Number.isNaN(num) && Number.isFinite(num) && Number(n) == n; +} + +validateNumber('10'); // true +validateNumber('a'); // false +``` diff --git a/content/snippets/js/s/validate-number.md b/content/snippets/js/s/validate-number.md deleted file mode 100644 index fefcc3ed8e7..00000000000 --- a/content/snippets/js/s/validate-number.md +++ /dev/null @@ -1,25 +0,0 @@ ---- -title: Validate number -type: snippet -language: javascript -tags: [math] -cover: flower-portrait-9 -dateModified: 2020-10-22 ---- - -Checks if the given value is a number. - -- Use `parseFloat()` to try to convert `n` to a number. -- Use `Number.isNaN()` and logical not (`!`) operator to check if `num` is a number. -- Use `Number.isFinite()` to check if `num` is finite. -- Use `Number` and the loose equality operator (`==`) to check if the coercion holds. - -```js -const validateNumber = n => { - const num = parseFloat(n); - return !Number.isNaN(num) && Number.isFinite(num) && Number(n) == n; -} - -validateNumber('10'); // true -validateNumber('a'); // false -```