Sobes.tech
Junior

O que é um pipe no contexto do desenvolvimento web?

sobes.tech IA

Resposta da IA

No contexto do desenvolvimento web, especialmente em frameworks como Angular, o pipe é uma função que transforma os dados de entrada num formato desejado para exibição no template. Os pipes são usados para filtrar, formatar ou ordenar dados sem alterar o modelo de dados em si. Eles aumentam a reutilização do código e melhoram a legibilidade do template.

Exemplos de uso:

  • Formatação de datas: transformar um objeto Date numa string de formato específico (MM/dd/yyyy).
  • Formatação de moeda: adicionar o símbolo da moeda e formatar o número.
  • Alteração de caixa do texto: transformar o texto para maiúsculas ou minúsculas.
  • Filtragem de listas: mostrar apenas os elementos que atendem a certos critérios.
  • Ordenação de listas: ordenar os elementos.

Sintaxe de uso no template Angular:

<!-- Mostrar data no formato MM/dd/yyyy -->
<p>{{ someDate | date:'MM/dd/yyyy' }}</p>

<!-- Mostrar número como moeda -->
<p>{{ price | currency:'USD':'symbol':'1.2-2' }}</p>

<!-- Converter texto para maiúsculas -->
<p>{{ someText | uppercase }}</p>

Em outros contextos de desenvolvimento web (por exemplo, no backend com Node.js ou ao trabalhar com fluxos de dados), "pipe" pode referir-se a um mecanismo para passar a saída de um comando ou função como entrada para outro, permitindo encadear operações. Por exemplo, em Node.js, stream.pipe() é usado para transferir dados de um fluxo de leitura para um de escrita.

// Exemplo de uso de pipe em Node.js para copiar um arquivo
const fs = require('fs');

const readStream = fs.createReadStream('input.txt');
const writeStream = fs.createWriteStream('output.txt');

readStream.pipe(writeStream); // Transferir dados de readStream para writeStream

No entanto, o significado mais comum de "pipe" no desenvolvimento frontend, especialmente em frameworks modernos, está relacionado com a transformação de dados para exibição nos templates.