8000 Fix getRed/setRed example to use HSL→RGB conversion by ShilpaG813 · Pull Request #42086 · mdn/content · GitHub
[go: up one dir, main page]
Skip to content

Fix getRed/setRed example to use HSL→RGB conversion #42086

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Nov 24, 2025
+4 −2
Merged

Fix getRed/setRed example to use HSL→RGB conversion #42086

Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
0058b67
fix: correct getRed()/setRed() example using HSL→RGB conversion (#42059)
ShilpaG813 Nov 24, 2025
573171f
Merge branch 'main' into fix-hsl-red-example-42059
ShilpaG813 Nov 24, 2025
17af7d7
Fix usage
Josh-Cena Nov 24, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Fix usage
  • Loading branch information
@Josh-Cena
Josh-Cena authored Nov 24, 2025
commit 17af7d779b22456577bff82da1c5988b0583925c
6 changes: 1 addition & 5 deletions files/en-us/web/javascript/guide/using_classes/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -313,22 +313,18 @@ class Color {
// values is now an HSL array!
this.values = rgbToHSL([r, g, b]);
}

getRed() {
// Convert HSL → RGB and return the red channel
return hslToRGB(this.values)[0];
}

setRed(value) {
// Convert HSL → RGB, update red channel, convert back to HSL
const rgb = hslToRGB(this.values);
rgb[0] = value;
this.values = rgbToHSL(rgb);
}
}

const red = new Color(255, 0, 0);
console.log(red.getRed()); // 255
console.log(red.values[0]); // 0; It's not 255 anymore, because the H value for pure red is 0
```

The user assumption that `values` means the RGB value suddenly collapses, and it may cause their logic to break. So, if you are an implementor of a class, you would want to hide the internal data structure of your instance from your user, both to keep the API clean and to prevent the user's code from breaking when you do some "harmless refactors". In classes, this is done through [_private fields_](/en-US/docs/Web/JavaScript/Reference/Classes/Private_elements).
Expand Down
0