绝对定律：在JavaScript中使用Math.abs，parseInt和parseFloat

Dealing with numbers in JavaScript can be tricky. Received values don’t always fall inside expected ranges; sometimes they’re negative when you expect positive results. Sometimes they’re not even cast as numbers. Dealing with these conditions, and converting strings into useful numerical results, often falls to s method - Math.abs() - and two functions: parseInt and parseFloat.

用JavaScript处理数字可能很棘手。 接收到的值并不总是在预期范围内。 有时，当您期望获得积极的结果时，它们就是负面的。 有时甚至没有将其转换为数字。 处理这些条件并将字符串转换成有用的数值结果通常属于s方法Math.abs()和两个函数： parseInt和parseFloat 。

Math.abs() (Math.abs())

Math.abs() returns the absolute value of a number - i.e. the number as a positive - without otherwise altering its value. Useful when working with results that may be negative, but which you need to be positive. In the console:

Math.abs()返回数字的绝对值 ，即该数字为正数，而不会更改其值。 在处理可能为负数但需要为正数的结果时很有用。 在控制台中 ：

var newVal = -57.64;
Math.abs(newVal);

> 57.64

Math.abs(0) will always return 0; -Math.abs(num) (note the minus sign at the start) will always return the provided number as a negative.

Math.abs(0)将始终返回0 ； -Math.abs(num) (注意开头的减号)将始终将提供的数字作为负数返回。

parseInt (parseInt)

As I’ve previously discussed, JavaScript treats values like "15" as a string, not a number. Results of numbers-as-strings are common when parsing CSS with JavaScript, or gaining values from an ill-prepared array. Results aren’t always this clean, either: receiving strings like “17px” is not uncommon. The issue is how to convert that into an actual value for use in calculations.

正如我之前讨论的那样，JavaScript将"15"类的值视为字符串 ，而不是数字。 当使用JavaScript解析CSS或从准备不好的数组中获取值时，数字字符串化的结果很常见。 结果也不总是那么干净：接收“ 17px”之类的字符串并不罕见。 问题是如何将其转换为用于计算的实际值。

Into this role steps parseInt, an automatic “cleaner” function that converts text that contains numbers into logical numerical values. The text used in parseInt should always be paired with a radix: the base of the number that the text should be converted into. On most occasions this will be 10 (i.e. the base of the ordinary counting numbers you use every day), but not all browsers assume this, so it needs to be specified.

角色parseInt扮演了这个角色，这是一个自动的“清除器”功能，可将包含数字的文本转换为逻辑数值 。 中所用的文本parseInt的数量的基础 ，该文本应被转换成：应始终基数配对。 在大多数情况下，该值为10 (即您每天使用的普通计数的基数)，但并非所有浏览器都假定为10，因此需要指定它。

Returning to my earlier example of rotating an element to touch and mouse positions: I found the center of an element with code like this:

回到我之前的旋转元素到触摸和鼠标位置的示例：我找到了一个元素的中心，其代码如下：

var elem = document.getElementById("elem1")
var centerPoint = window.getComputedStyle(elem).transformOrigin;

centerPoint might yield a result that looks like this:

centerPoint可能会产生如下所示的结果：

75px 75px

75px 75px

We can split() the result on the space between the values:

我们可以在值之间的空格处对结果进行split() ：

var centers = centerPoint.split(" "),

…but that still leaves the px as part of each string. To clean that up, we’ll use parseInt():

…但这仍然使px成为每个字符串的一部分。 为了清理它，我们将使用parseInt() ：

var centerX = parseInt(centers[0], 10);

…where 10 is the base, providing a value of 75 as a pure number. This result can then be used in calculations in JavaScript.

…其中10是基数，提供纯数字75的值。 然后可以将该结果用于JavaScript中的计算。

parseFloat (parseFloat)

parseFloat is the floating point equivalent of parseInt: it converts text into a number with decimal places. Again, it can be useful in parsing CSS and other tasks, especially when dealing with floating-point percentages:

parseFloat是parseInt的浮点等效项：它将文本转换为带小数位的数字。 同样，它在解析CSS和其他任务时很有用，尤其是在处理浮点百分比时：

var FP = "33.33333%";
console.log(parseFloat(FP));

> 33.33333

Note that parseFloat does not use or require a radix.

需要注意的是parseFloat 不使用或需要一个基数。

结论 (Conclusion)

While parseInt() and parseFloat() are extremely useful and powerful functions with some degree of “intelligence”, it’s important to test a range of expected values against parsed results, to ensure they yield usable numbers.

尽管parseInt()和parseFloat()是非常有用且功能强大的函数，并且具有一定程度的“智能”，但重要的是要根据已解析的结果测试一系列期望值，以确保它们产生可用的数字。

翻译自: https://thenewcode.com/1130/The-Law-of-Absolutes-Using-Mathabs-parseInt-and-parseFloat-in-JavaScript