Javascript – I found this “[\?&]v=([^&#]*)” on the internet can someone explain it to me

javascript, parsing, regex, youtube

I found a method on the internet that can retrieve the Id of a youtube video from the url.

this is it.

var vid;var results;results = url.match("[\\?&]v=([^&#]*)");vid = ( results === null ) ? url : results[1];

The Id will be contained in "vid".

What I don't understand and I find interesting and want to know is this.

results = url.match("[\\?&]v=([^&#]*)");

How does it work?

Best Solution

It's using a regular expression to extract the ID of the video from a complete URL. This particular regex breaks down as follows:

  1. [\\?&] is a character class. It matches a single character which is either & or ?. (The question mark is a special character in JavaScript regexes, so it must be escaped by preceding it with a backslash. The backslash is a special character in JavaScript strings, so it must be escaped also, hence the double backslash. That's fairly common in regular expressions.)
  2. v= matches the literal string v=.
  3. ( begins a capturing group, so everything until the next ) will be placed into a separate entry in the returned array.
  4. [^&#]* any number of characters (including none) until a & or # is found. The brackets indicate a character class as above, and the ^ inverts the class so it includes all characters except those listed before the end bracket. The * indicates that the preceding character class is to be matched zero or more times.
  5. The ) ends the capturing group.

Assuming the match is successful, results[0] contains the entire URL, and results[1] contains the contents of the first capturing group, i.e. the ID of the video.