Converter Chaves de Objeto para Minúsculas

Introdução

Neste laboratório, aprenderemos como converter todas as chaves de um objeto para minúsculas usando JavaScript. Essa técnica é particularmente útil ao trabalhar com dados de diferentes fontes, onde a capitalização das chaves do objeto pode ser inconsistente.

Utilizaremos vários métodos JavaScript para realizar esta tarefa:

• Object.keys() para obter todas as chaves de um objeto
• Array.prototype.reduce() para transformar dados em um novo objeto
• String.prototype.toLowerCase() para converter strings para minúsculas

Ao final deste laboratório, você será capaz de criar uma função reutilizável que pode transformar as chaves de qualquer objeto para minúsculas, preservando seus valores.

Compreendendo Objetos em JavaScript

Antes de começarmos a converter as chaves de objetos para minúsculas, vamos entender o que são objetos JavaScript e como podemos trabalhar com eles.

Em JavaScript, um objeto é uma coleção de pares chave-valor. As chaves são strings (ou Symbols), e os valores podem ser de qualquer tipo de dado, incluindo outros objetos.

Vamos começar abrindo o shell interativo do Node.js:

1. Abra o terminal no seu WebIDE
2. Digite node e pressione Enter

Você deve agora ver o prompt do Node.js (>), que permite que você digite código JavaScript diretamente.

Vamos criar um objeto simples com chaves em caixa mista:

const user = {
  Name: "John",
  AGE: 30,
  Email: "john@example.com"
};

Digite este código no prompt do Node.js e pressione Enter. Para ver o objeto, simplesmente digite user e pressione Enter:

user;

Você deve ver a saída:

{ Name: 'John', AGE: 30, Email: 'john@example.com' }

Como você pode ver, este objeto tem chaves com diferentes estilos de capitalização. No próximo passo, aprenderemos como acessar essas chaves e convertê-las para minúsculas.

Acessando as Chaves do Objeto

Antes de podermos transformar as chaves do objeto, precisamos entender como acessá-las. JavaScript fornece o método Object.keys(), que retorna um array contendo todas as chaves de um objeto.

No seu shell interativo do Node.js, tente o seguinte:

Object.keys(user);

Você deve ver uma saída como esta:

[ 'Name', 'AGE', 'Email' ]

Agora, vamos tentar converter cada chave para minúsculas usando o método toLowerCase(). Podemos usar o método map() para transformar cada chave:

Object.keys(user).map((key) => key.toLowerCase());

A saída deve ser:

[ 'name', 'age', 'email' ]

Ótimo! Agora temos um array com todas as chaves convertidas para minúsculas. No entanto, ainda precisamos criar um novo objeto com essas chaves em minúsculas e os valores originais. Para isso, usaremos o método reduce() no próximo passo.

Vamos entender o método reduce() antes de prosseguir. Este método executa uma função redutora em cada elemento do array, resultando em um único valor de saída.

Aqui está um exemplo simples de reduce():

const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((accumulator, currentValue) => {
  return accumulator + currentValue;
}, 0);

sum;

A saída será 10, que é a soma de todos os números no array. O 0 no método reduce() é o valor inicial do acumulador.

Criando a Função para Minúsculas

Agora que entendemos como acessar as chaves do objeto e usar o método reduce(), vamos criar uma função que converte todas as chaves de um objeto para minúsculas.

No seu shell interativo do Node.js, defina a seguinte função:

const lowerizeKeys = (obj) => {
  return Object.keys(obj).reduce((acc, key) => {
    acc[key.toLowerCase()] = obj[key];
    return acc;
  }, {});
};

Vamos detalhar o que esta função faz:

1. Object.keys(obj) obtém todas as chaves do objeto de entrada
2. .reduce() transforma essas chaves em um novo objeto
3. Para cada chave, criamos uma nova entrada no objeto acumulador (acc) com:
   • A chave convertida para minúsculas usando key.toLowerCase()
   • O valor original do objeto de entrada (obj[key])
4. Começamos com um objeto vazio {} como o valor inicial para o acumulador
5. Finalmente, retornamos o acumulador, que é nosso novo objeto com chaves em minúsculas

Agora, vamos testar nossa função com o objeto user que criamos anteriormente:

const lowercaseUser = lowerizeKeys(user);
lowercaseUser;

Você deve ver a saída:

{ name: 'John', age: 30, email: 'john@example.com' }

Perfeito! Todas as chaves agora estão em minúsculas.

Vamos tentar outro exemplo para garantir que nossa função funcione corretamente:

const product = {
  ProductID: 101,
  ProductName: "Laptop",
  PRICE: 999.99
};

lowerizeKeys(product);

A saída deve ser:

{ productid: 101, productname: 'Laptop', price: 999.99 }

Nossa função funciona corretamente para diferentes objetos com vários estilos de capitalização de chaves.

Lidando com Casos Extremos (Edge Cases)

Nossa função funciona bem para objetos simples, mas e quanto a casos mais complexos? Vamos explorar alguns casos extremos e ver como nossa função os trata.

Objetos Vazios

Primeiro, vamos testar com um objeto vazio:

lowerizeKeys({});

A saída deve ser um objeto vazio:

{}

Objetos com Objetos Aninhados

E se o objeto contiver objetos aninhados? Vamos tentar isso:

const nestedObject = {
  User: {
    Name: "John",
    Contact: {
      EMAIL: "john@example.com",
      PHONE: "123-456-7890"
    }
  }
};

lowerizeKeys(nestedObject);

A saída será:

{ user: { Name: 'John', Contact: { EMAIL: 'john@example.com', PHONE: '123-456-7890' } } }

Observe que apenas a chave de nível superior User é convertida para minúsculas. As chaves dentro dos objetos aninhados permanecem inalteradas.

Para lidar com objetos aninhados, precisaríamos modificar nossa função para processar recursivamente todos os objetos. Vamos criar uma versão aprimorada:

const deepLowerizeKeys = (obj) => {
  return Object.keys(obj).reduce((acc, key) => {
    const value = obj[key];
    // Check if the value is an object and not null
    const newValue =
      value && typeof value === "object" && !Array.isArray(value)
        ? deepLowerizeKeys(value)
        : value;

    acc[key.toLowerCase()] = newValue;
    return acc;
  }, {});
};

Esta função aprimorada:

1. Verifica se cada valor também é um objeto (e não um array ou nulo)
2. Se for, ela se chama recursivamente nesse objeto aninhado
3. Caso contrário, ela usa o valor original

Vamos testá-la com nosso objeto aninhado:

const deepLowerizedObject = deepLowerizeKeys(nestedObject);
deepLowerizedObject;

Agora você deve ver todas as chaves convertidas para minúsculas, mesmo em objetos aninhados:

{ user: { name: 'John', contact: { email: 'john@example.com', phone: '123-456-7890' } } }

Ótimo trabalho! Você criou uma função avançada que pode lidar com objetos aninhados.

Criando um Módulo Reutilizável

Agora que temos funções funcionando, vamos criar um arquivo de módulo JavaScript reutilizável que podemos importar em outros projetos.

Primeiro, vamos sair do shell interativo do Node.js pressionando Ctrl+C duas vezes ou digitando .exit e pressionando Enter.

Agora, crie um novo arquivo chamado object-utils.js no diretório do projeto:

1. No WebIDE, navegue até o painel do explorador de arquivos à esquerda
2. Clique com o botão direito no diretório do projeto e selecione "Novo Arquivo"
3. Nomeie o arquivo object-utils.js
4. Adicione o seguinte código ao arquivo:

/**
 * Converts all keys of an object to lowercase
 * @param {Object} obj - The input object
 * @returns {Object} A new object with all keys in lowercase
 */
const lowerizeKeys = (obj) => {
  return Object.keys(obj).reduce((acc, key) => {
    acc[key.toLowerCase()] = obj[key];
    return acc;
  }, {});
};

/**
 * Recursively converts all keys of an object and its nested objects to lowercase
 * @param {Object} obj - The input object
 * @returns {Object} A new object with all keys in lowercase (including nested objects)
 */
const deepLowerizeKeys = (obj) => {
  return Object.keys(obj).reduce((acc, key) => {
    const value = obj[key];
    // Check if the value is an object and not null
    const newValue =
      value && typeof value === "object" && !Array.isArray(value)
        ? deepLowerizeKeys(value)
        : value;

    acc[key.toLowerCase()] = newValue;
    return acc;
  }, {});
};

// Export the functions
module.exports = {
  lowerizeKeys,
  deepLowerizeKeys
};

Agora, vamos criar um arquivo de teste para verificar se nosso módulo funciona corretamente. Crie um novo arquivo chamado test.js:

1. No WebIDE, navegue até o painel do explorador de arquivos à esquerda
2. Clique com o botão direito no diretório do projeto e selecione "Novo Arquivo"
3. Nomeie o arquivo test.js
4. Adicione o seguinte código ao arquivo:

// Import the functions from our module
const { lowerizeKeys, deepLowerizeKeys } = require("./object-utils");

// Test with a simple object
const user = {
  Name: "John",
  AGE: 30,
  Email: "john@example.com"
};

console.log("Original object:");
console.log(user);

console.log("\nObject with lowercase keys:");
console.log(lowerizeKeys(user));

// Test with a nested object
const nestedObject = {
  User: {
    Name: "John",
    Contact: {
      EMAIL: "john@example.com",
      PHONE: "123-456-7890"
    }
  }
};

console.log("\nNested object:");
console.log(nestedObject);

console.log("\nNested object with lowercase keys (shallow):");
console.log(lowerizeKeys(nestedObject));

console.log("\nNested object with lowercase keys (deep):");
console.log(deepLowerizeKeys(nestedObject));

Agora, vamos executar o arquivo de teste:

node test.js

Você deve ver uma saída semelhante a:

Original object:
{ Name: 'John', AGE: 30, Email: 'john@example.com' }

Object with lowercase keys:
{ name: 'John', age: 30, email: 'john@example.com' }

Nested object:
{
  User: {
    Name: 'John',
    Contact: { EMAIL: 'john@example.com', PHONE: '123-456-7890' }
  }
}

Nested object with lowercase keys (shallow):
{
  user: {
    Name: 'John',
    Contact: { EMAIL: 'john@example.com', PHONE: '123-456-7890' }
  }
}

Nested object with lowercase keys (deep):
{
  user: {
    name: 'John',
    contact: { email: 'john@example.com', phone: '123-456-7890' }
  }
}

Parabéns! Você criou com sucesso um módulo JavaScript reutilizável com funções para converter chaves de objeto para minúsculas. Este módulo agora pode ser importado em qualquer um de seus projetos JavaScript.

Resumo

Neste laboratório, você aprendeu como converter chaves de objeto para minúsculas em JavaScript. Você:

1. Explorou objetos JavaScript e como acessar suas chaves
2. Usou o método Object.keys() para obter todas as chaves de um objeto
3. Utilizou o método reduce() para transformar um objeto
4. Criou uma função para converter todas as chaves de um objeto para minúsculas
5. Aprimorou a função para lidar com objetos aninhados recursivamente
6. Criou um módulo JavaScript reutilizável com ambas as funções

Essas técnicas são úteis ao trabalhar com dados de diferentes fontes, onde a capitalização das chaves de objeto pode ser inconsistente. As funções que você criou podem ajudar a normalizar os dados e facilitar o trabalho com eles.

Você pode estender ainda mais esses utilitários adicionando mais funções, como:

• Converter chaves de objeto para maiúsculas
• Converter chaves para camelCase ou snake_case
• Filtrar objetos com base em critérios de chave ou valor
• Comparar objetos profundamente para igualdade

Continue praticando com objetos e sua manipulação para se tornar mais proficiente na programação JavaScript.