JavaScript · TypeScript · límite API
Axios snake_case ↔ camelCase
Centraliza la conversión de nombres en un límite HTTP en vez de renombrar propiedades por todo el frontend.
Construir un mapper recursivo seguro para JSON
function isPlainObject(value) {
return Object.prototype.toString.call(value) === "[object Object]"
}
function toCamelKey(key) { return key.replace(/_+([a-zA-Z0-9])/g, (_, char) => char.toUpperCase()) }
function toSnakeKey(key) { return key.replace(/([a-z0-9])([A-Z])/g, "$1_$2").replace(/[-\s]+/g, "_").toLowerCase() }
function mapKeys(value, keyMapper) {
if (Array.isArray(value)) return value.map((item) => mapKeys(item, keyMapper))
if (!isPlainObject(value)) return value
const output = {}
for (const [key, child] of Object.entries(value)) {
const nextKey = keyMapper(key)
if (Object.hasOwn(output, nextKey)) throw new Error(`Key collision: ${nextKey}`)
output[nextKey] = mapKeys(child, keyMapper)
}
return output
}Transforma solo objetos JSON simples y arrays, conserva escalares y valores no plain y detecta colisiones.
Añadir interceptors request/response a una instancia Axios dedicada
import axios from "axios"
const api = axios.create({ baseURL: "/api" })
api.interceptors.request.use((config) => {
if (config.data && isPlainObject(config.data)) config.data = mapKeys(config.data, toSnakeKey)
if (config.params && isPlainObject(config.params)) config.params = mapKeys(config.params, toSnakeKey)
return config
})
api.interceptors.response.use((response) => {
response.data = mapKeys(response.data, toCamelKey)
return response
})Normaliza data/params a snake_case y response.data a camelCase.
Mantener el código de la aplicación en camelCase
const response = await api.post("/users", {
displayName: "Ada Lovelace",
profileSettings: { emailNotifications: true },
})
console.log(response.data.createdAt)Un adapter centralizado permite que UI y modelos TypeScript mantengan una sola convención interna.
Consideraciones de producción
- No transformes FormData, Blob, ArrayBuffer, streams o instancias de clase como si fueran JSON.
- Usa una instancia dedicada u opt-out para endpoints que no deban transformarse.
- No pases headers por el mismo mapper de claves.
- Los tipos TypeScript no cambian claves runtime; el interceptor debe transformar los datos de verdad.
Probar el límite JSON online
Prueba objetos anidados, arrays, exclusiones, stop paths, prefijos, colisiones y diff de claves antes de implementar.
Suelta un archivo .json o elige uno de tu dispositivo
Los archivos se leen solo en tu navegador. Tamaño máximo: 5 MB.
{
"userProfile": {
"firstName": "Ada",
"createdAt": "2026-09-12"
}
}El análisis, lectura de archivos, formato y conversión se ejecutan localmente en tu navegador. El JSON no se envía a un servidor de conversión.