Incorporating arguments within the context of a "for each" loop

Question

Incorporating arguments within the context of a "for each" loop

I'm attempting to develop a straightforward script that converts RGB-16 colors to RGB-8. The script is functioning properly, but I'm having trouble converting it into a function that can handle two different palettes. Whenever I try using palette.forEach, an error occurs. It seems like a simple issue, but I just can't seem to find the source of the problem.

const system41 = [
  [65535, 65535, 65535],
  [64512, 62333,  1327],
  [65535, 25738,   652]
];

const system7 = [
  [65535, 65535, 52428],
  [65535, 52428, 39321],
  [52428, 39321, 26214]
];

function convert(palette) {
    palette.forEach((child) => {
        const rgb8 = child.map(value => Math.round(value / 257));
        document.querySelector('#' + palette).innerHTML += rgb8.join(', ') + '\n';
    });
}

convert('system41');
convert('system7');

<p>System 4.1 system colors</p>
<pre id="system41"></pre>

<p>System 7 icon colors</p>
<pre id="system7"></pre>

javascript function

Answer 1

Answer №1

Organize your arrays within an object for efficient string-based searches.

const palettes = {
  system41: [
    [65535, 65535, 65535],
    [64512, 62333, 1327],
    [65535, 25738, 652]
  ],
  system7: [
    [65535, 65535, 52428],
    [65535, 52428, 39321],
    [52428, 39321, 26214]
  ]
};

function convert(palette) {
  palettes[palette].forEach((child) => {
    const rgb8 = child.map(value => Math.round(value / 257));
    document.querySelector('#' + palette).innerHTML += rgb8.join(', ') + '\n';
  });
}

convert('system41');
convert('system7');

<p>System 4.1 color scheme</p>
<pre id="system41"></pre>

<p>System 7 interface colors</p>
<pre id="system7"></pre>

Answer 2

Organize your arrays within an object for efficient string-based searches.

const palettes = {
  system41: [
    [65535, 65535, 65535],
    [64512, 62333, 1327],
    [65535, 25738, 652]
  ],
  system7: [
    [65535, 65535, 52428],
    [65535, 52428, 39321],
    [52428, 39321, 26214]
  ]
};

function convert(palette) {
  palettes[palette].forEach((child) => {
    const rgb8 = child.map(value => Math.round(value / 257));
    document.querySelector('#' + palette).innerHTML += rgb8.join(', ') + '\n';
  });
}

convert('system41');
convert('system7');

<p>System 4.1 color scheme</p>
<pre id="system41"></pre>

<p>System 7 interface colors</p>
<pre id="system7"></pre>

Incorporating arguments within the context of a "for each" loop

Answer №1

Similar questions

Acquiring JSON data within a JavaScript function using PHP

Is there a way to eliminate the # sign from hash data using jQuery?

The search box output will be the same as the JSON result

Issue "cannot update headers after they have been sent"

activating the submit button depending on the user input

Utilizing Ionic for local data retention

When the submit button on the signup form is pressed, two distinct actions are activated to achieve specific outcomes

Integrating objects into the <select> element through the combination of C#, JavaScript, and HTML connected to a SQL

Retrieving Posts from Extensive JSON Data

Locate all buttons on the page that have an onclick function attached to them, and

dojo combobox with data loaded dynamically from JSON

Display a popup notification when clicking in Angular 2

Using JavaScript to apply styling on images with overlays

The usage of Angular Tap is no longer recommended or supported

The $resources headers have not been updated

Oops! We encountered an issue trying to find the "list" view in the views directory

Creating a seamless vertical marquee of several images that continuously scroll from bottom to top without interruption can be achieved by following these

Ways to create auto-suggest recommendations that exceed the boundaries of the dialogue container

What is the best way to retrieve data from app.post within react.js?

Can I restrict access to all routes except one in vue-router? Is this a safe practice? Should I explore alternative methods for achieving this?