当前位置:网站首页>How does JS convert strings to numbers

How does JS convert strings to numbers

2020-12-08 11:46:53 WindrunnerMax

Js How to convert a string to a number

Js There are three main ways to convert strings into numbers : Conversion function 、 Cast 、 Weak type implicit type conversion , There are three ways to use these transformations 5 Methods of conversion .

parseInt()

parseInt() and Number.parseInt() The most common way to convert a string into an integer is to convert it into an integer , among Number.parseInt() yes ES6 After that, static methods are added to reduce the definition of global methods , Substance and global approach parseInt() identical , Their rules are as follows :

  • Ignore the space before the string , Until you find the first non empty character .
  • If the first non null character is not a number or a sign, return NaN.
  • If the first is a numeric character, parse it all the way to a non numeric character .
  • If the first one is a numeric character , Can recognize various integer formats .
  • Accept the second parameter , That is, the cardinality used in the conversion .
  • Round the decimal down .
console.log(Number.parseInt(true));        // NaN
console.log(Number.parseInt(false));       // NaN
console.log(Number.parseInt(null));        // NaN
console.log(Number.parseInt(undefined));   // NaN
console.log(Number.parseInt(NaN));         // NaN
console.log(Number.parseInt("   123"));    // 123
console.log(Number.parseInt(" ab123"));    // NaN
console.log(Number.parseInt(""));          // NaN
console.log(Number.parseInt(" 31avs"));    // 31
console.log(Number.parseInt("0xF"));       // 15
console.log(Number.parseInt("070"));       // es3->56 es5->70
console.log(Number.parseInt("A", 16));     // 10
console.log(Number.parseInt("A"));         // NaN
console.log(Number.parseInt("51.2"));      // 51
console.log(Number.parseInt("-51.2"));     // -51

parseFloat()

parseFloat() and Number.parseFloat() Is the most commonly used method to convert a string to a floating-point number , among Number.parseFloat() yes ES6 After that, static methods are added to reduce the definition of global methods , Substance and global approach parseFloat() identical , Their conversion rules are as follows :

  • Ignore the space before the string , Until you find the first non empty character .
  • If the first non null character is not a number or a sign, return NaN.
  • If the first is a numeric character, parse it all the way to a non numeric character .
  • The first decimal point in a string is valid and the second decimal point is invalid .
  • Parse only 10 Base number , The second parameter... Is not accepted .
console.log(Number.parseFloat(true));            // NaN
console.log(Number.parseFloat(false));           // NaN
console.log(Number.parseFloat(null));            // NaN
console.log(Number.parseFloat(undefined));       // NaN
console.log(Number.parseFloat(NaN));             // NaN
console.log(Number.parseFloat("123"));           // 123
console.log(Number.parseFloat("  123.1"));       // 123.1
console.log(Number.parseFloat("  ab123.1"));     // NaN
console.log(Number.parseFloat(""));              // NaN
console.log(Number.parseFloat("  123.3.4eqw"));  // 123.3
console.log(Number.parseFloat("0xF"));           // 0

Number()

Number() The constructor returns a literal value , While using new Number() A numeric object is returned , Their conversion rules are as follows :

  • If it is Boolean value ,true and false Return respectively 1 or 0.
  • If it's a number , It's just simple incoming and returning .
  • If it is null, Then return to 0.
  • If it is undefined return NaN.
  • If it is a string and the string is empty, it returns zero , Ignore leading zeros .
  • If it is a string and the string is an integer, it returns an integer , Ignore leading zeros .
  • If it is a string and the string is a floating-point number, a floating-point number is returned .
  • If it is a string and the string is 16 Base number , To 10 Binary return .
  • Except for the above format, return NaN.
  • If it's an object , Call object's valueOf, Return the value according to the previous rule , If you return NaN, Call again toString(), Return the value according to the previous rule .
console.log(Number(true));        // 1
console.log(Number(false));       // 0
console.log(Number(null));        // 0
console.log(Number(undefined));   // NaN
console.log(Number(NaN));         // NaN
console.log(Number(""));          // 0
console.log(Number("123"));       // 123
console.log(Number("  123"));     // 123
console.log(Number("123.12"));    // 123.12
console.log(Number("0xF"));       // 15

An operation

Bit operation is the direct calculation of binary bits , It processes every bit directly , It's a very low-level operation , The advantage is extremely fast , The disadvantage is that it's not intuitive . Bit operations only work on integers , If an operand is not an integer , It will automatically change to an integer before running . stay JavaScript Inside , Most of the time the values are in terms of 64 Stored as a floating-point number , But when you do bit operations , In order to 32 Operating on signed integers , And the return value is also a 32 A signed integer .

console.log(~~(true));        // 1
console.log(~~(false));       // 0
console.log(~~(null));        // 0
console.log(~~(undefined));   // 0
console.log(~~(NaN));         // 0
console.log(~~(""));          // 0
console.log(~~("123"));       // 123
console.log(~~("  123"));     // 123
console.log(~~("123.12"));    // 123
console.log(~~("0xF"));       // 15

Unary operator

Unary operators can implicitly type strings , It's different from other parsing methods , If it's a NaN value , So what's back is NaN, Usually use + The operator , Because this way is not easy to confuse .

console.log(+(true));        // 1
console.log(+(false));       // 0
console.log(+(null));        // 0
console.log(+(undefined));   // NaN
console.log(+(NaN));         // NaN
console.log(+(""));          // 0
console.log(+("123"));       // 123
console.log(+("  123"));     // 123
console.log(+("123.12"));    // 123
console.log(+("0xF"));       // 15

A daily topic

https://github.com/WindrunnerMax/EveryDay

Reference resources

https://www.jianshu.com/p/7962deab3cea
https://juejin.im/post/6855129005897711624
https://blog.fundebug.com/2018/07/07/string-to-number/

版权声明
本文为[WindrunnerMax]所创,转载请带上原文链接,感谢
https://chowdera.com/2020/12/20201208114625862b.html