feat: Clarify the algorithm to be fully consistent with CSS clamp()
#3
Conversation
| @@ -14,31 +14,15 @@ A [clamping function](https://en.wikipedia.org/wiki/Clamping_(graphics)) constra | |||
|
|
|||
| The primary motivation for this function is to bring parity with the [CSS function][css-clamp] of the same name. It will be useful when using it in conjunction with the [CSS Painting API](https://developer.mozilla.org/en-US/docs/Web/API/CSS_Painting_API). | |||
|
|
|||
| ## Examples | |||
| That is, given `Math.clamp(VAL, MIN, MAX)`, it represents exactly the same value as `Math.max(MIN, Math.min(VAL, MAX))`. | |||
There was a problem hiding this comment.
| That is, given `Math.clamp(VAL, MIN, MAX)`, it represents exactly the same value as `Math.max(MIN, Math.min(VAL, MAX))`. | |
| That is, `Math.clamp(val, min, max)` is exactly equal to `Math.max(min, Math.min(val, max))`. |
There was a problem hiding this comment.
This is copied from the CSS specification, which I think makes it more terminological.
|
|
||
| - Nesting [`Math.min`][math-min] and [`Math.max`][math-max] calls | ||
|
|
||
| ```js | ||
| function clamp(number, minimum, maximum) { | ||
| return Math.min(Math.max(number, minimum), maximum); | ||
| function clamp(value, minimum, maximum) { |
There was a problem hiding this comment.
Following the implementation, I think it should be val, min and max everywhere. Do they name it value in the spec more often?
There was a problem hiding this comment.
The specification uses highest and lowest: https://tc39.es/ecma262/multipage/numbers-and-dates.html#sec-math.max
Do we need to change to these two keywords?
| } | ||
|
|
||
| return number; | ||
| } |
There was a problem hiding this comment.
We should keep the alternative implementations so that we may demonstrate their inefficacy. We should be listing both orderings of the max and min function.
Do you mean to keep this function?
There was a problem hiding this comment.
Yes, we should keep this function in the readme for the purpose of demonstration
| @@ -14,31 +14,15 @@ A [clamping function](https://en.wikipedia.org/wiki/Clamping_(graphics)) constra | |||
|
|
|||
| The primary motivation for this function is to bring parity with the [CSS function][css-clamp] of the same name. It will be useful when using it in conjunction with the [CSS Painting API](https://developer.mozilla.org/en-US/docs/Web/API/CSS_Painting_API). | |||
There was a problem hiding this comment.
I'm skeptical of the use of CSS behavior here, which is probably not available in ES from a programming language level.
I invite @hax experts to come and give further guidance.
There was a problem hiding this comment.
It appears that the motivation behind this proposal is to provide a similar functionality to the CSS function clamp in JavaScript. However:
- The JavaScript version of
clampdoes not support CSS units. And it seems JS will never support them because of the death of https://github.com/tc39/proposal-extended-numeric-literals . - The parameter order in the draft JavaScript version is
(value, min, max), whereas the CSS version is(min, value, max), which is quite confusing. - The CSS version's prioritization of the minimum value is based on accessibility needs in CSS practices. However, this behavior might not be easily mapped to general-purpose programming languages, as pointed out in this pull request. It seems to be quite inconsistent with the behavior of other programming languages.
|
Will revisit once we have figured out what we actually want the argument names and order to be. |
Note: This may not be the same as other languages, e.g. in C++, C#, Rust, an error is thrown when
MINis greater thanMAX.C#
Rust