Converting Strings to Snake Case with JavaScript

Introduction

In this lab, we will delve into the world of JavaScript programming to learn how to convert a given string into snake case. We will use regular expressions and various array methods such as map(), slice(), and join() to break down the string and reconstruct it with underscores as separators. By the end of this lab, you will have a good understanding of how to manipulate strings in JavaScript and apply these concepts to other programming projects.

Skills Graph

Function to Convert String to Snake Case

To convert a string to snake case, use the following function:

const toSnakeCase = (str) => {
  if (!str) return "";
  const regex =
    /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g;
  return str
    .match(regex)
    .map((x) => x.toLowerCase())
    .join("_");
};

This function uses String.prototype.match() to break the string into words using an appropriate regular expression. Then, it uses Array.prototype.map(), Array.prototype.slice(), Array.prototype.join(), and String.prototype.toLowerCase() to combine the words, adding _ as a separator.

Example usage:

toSnakeCase("camelCase"); // 'camel_case'
toSnakeCase("some text"); // 'some_text'
toSnakeCase("some-mixed_string With spaces_underscores-and-hyphens");
// 'some_mixed_string_with_spaces_underscores_and_hyphens'
toSnakeCase("AllThe-small Things"); // 'all_the_small_things'
toSnakeCase("IAmEditingSomeXMLAndHTML");
// 'i_am_editing_some_xml_and_html'

Summary

Congratulations! You have completed the Snakecase String lab. You can practice more labs in LabEx to improve your skills.