DEV Community: Cristian Magalhães

O que é CQRS?

Cristian Magalhães — Wed, 11 Jun 2025 17:48:51 +0000

Eae gente bonita, beleza? Durante meus estudos sobre EDA (Event Driven Architecture) ou Arquitetura orientada a eventos eu esbarrei com a sigla CQRS, que a gente acaba vendo com uma certa frequência em posts pela internet, então resolvi trazer um post dedicado a ela.

O que é

A sigla CQRS significa Command Query Responsibility Segregation, que traduzindo para o português seria separação de responsabilidade de comando e consulta. De forma bem simples, o CQRS propõe separar as operações feitas pelo software entre comandos e consultas.

Vamos às definições, no contexto do CQRS um comando é toda operação que muda o estado, ou seja, update, delete, insert, qualquer comando de escrita. Enquanto uma consulta o nome diz por si só, é apenas uma consulta nos dados.

Para que serve

De forma simples e direta você vai usar o CQRS para segregar comandos e consultas buscando desempenho, pois é comum aliado ao CQRS que você também tenha um banco apenas para consulta e um banco apenas para alterações ou comandos no caso. Porém, não significa que ao usar CQRS você deve trabalhar com dois bancos de dados dessa forma.

Conclusão

Esse texto ficou muito mais curto do que gostaria, porém, a explicação do que é CQRS é bem mais simples do que eu imaginava. Muito do conteúdo que achei usava CQRS e mais alguma coisa para explicar o mesmo, o que acabava atrapalhando um pouco, a meu ver. Então gostaria de deixar esse texto direto e compacto, espero que tenha te ajudado!

Fontes

CQRS em 10 minutos // Dicionário do Programador

O que é CQRS e quando utilizar?

Se chegou até aqui, me segue la nas redes vizinhas.

Desvendando SQL: Procedures

Cristian Magalhães — Thu, 20 Mar 2025 11:08:39 +0000

Eae gente bonita, tudo bem com vocês? Continuando nossa série de publicações, hoje nós vamos falar sobre procedures!

O que é?

Procedures ou store procedures, é um conjunto de comandos tal qual funções que são armazenados e executados quando necessários, recebendo parâmetros ou não. É comum ser utilizada muitas vezes para reduzir o tráfego na rede, melhorar o desempenho de um banco de dados, criar tarefas agendadas, diminuir riscos, criar rotinas de processamento, etc.

As procedures são consideradas seguras por muitos porque com o seu uso nenhuma aplicação tem necessidade de ter acesso direto as tabelas.

Procedure vs Function

Bom, se você me acompanha, deve ter lido ou visto que postei um artigo falando sobre como usar function no SQL, então para que você não saia daqui com mais dúvidas, vou explicar um pouco da diferença entre os dois.

Característica	Procedure	Function
Retorna valor?	Opcional (pode retornar conjunto de resultados)	Sim (obrigatório)
Modifica dados?	Sim (pode executar `INSERT`, `UPDATE`, `DELETE`)	Não (apenas leitura)
Pode ser chamada em `SELECT`?	Não	Sim
Uso principal	Executar processos complexos	Retornar um cálculo ou transformação

Como usar?

Agora vamos botar a mão na massa! Aqui vou deixar o link para que você possa criar o mesmo banco de dados que o meu.

Vamos a um exemplo bem simples, vamos criar uma procedure que altera o status de todas as tarefas para pending. Porém, o status antigo será passado por parâmetro.

create or replace procedure updateStatusToPending(oldStatus varchar(50))
language plpgsql
as $$
declare
    -- Declaração de variaveis
begin
    update todos set status = 'pending' where status = oldStatus;
end
$$;

Feito isso, agora nós temos uma procedure que altera todos os status para pending.

Diferente da function que usamos o select para chamar, aqui nós vamos usar a palavra-chave call como no exemplo abaixo:

call updateStatusToPending('completed')

Após rodarmos esse script e consultar o banco, veremos que não existe mais nenhum todo com status completed.

É importante pontuar que na sintaxe da procedure existe um local correto para a declaração de variáveis, as mesmas não podem ser criadas em qualquer momento no script.

Vamos finalizar excluindo a procedure do nosso banco com o comando abaixo:

drop procedure updateStatusToPending

Aqui finalizo esse breve texto sobre procedure, fique a vontade para mandar dúvidas e sugestões nos comentários.

Fontes

Introdução aos Stored Procedures no SQL Server

Se chegou até aqui, me segue la nas redes vizinhas.

Desvendando SQL: Views

Cristian Magalhães — Tue, 18 Mar 2025 11:54:23 +0000

Eae gente bonita, tudo bem com vocês? Seguindo a revisão de SQL, dessa vez vamos falar sobre Views, então pega um cafezinho e vamobora!

O que é?

Podemos chamar uma view de “tabela virtual”, por ser criada com base em uma query definida no momento da sua criação e toda vez que a view é consultada a query é rodada novamente trazendo o resultado da query definida na sua criação.

Como usar

Antes de começar vou deixar o aqui o link com os scripts para a criação do banco e também o seu diagrama abaixo:

Vamos criar uma view para ver todas as tarefas pendentes, para isso vamos usar o SQL abaixo:

CREATE OR REPLACE VIEW 
    user_pending_tasks --nome da view
AS -- após o as é inserido o SQL que irá alimentar essa view
    SELECT 
        u."name", 
        t.description, 
        t.id AS "todo id", 
        t.status 
    FROM 
        users u 
        INNER JOIN todos t ON t.user_id = u.id 
    WHERE 
        t.status = 'pending'

Após rodarmos esse script a view será que criada no nosso banco de dados e se consultarmos também o nosso diagrama poderemos ve-lá também.

Com a nossa view criada vamos executar da seguinte forma:

SELECT * FROM user_pending_tasks;

Então teremos o seguinte resultado:

Caso algum todo seja atualizado para completed ou qualquer outro status diferente de pending ao rodar a view novamente, o resultado mostrado será alterado.

Você também pode atualizar e até mesmo excluir uma view usando o comando DROP VIEW e ALTER VIEW.

Espero ter ajudado a entender o conceito das views e também ter dado uma base para saber quais caminhos percorrer agora e quando usa-lá.

Se chegou até aqui, me segue la nas redes vizinhas.

Desvendando SQL: Functions

Cristian Magalhães — Wed, 12 Mar 2025 16:51:05 +0000

Eae gente bonita, tudo bem com vocês? Continuando os posts sobre SQL hoje venho trazer para vocês o que é uma Function e como usa-lá.

O que é

Como o próprio nome diz uma Function é uma função em SQL que podemos declarar e rodar quando quiser, como, por exemplo, em uma trigger. Nesse caso as funções do SQL diferem somente a sintaxe das funções de uma linguagem de programação comum.

Assim como nas linguagens de programação que usamos no dia a dia, o SQL também tem algumas funções pré-definidas como funções de string, data e coisas do tipo.

Como usar

Vamos aprofundar um pouco mais e usar um exemplo bem simples.

CREATE FUNCTION somar(integer, integer) RETURNS integer
AS 'select $1 + $2;'
LANGUAGE SQL
RETURNS NULL ON NULL INPUT;

Aqui podemos ver como funciona a sintaxe de uma função SQL, a sua declaração começa com CREATE FUNCTION ou CREATE OR REPLACE FUNCTION caso você queira substituir uma função já existente no seu banco de dados. Em seguida vem o nome da função e os tipos dos parâmetros passados e também a sua quantidade. É importante observar também que o tipo de retorno é definido logo no início da declaração e esse pode um banco, ou mesmo fazer referência ao tipo de uma coluna em uma tabela.
As funções são definidas dentro do AS e os seus parâmetros são usados o número da posição, que foram declarados $1. Como no exemplo estou usando o PostgreSQL é necessário também informar a linguagem.

Exemplos

Vamos criar uma função simples. No caso abaixo irei criar uma função que lista todos as tarefas de um usuário.

Link com o script para criar o banco de dados aqui.

CREATE OR REPLACE FUNCTION getAllTodos(userId INT)
RETURNS TABLE (
    "title" varchar, 
    "description" TEXT, 
    "status" varchar
)
AS $$
    BEGIN
        RETURN QUERY SELECT
            "t"."title",
            "t"."description",
            "t"."status"
        FROM todos t
        inner join users u on u.id = t.user_id
        where u.id = userId;
    END;
$$ LANGUAGE plpgsql;

Após rodar esse script a função será criada no nosso banco, caso queira apagar e recriar basta rodar:

DROP FUNCTION getAllTodos

Agora vamos rodar a function, para rodar fazemos da seguinte forma:

SELECT * FROM getAllTodos(5)

E então teremos o seguinte resultado:

Bem simples não é mesmo? Claro que a abordagem desse texto é te dar uma base e ajudar a entender o que é cada coisa para que no futuro você tenha uma base melhor para fazer pesquisas e saber o que e quando deve usar algo. No final do texto vou deixar alguns links com mais detalhes.

Espero ter ajudado, caso tenha alguma dúvida fique a vontade para comentar!

Se chegou até aqui, me segue la nas redes vizinhas.

Fontes:

Desvendando SQL: Trigger

Cristian Magalhães — Thu, 27 Feb 2025 16:42:04 +0000

Eae gente bonita, tudo bem com vocês? Depois de um bom tempo sem escrever aqui resolvi voltar e trazer um pouco mais da minha trilha de estudos para vocês e a bola da vez é o SQL. Existem alguns termos e siglas que nós vemos com frequência, até mesmo usamos e muitas vezes não sabemos exatamente o que é, então separei alguns e vou trazer aqui para vocês nas próximas semanas. Sugestões de temas são sempre bem-vindas!

Bom como é de costume gosto sempre de passar pelo que é, para que serve e como esse é o meu primeiro post sobre SQL, eu vou dar uma breve introdução a sigla e depois trago um post mais detalhado sobre o assunto.

O que é SQL?

SQL = Structured Query Language é uma linguagem usada pelos bancos de dados para criação, modelagem e estruturação de banco de dados e também para manipulação dos dados dentro do banco. Sempre que ler ou ouvir o termo "banco sql" se refere a um banco que usa essa linguagem como padrão, apesar de em alguns casos os bancos terem algumas especifidades. Quando ler sobre bancos NoSQL, são bancos que NÃO usam a linguagem SQL por padrão como um MongoDB por exemplo.

Trigger

O que é

Trigger ou com uma tradução livre e direta "gatilho", são funções SQL que são pré programadas e executadas de acordo com uma alteração no banco de dados seja uma alteração de DML (Data Manipulation Language) ou DDL (Data Definition Language), sendo mais direto, você pode criar uma trigger que será executada antes ou depois de um INSERT, DELETE, TRUNCATE e UPDATE que são alterações nos dados do banco, como também pode fazer o mesmo para alterações na estrutura do banco de dados como em CREATE, ALTER e DROP

Na prática

Bom antes de mostrar o exemplo primeiro é importante deixar claro algumas coisas, o banco que usarei aqui será o PostgreSQL, ele cria a suas triggers de uma forma um pouco diferente dos demais bancos mas nada para se preocupar.

Script para criar o banco

O nosso banco:

Mãos a obra!

Primeiros nós vamos criar a função que será executada na trigger. Essa função é bem simples era irá adicionar a data de criação na coluna createdAt para cada usuário que for inserido na tabela.
É importante deixar claro que para esse tipo de caso existem formas MUITO mais simples e melhores de se fazer esse tipo de operação, mas para caso de estudo vamos seguir dessa forma.

CREATE OR REPLACE FUNCTION setData()
    RETURNS TRIGGER
    LANGUAGE PLPGSQL
    AS 
    $$
BEGIN
    update users set created_at = now() where id = new.id;
    RETURN NEW;
END;
$$

O que essa função faz? Bom basicamente ela atualiza a coluna created_at com a data do momento que está sendo executada.

Agora com a nossa função criada nós vamos associa-la a um trigger

create trigger setDataOnInsert
  after
insert
    on
    users
  for each row
 execute procedure setData();

O que esse codigo faz? Basicamente aqui nós estamos criando o trigger, ele será executa APÓS - AFTER um INSERT na tabela USERS (ON USERS) para cada linha inserida.

Agora vamos testar, basta rodar um insert, que a trigger será ativada

insert into users(name, email) values ('Cristian', 'cristian123122@email.com')

Agora vamos consultar e verificar se deu tudo certo.

Agora podemos filtrar ou apenas dar um select em todos os dados da base e veremos que o último registro inserido está com a coluna create_at preenchida

Espero ter ajudado, caso tenha alguma duvida fique a vontade para comentar!

Se chegou até aqui, me segue la nas redes vizinhas.

[Design Patterns] Trabalhando com Factories

Cristian Magalhães — Wed, 14 Aug 2024 14:50:15 +0000

Eae gente bonita, beleza?

Continuando nossos estudos e abrindo mais uma série de conteúdo por aqui, hoje irei falar sobre o design pattern Factory.

O que é um design pattern?

Começando do começo, um design pattern ou padrão de projeto é uma solução conhecida para um problema conhecido. Existem vários tipos de design patterns para se aprender e conhecer. Você não precisa saber todos de cabeça e cada detalhe de implementação, porém é importante que você conheça a existência e o problema que ele soluciona para saber o que e onde procurar. O site Refactoring Guru contém uma lista de padrões de projetos e suas explicações em português, recomendo muito que tenha ele salvo nos seus favoritos.

É muito importante saber trabalhar e conhecer padrões de projetos, pois assim nós usamos formas conhecidas de se trabalhar e deixamos de reinventar a roda, além de mantermos uma codebase mais organizada e fácil de se dar manutenção no futuro.

Tipos de padrões?

Existem tipos de padrões? Sério? Sim!! Como dito anteriormente, um padrão de projeto é uma solução conhecida para um problema conhecido e bom, existem vários tipos de problemas na área de T.I., na verdade, não falta problema. Então vou te apresentar os tipos de padrões de projetos.

Criacionais: Os padrões criacionais fornecem mecanismos de criação de objetos que aumentam a flexibilidade e a reutilização de código.
Estruturais: Os padrões estruturais explicam como montar objetos e classes em estruturas maiores, enquanto ainda mantém as estruturas flexíveis e eficientes.
Comportamentais: Os padrões comportamentais cuidam da comunicação eficiente e da atribuição de responsabilidades entre objetos.

O Padrão Factory

Bom agora que você já sabe o que é um padrão de projeto ou design pattern, vamos falar um pouco sobre o padrão em questão, o padrão Factory.

O padrão Factoryé um padrão criacional, ou seja, é uma forma de criar objetos. A tradução de Factory é fábrica, então não tem como ser mais claro que isso, um padrão usado para criar coisas.

A ideia do padrão Factoryé centralizar as dependências em um só lugar e expor apenas o que precisa ser realmente usado. Vamos a um exemplo. Eu crio um Factory para criar um UserService. Bom o que o userService precisa? De um repository para se comunicar com o banco de dados e das informações do banco para o repository se conectar e fazer as operações necessárias. Para fazer isso nós criamos uma Factory que busca e centraliza todas essas dependências e expõe o userService prontinho para usarmos como no exemplo abaixo.

class UserFactory {
    static async createInstance() {
        const db = new Database({ connectionString: 'mongodb://localhost:27017/test' }); // Criando conexão com o banco
        const dbConnection = await db.connect(); // Conectando ao banco
        const userRepository = new UserRepository({ dbConnection }); // Passando conexão do banco para o repository, pois o mesmo depende da conexão
        const userService = new UserService({ userRepository }); // Passando o repository para o service, pois o mesmo depende do repository
        return userService; // Retornar o service pronto para uso!
    }
}

Espero que tenha ficado claro o que é uma Factory para você! Se tiver alguma dúvida e sugestão, fique a vontade para comentar. Em breve trarei mais padrões de projetos para o blog.

Referências

Refactoring Guru

Se chegou até aqui, me segue la nas redes vizinhas.

Uma breve introdução a microsserviços

Cristian Magalhães — Mon, 05 Aug 2024 14:31:43 +0000

Eae gente bonita, beleza?

Estou me aprofundando mais em arquitetura e gostaria de começar falando sobre microsserviços. Vejo que é uma das arquiteturas mais usadas e requisitadas nas vagas hoje em dia. Então bora pegar um café e aproveitar a leitura!

O que são microsserviços

Quando comecei na área de desenvolvimento eu achava que um microsserviço era algo super complexo feito pelos deuses da programação, porém vamos começar desmistificando isso. Um microsserviço é apenas uma aplicação comum, como a API que você desenvolveu no seu curso de backend.

Acima eu peguei um exemplo da AWS, fazendo uma comparação entre a arquitetura de microsserviços e monólito. Aqui podemos perceber claramente como funciona um projeto que usa arquitetura de microsserviços, nele são criados vários projetos(API) onde cada API tem apenas uma responsabilidade, assim tornando ela micro então a ideia básica de se trabalhar com microsserviços é separar responsabilidades em projetos separados.

O que eles fazem

Bom existem alguns critérios para dizer se o projeto é ou não um microsserviços e iremos passar pelos eles agora:

1. Objetivo claro: Cada serviço tem que ter um objetivo claro, a aplicação não precisa ser necessariamente pequena. Porém, é importante que tem um objetivo claro para sua existência e sua responsabilidade no contexto que está inserida.

2. Forma um ecossistema: Todos os serviços juntos devem criar um ecossistema ou contexto como no exemplo acima. Cada serviço se complementa de forma indireta, o que resulta em uma aplicação completa. Um microsserviço jamais seria uma aplicação completa.

3. Autônomos: Eles são autônomos, ou seja, um serviço consegue fazer o seu trabalho mesmo que outro serviço caia. Caso o serviço de usuários caia, o de threads e posts irão continuar funcionando e fazendo o seu trabalho normalmente.

4. Comunicação: Se comunicam o tempo todo. Não é necessário ser de forma direta usando REST ou gRPC, por exemplo. Porém, é importante que eles se comuniquem e que um componha o outro. Vamos a um exemplo, o serviço de Posts precisa saber quem foi o usuário que enviou o post correto? Para isso eles se comunicam, por exemplo, para pegar informações complementares do usuário em questão que está enviando o post.

Considerações finais

Esse é apenas um post de introdução sobre microsserviços, irei continuar me aprofundando mais no assunto e trazer aqui para vocês.

Referências

O que são microsserviços? by AWS

Se chegou até aqui, me segue la nas redes vizinhas.

JavaScript: Alterando a prioridade de execução

Cristian Magalhães — Wed, 03 Jul 2024 12:13:45 +0000

Eae gente bonita, beleza? Continuando nossos estudos em JavaScript, dessa vez eu irei falar algo muito interessante que é "e se nós pudessemos colocar coisas na frente da nossa pilha de execução" ou de uma forma mais simples, alterar a ordem de execução das funções do JavaScript, maneiro né? Então hoje vou te passar algumas formas de fazer isso. Recomendo também que leia o post sobre callstack e também sobre pilha.

Tabela de conteúdo

A Callstack
Como alterar a ordem
Ordem de prioridade das funções
Referências

A Callstack

Antes de começarmos a alterar e colocar coisas como prioridade é importante entendermos o que é a callstack e para isso precisamos entender também o que é uma pilha. Tenho artigo explicando os dois eles vão estar no começo e no fim do post. Vamos dar uma passada bem rápida antes de começarmos: bom uma pilha é a exatamente como uma pilha de moedas ou roupas, o primeiro item a entrar é o último a sair e o ultimo a entrar é o primeiro a sair, da mesma forma como empilhamos moedas uma em cima da outra e depois tiramos a primeira de cima e assim por diante. A Callstack não é muito diferente disso porém ao invés de falarmos de moedas estamos falando de funções onde uma função vai chamando a outra.

Como alterar a ordem

Essa parte é de fato a mais simples. Para fazer isso nós temos as seguintes opções: process.nextTick, setImmediate, setTimeout e interval. E todas são executadas da mesma maneira, passando uma função de callback com as instruções que serão executadas.

Abaixo um exemplo:

const Event = require('node:events');
const event = new Event();
const eventName = 'counter';
event.on(eventName, msg => console.log('counter update', msg));

const myCounter = {
    counter: 0
};

const proxy = new Proxy(myCounter, {
    set: (target, propertyKey, newValue) => {
        console.log('proxy', { newValue, key: target[propertyKey] })
        event.emit(eventName, { newValue, key: target[propertyKey] })
        target[propertyKey] = newValue;
        return true;
    },

    get: (object, prop) => {
        // console.log('chamou', { object, prop });
        return object[prop];
    }
});

setInterval(function () {
    proxy.counter +=1

    if(proxy.counter === 10) clearInterval(this)
}, 200)

process.nextTick(() => {
    proxy.counter = 2;
});

Aqui nós temos um exemplo que usei também para aprender sobre o Proxy o tema do ultimo post, mas vai funciona bem. De forma simples esse exemplo conta de 0 a 10. Porém com a adição do process.nextTick o contador irá iniciar em 2 e não em 0 pois foi alterada a prioridade de execução.

Ordem de prioridade das funções

Acima eu citei 4 funções que alteram a prioridade na pilha de execução. Porém se ultilizarmos todas juntas existe uma ordem entre elas que será seguida, que é a seguinte:

process.nextTick
setImmediate
setTimeout
setInterval

É importante dizer que apesar do process.nextTick parecer a melhor função a ser usada, o seu uso não é recomendado sendo uma má prática, pois ela da prioridade total na pilha de execução atrapalhando o ciclo de vida do node.

Referências

Espero que tenha sido claro e tenha ajudado a entender um pouco mais sobre o assunto, fique a vontade para dúvidas e sugestões abaixo!

Se chegou até aqui, me segue la nas redes vizinhas.

JavaScript: Interceptando objetos com Proxy

Cristian Magalhães — Fri, 28 Jun 2024 11:58:31 +0000

Eae gente bonita, beleza? Continuando a nossa série de posts descobrindo novas funções no JavaScript dessa vez irei falar sobre o Proxy e como usar suas funções mais básicas para poder interceptar ações em objetos.

Tabela de conteúdos

Como assim interceptar?
Na prática
Conclusão
Referências

Como assim interceptar?

Bom caso você não saiba exatamente do que estou falando nós vamos "participar" ou melhor dizendo executar uma função entre o momento que a ação de ler ou atribuir valores é feita até a sua conclusão e para isso iremos ultilizar o objeto Proxy.

É importante dizer que não vou passar método a método do objeto. A ideia é conhecer ele e ir explorando conforme a necessidade.

Na prática

Vamos ao que interessa, executar o código e ver na prática tudo funcionando, abaixo vou colocar um trecho de código com o proxy interceptando as ações dos objetos e algumas explicações

const pessoa = {
    nome: 'Cristian',
    saldo: 0,
    idade: 25
};

const objetoComProxy = new Proxy(pessoa, {
    set: (target, propertyKey, newValue) => {
        console.log('set', { target, propertyKey, newValue })
        target[propertyKey] = newValue;
    },
    get: (object, prop) => {
        console.log('get', { object, prop })
        return object[prop]
    },
});

pessoa.saldo = 100 // nada acontece, nenhum log é mostrado

// primeiro o get será logado para buscar o valor da propriedade e em seguida o set
// pois estamos usando o objeto com proxy
objetoComProxy.saldo += 100; 
/**
 * LOG:
 * get { object: { nome: 'Cristian', saldo: 100, idade: 25 }, prop: 'saldo' }
    set {
    target: { nome: 'Cristian', saldo: 100, idade: 25 },
    propertyKey: 'saldo',
    newValue: 200
    }
 */

console.log(objetoComProxy.nome); // get { object: { nome: 'Cristian', saldo: 200, idade: 25 }, prop: 'nome' } e depois Cristian

É importante notar que apesar do objeto original ter sido alterado também as funções do Proxy não são executadas, apenas no objeto "proxyado".

Conclusão

Apesar de um texto bem simples a ideia de hoje foi poder conhecer sobre o Proxy e também aumentar a nossa caixa de ferramentas do JavaScript. Fique a vontade para deixar dúvidas e sugestões.

Referências

Proxy MDN

Espero que tenha sido claro e tenha ajudado a entender um pouco mais sobre o assunto, fique a vontade para dúvidas e sugestões abaixo!

Se chegou até aqui, me segue la nas redes vizinhas.

JavaScript: Trabalhando com Set

Cristian Magalhães — Tue, 25 Jun 2024 11:36:00 +0000

Eae gente bonita, beleza? Vamos continuar nos aprofundando nas estruturas do JavaScript e dessa vez vamos falar sobre o Set a estrutura de dado e não o número.

Tabela de conteúdo

O que é o Set?
Métodos
Exemplos
Conclusão
Referências

O que é o Set?

De forma simples e objetiva, o Set é um objeto que armazena valores de tipo primitivos até referência a objetos. Porém, o seu grande diferencial e trunfo é pelo fato de não armazenar items repetidos, assim, o Set se torna uma ótima opção para filtrar itens repetidos de uma lista.

Métodos

O Set é bem parecido com objeto Map, porém com uma diferença que muda muito a sua utilização a ausência do método get e isso se deve ao fato do objeto Map ser uma estrutura de chave-valor e o Set não. Logo, toda vez que você precisar encontrar um item dentro de um Set você precisará percorrer a lista toda.

Exemplos

Primeiro, vamos ver um exemplo do uso do Set para remover items duplicados de uma lista


const arr1 = ['0', '1', '2'];
const arr2 = ['2', '0', '3'];
const arr3 = arr1.concat(arr2); // -> [ '0', '0', '1', '2', '2', '3' ]

// Agora com o uso do Set

const set = new Set(); // vamos instanciar o set
// agora vamos adicionar cada item dos dois arrays a ele.
arr1.map(x => set.add(x)); 
arr2.map(x => set.add(x));

// resultado
console.log(Array.from(set)) // -> ['0', '1', '2', '3']

Viu como é simples? Sem necessidade de fazer uma iteração dentro da outra ou criar lógica desnecessária.

Vamos a mais um exemplo, dessa vez mostrando a diferença entre listas e também as interseções

const users01 = new Set([
    'cris',
    'joao',
    'vitor'
]);

const users02 = new Set([
    'matheus',
    'ney',
    'cris'
])

const intersection = new Set([...users01].filter(user => users02.has(user)))
console.log(intersection); // -> Set(1) { 'cris' }

const difference = new Set([...users01].filter(user => !users02.has(user)))
console.log(difference); // -> Set(2) { 'joao', 'vitor' }

Conclusão

Bom, nesse texto quis trazer um pouco sobre o Set para vocês, é importante dizer que não me aprofundo pois a ideia é não te transformar em um especialista do objeto mas sim te apresentar as ferramentas de formas simples e fácil, dessa forma você sempre vai saber o que fazer e pelo o que pesquisar para resolver os seus problemas.

Referências

Espero que tenha sido claro e tenha ajudado a entender um pouco mais sobre o assunto, fique a vontade para dúvidas e sugestões abaixo!

Se chegou até aqui, me segue la nas redes vizinhas.

Foto de Ferenc Almasi na Unsplash

JavaScript: O que é Symbol?

Cristian Magalhães — Wed, 19 Jun 2024 14:28:32 +0000

Eae gente bonita, beleza? Continuo a jornada de "aprofundamento" em JavaScript e quanto mais eu aprendo mais eu quero escrever e compartilhar com vocês. Dessa vez vou falar um pouco sobre o Symbol que para mim o motivo da sua existência sempre foi um mistério.

Tabela de conteúdos

O que é Symbol
Criando propriedades "privadas"
Mas por que "privado"
Symbols e comportamentos padrão
Referências

O que é Symbol

Começando do começo, o Symbol é um tipo primitivo no JavaScript, ele é usado para criar valores, funções privadas e até mesmo para interceptar um comportamento padrão de um objeto no JavaScript.

Mas não se esqueça de uma coisa, no JavaScript TUDO é objeto.

Apenas para confirmar que o symbol é um tipo primitivo

typeof Symbol("foo") === "symbol"; // true

Criando propriedades "privadas"

Com o Symbol podemos criar algumas propriedades quase privadas. Abaixo um exemplo

const uniqueKey = Symbol("userName");
const user = {};

user["userName"] = "value normal object";
user[uniqueKey] = "value from symbol";
console.log('getting object', user[uniqueKey]); // "value from symbol"
console.log('getting object', user["userName"]); // "value normal object"
console.log('getting object', user[Symbol("userName")]); // undefined

No exemplo nós criamos a uniqueKeycom o Symbolcom o valor userName e um objeto user. Primeiro colocamos um valor na propriedade user["userName"] e depois fazemos a mesma coisa com a propriedade user[uniqueKey] e você pode pensar, bom o symbol tem o mesmo valor que é userName, então o valor foi sobrescrito mas na verdade não. O Symbol cria um outro endereço de memória e uma propriedade diferente.
Ok, então se eu criar um Symbol com o mesmo valor eu consigo acessar? Errado novamente. Como disse o Symbol cria um novo endereço na memória logo o terceiro console log retorna undefined. Por isso que com ele nós podemos criar variáves e métodos privados, pois os mesmos só serão acessados se o Symbol usado for exportado junto.

Mas por que "privado"

Bom imagino que deve ter percebido o uso excessivo das aspas em privado isso acontece porque nós podemos saber quais são o symbols existentes. Vamos a mais um exemplo:

const uniqueKey = Symbol("userName");
const func = Symbol("soma");
const user = {};

user[uniqueKey] = "value from symbol";
user[func] = (n1, n2) => n1+ n2;

console.log('symbols', Object.getOwnPropertySymbols(user));// symbols [ Symbol(userName), Symbol(soma) ]

Como podemos ver no exemplo acima os Symbols desse objeto não são privados. Com um simples método do Object nós podemos ver o Symbols existentes, porém não podemos acessá-los ou ler suas implementações.

Symbols e comportamentos padrão

Com o Symbol nós podemos alterar alguns comportamentos padrão dos objetos, como por exemplo como um objeto será lido por uma função de iterator ou convertido para string.

Vamos aos exemplos!

const obj = {
    items: ['c', 'b', 'a'],
}

Para podermos ler o objeto acima em um iterator(for, forEach, map) nós precisariamos usar alguma função como Objeto.entries ou Object.keys para transformar as chaves em um array e ler propriedade por propriedade.

Mas e se quiséssemos que esse objeto fosse lido de forma correta por um iterator? Bom nós podemos mudar esse comportamento, como no exemplo abaixo

const obj = {
    [Symbol.iterator]: () => ({
        items: ['c', 'b', 'a'],
        next() {
            return {
                done: this.items.length === 0,
                value: this.items.pop()
            }
        }
    })
}

Dessa forma podemos apenas chamar uma função de iterator e o nosso objeto será lido sem problema algum. O mesmo vale para toString por exemplo e por ai vai. Caso queira saber recomendo pesquisar sobre prototypes no JavaScript.

Referências

Symbol - MDN

Espero que tenha sido claro e tenha ajudado a entender um pouco mais sobre o assunto, fique a vontade para dúvidas e sugestões abaixo!

Se chegou até aqui, me segue la nas redes vizinhas.

O que é strict mode no JavaScript?

Cristian Magalhães — Mon, 27 May 2024 12:59:23 +0000

E aí, gente bonita, beleza? Retomando os estudos em JS, hoje vou falar um pouco para vocês sobre o strict mode. Então pega um cafezinho e vem comigo.

Problemas da linguagem

Caso você seja novo na linguagem e não saiba, o JavaScript é uma linguagem muito poderosa e com ela você pode fazer muita coisa, mas quando eu digo muita coisa, é MUITA COISA mesmo. Coisas que não deveriam ser feitas. Costumo dizer que essa liberdade do JS é uma das melhores e piores coisas da linguagem.

Agora você me pergunta: que coisas são essas?

E aqui estou para te dizer alguns problemas da linguagem:

Pode atribuir valores a variáveis não declaradas.
Você pode usar o operador delete em variáveis e funções.
Nomes de parâmetros duplicados são permitidos fora do strict mode.

Caso queira ver mais alguns problemas da linguagem, recomendo a leitura do repositório What the f*ck JavaScript?. Conhecer os problemas da linguagem é tão importante quanto os seus pontos fortes.

Como eu resolvo isso?

Ok, realmente temos alguns problemas na linguagem, mas para evitar todos logo de cara você não precisa ler todo o repositório do What the f*ck JavaScript? de uma vez só. Você pode usar o famoso 'use strict'; no topo dos seus arquivos. Assim, você vai ativar o modo estrito para todo o arquivo e todos esses problemas da linguagem vão aparecer como erros no seu console e você vai poder resolvê-los antes de enviar para o ar!

É importante lembrar que muitas bibliotecas já usam o strict mode por debaixo dos panos, assim como compiladores como Babel e TypeScript. Então você deve se preocupar mais com o uso do strict mode quando for trabalhar com JS puro.

Conclusão

Dito tudo isso, hoje vimos que o nosso amado JS não é só feito de coisas boas, apesar de ainda serem muitas rsrs. Recomendo fortemente a leitura do repositório What the f*ck JavaScript? e, caso queira saber o que mais o modo estrito do JavaScript resolve, eu deixei alguns links de referências.

Referências

W3S Schools

Espero que tenha sido claro e tenha ajudado a entender um pouco mais sobre o assunto, fique a vontade para dúvidas e sugestões abaixo!

Se chegou até aqui, me segue la nas redes vizinhas.