RGB в массив

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

💡 Этот учебник переведен с английского с помощью ИИ. Чтобы просмотреть оригинал, вы можете перейти на английский оригинал

Введение

В этом практическом занятии мы изучим, как с помощью JavaScript преобразовать строку цвета rgb() в массив числовых значений. Практическое занятие проведет вас по шагам, необходимым для извлечения значений цвета из строки и их преобразования в массив. Это умение полезно для веб-разработки, особенно при работе с графикой и дизайном.


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("JavaScript")) -.-> javascript/AdvancedConceptsGroup(["Advanced Concepts"]) javascript(("JavaScript")) -.-> javascript/BasicConceptsGroup(["Basic Concepts"]) javascript/BasicConceptsGroup -.-> javascript/variables("Variables") javascript/BasicConceptsGroup -.-> javascript/data_types("Data Types") javascript/BasicConceptsGroup -.-> javascript/arith_ops("Arithmetic Operators") javascript/BasicConceptsGroup -.-> javascript/comp_ops("Comparison Operators") javascript/AdvancedConceptsGroup -.-> javascript/higher_funcs("Higher-Order Functions") subgraph Lab Skills javascript/variables -.-> lab-28657{{"RGB в массив"}} javascript/data_types -.-> lab-28657{{"RGB в массив"}} javascript/arith_ops -.-> lab-28657{{"RGB в массив"}} javascript/comp_ops -.-> lab-28657{{"RGB в массив"}} javascript/higher_funcs -.-> lab-28657{{"RGB в массив"}} end

Преобразование строки RGB в массив

Для преобразования строки цвета rgb() в массив значений следуйте шагам:

  1. Откройте Терминал/SSH и введите node, чтобы начать практиковаться в написании кода.
  2. Используйте String.prototype.match(), чтобы получить массив из 3 строк с числовыми значениями.
  3. Используйте Array.prototype.map() в сочетании с Number, чтобы преобразовать их в массив числовых значений.

Вот код, который вы можете использовать:

const toRGBArray = (rgbStr) => rgbStr.match(/\d+/g).map(Number);

Для тестирования функции вызовите ее с строкой цвета rgb() в качестве аргумента, как это показано ниже:

toRGBArray("rgb(255, 12, 0)"); // [255, 12, 0]

Резюме

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