DEV Community

Cover image for How to remove accent marks in a string using vanilla Javascript
LuisPa
LuisPa

Posted on

2

How to remove accent marks in a string using vanilla Javascript

In JS is quite of easy to replace chars by using str.replace for example, but, what happens when you want to remove accent marks?

I'm a native Spanish speaker, so this could be helpful if you need to handle some Spanish words.

This tiny post will build an example on how to make a slug from a Spanish sentences strings.

The code

// Input example
const spanishSentences = [
  "teléfono",
  "árbol",
  "colibrí",
  "cómpramelo",
  "Mandó una carta",
  "Qué grande es ese perro"
];

// Function definition
function createSlug(input){
  return input
    .toLowerCase()
    .trim()
    .replace(/[\s_-]+/g, "-")
    .replace(/^-+|-+$/g, "")
    .normalize("NFD")
    .replace(/[\u0300-\u036f]/g, "");
}

// Usage
const output = spanishSentences.map(createSlug);
console.log(output);
// Output:
/*
[
  "telefono", 
  "arbol", 
  "colibri", 
  "compramelo", 
  "mando-una-carta", 
  "que-grande-es-ese-perro"
]
*/
Enter fullscreen mode Exit fullscreen mode

You can test it in this JS Bin

And that's it, happy coding!

SurveyJS custom survey software

Simplify data collection in your JS app with a fully integrated form management platform. Includes support for custom question types, skip logic, integrated CCS editor, PDF export, real-time analytics & more. Integrates with any backend system, giving you full control over your data and no user limits.

Learn more

Top comments (0)

SurveyJS custom survey software

JavaScript UI Library for Surveys and Forms

Generate dynamic JSON-driven forms directly in your JavaScript app (Angular, React, Vue.js, jQuery) with a fully customizable drag-and-drop form builder. Easily integrate with any backend system and retain full ownership over your data, with no user or form submission limits.

View demo

👋 Kindness is contagious

Engage with a wealth of insights in this thoughtful article, cherished by the supportive DEV Community. Coders of every background are encouraged to bring their perspectives and bolster our collective wisdom.

A sincere “thank you” often brightens someone’s day—share yours in the comments below!

On DEV, the act of sharing knowledge eases our journey and forges stronger community ties. Found value in this? A quick thank-you to the author can make a world of difference.

Okay