JSFiddle - React, Tailwind, and code Playground
by thetenfold
JavaScript
// our constructor function
function Color(r, g, b) {
return {
get red() {
return r;
},
set red(value) {
// let's make sure we get a number here
if ( typeof value === 'number' && !isNaN(value) ) {
// check the range
if (value < 0) {
r = 0;
} else if (value > 255) {
r = 255;
} else {
r = value;
}
} else {
// this gets set if they don't pass a number
r = 255;
}
}
// other color methods here
};
}
// --------------------
var red = new Color(255, 0, 0);
alert(red.red); // 255
red.red -= 55; // assignment within range, success
alert(red.red); // 200
red.red -= 999; // assignment out of range, failure
alert(red.red); // 0
red.red += 999; // assignment out of range, failure
alert(red.red); // 255