Estender Valor Hexadecimal

Beginner

This tutorial is from open-source community. Access the source code

Introdução

Neste laboratório, exploraremos como estender um código de cor de 3 dígitos para um código de cor de 6 dígitos usando JavaScript. Usaremos métodos de Array como map(), split() e join(), juntamente com slice() para remover o # do início da string, se presente. Este laboratório ajudará você a entender como manipular strings e arrays em JavaScript para obter a saída desejada.

Como Estender um Código de Cor de 3 Dígitos para um Código de Cor de 6 Dígitos

Para praticar a codificação, abra o Terminal/SSH e digite node. Você pode usar a seguinte função para estender um código de cor de 3 dígitos para um código de cor de 6 dígitos:

const extendHex = (shortHex) =>
  "#" +
  shortHex
    .slice(shortHex.startsWith("#") ? 1 : 0)
    .split("")
    .map((x) => x + x)
    .join("");

Para converter um código de cor hexadecimal RGB de 3 dígitos para a forma de 6 dígitos, siga estes passos:

  • Use Array.prototype.map(), String.prototype.split() e Array.prototype.join() para juntar o array mapeado.
  • Use Array.prototype.slice() para remover # do início da string, já que ele é adicionado uma vez.

Aqui estão alguns exemplos:

extendHex("#03f"); // '#0033ff'
extendHex("05a"); // '#0055aa'

Resumo

Parabéns! Você concluiu o laboratório de Extensão de Valor Hexadecimal. Você pode praticar mais laboratórios no LabEx para aprimorar suas habilidades.