Расширить шестнадцатеричное значение

Beginner

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

Введение

В этом практическом занятии мы изучим, как расширить трехзначный цветовой код до шестизначного с использованием JavaScript. Будем использовать методы массивов, такие как map(), split() и join(), а также slice(), чтобы удалить # из начала строки, если он присутствует. Это практическое занятие поможет вам понять, как манипулировать строками и массивами в JavaScript, чтобы получить желаемый результат.

Как расширить трехзначный цветовой код до шестизначного

Для практики программирования откройте Терминал/SSH и введите node. Вы можете использовать следующую функцию, чтобы расширить трехзначный цветовой код до шестизначного:

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

Для преобразования трехзначного шестнадцатеричного цветового кода в RGB в шестизначный формат следуйте этим шагам:

  • Используйте Array.prototype.map(), String.prototype.split() и Array.prototype.join(), чтобы объединить отображенный массив.
  • Используйте Array.prototype.slice(), чтобы удалить # из начала строки, так как оно добавляется один раз.

Вот несколько примеров:

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

Резюме

Поздравляем! Вы завершили практическое занятие по расширению шестнадцатеричного значения. Вы можете выполнить больше практических занятий в LabEx, чтобы улучшить свои навыки.