Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

When match function doesn't match

var x = 'CHQ10';
var y = (x.match(/\d+/)[0]);//10

When match can identify digit, i got the result.
But in case there is no digit, i got an error

TypeError: Cannot read properties of null (reading ‘0’)

var x = 'CHQ';    
var y = (x.match(/\d+/)[0]===0)?0:(x.match(/\d+/)[0]);

I’ve try with null and undefined but cannot be accepted

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

>Solution :

The match function documentation can be found here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match

There you will find this:

Return value
An Array whose contents depend on the presence or absence of the global (g) flag, or null if no matches are found.

The error that you are receiving is:

TypeError: Cannot read properties of null (reading '0')

That means that you are trying to access the index 0 of something that is not an array, null in this case

Here is an example:

    const input_text_that_matches_the_regular_expression = 'CHQ10';
    const input_text_that_does_not_matches_the_regular_expression = 'CHQ';
    const regular_expression = /\d+/
    
    /**
 * If we compare input_text_that_matches_the_regular_expression with the regular expression
 * the 10 will match, and according to the match documentation, we will get an array
 **/
const match = input_text_that_matches_the_regular_expression.match(
  regular_expression,
); // [10] - array of matches, so we can access match[0] to get the first match, which is 10

/**
 * If we compare input_text_that_does_not_matches_the_regular_expression with the regular expression
 * the 10 will not match, and according to the match documentation, we will get null
 */
const match =
  input_text_that_does_not_matches_the_regular_expression.match(
    regular_expression,
); // null  - no matches, if we try to access match[0] we will get an error

How to prevent this error?

We have 2 main options, the first one ( more readable )

  /**
 * Check with an if statement if the match is null or not
 */
if (match) {
  // do something
} // here you could also add an else statement if needed, this else would mind that there is no match found

The second option, as mentioned by CherryDT, is to use a coalesce operator

/**
 * You can also use the optional chaining and coalesce operator to get the first match, if there is no match, it will return null
 */
const first_match = match?.[0] ?? null;

If you don’t know anything about coalesce operator or optional chaining, information can be found here
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing_operator

and if you need more information about the error itself, this page may help =)
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading