JavaScript中字符串与数字的转换

1.数字转为字符串

1.1 拼接空字符串

let num1 = 123;
  let str1 = num1 + "";
  console.log(str1); // 输出 "123"

1.2 使用toString方法

let num = 123;
let str = num.toString();
console.log(str); // "123"

1.3 String方法

let num3 = 123;
let str3 = String(num3);
console.log(str3); // 输出 "123"

1.4 toString vs String

a.定位不同:
String是js全局上的一个方法:

window.hasOwnProperty('String')  //true

toString方法是Object原型上的一个方法：

Object.prototype.toString()

b.toString()不能转化null,undefined:
toString()只能转化普通的数字,字符串,布尔值,日期值:

let a =123
let b=true
let c=new Date()
let d={}
let e=[1,2,3]
console.log(a.toString())//'123'
console.log(b.toString())//'true'
console.log(c.toString())//一个时间字符串,Thu Oct 03 2024 19:57:09 GMT+0800 (中国标准时间)
console.log(d.toString())//'[object object]'
console.log(e.toString()) //'1,2,3'
//不能转化null,undefined,

String()几乎可以转化任何变量,最少不会报错：

console.log(String([]))//''
console.log(String([1,2,3]))//'1,2,3'
console.log(String(null))//'null'
console.log(String(undefined))//'undefined'
console.log(String({}))//'[object Object]'

c.toString()可以转化数字时可以带进制:

let x=12
console.log(x.toString(2))//'1100'
console.log(x.toString(4))//'30'
console.log(x.toString(8))//'14'

2.字符串转为数字

2.1 Number方法

//number方式
var a = 1;
var b = '100';
var c = 'abcd';
var d = false;
var e = undefined;
var f = null;
console.log(Number(a));   // 输出为数字1
console.log(Number(b));   // 输出为数字100
console.log(Number(c));   // 输出为NaN （not a number 不是一个数字）
console.log(Number(d));   // 输出为数字0(0代表false)
console.log(Number(e));   // 输出为NAN
console.log(Number(f));   // 输出为数字0（Null代表0）

如果变量无法转为正常的数字类型，就会被转为NaN，NaN是数字类型，代表不是一个数字。

2.2 parseInt方法

//parseInt方式
var x;
var y = null;
var z = false;
console.log(parseInt('100'));// 输出数字 100
console.log(parseInt('100.23'));// 输出数字 100
console.log(parseInt('abdc'));// 输出数字 NaN
console.log(parseInt('100.34'));// 输出数字 100
console.log(parseInt('abc100.34'));// 输出 NaN
console.log(parseInt(x));           // 输出 NaN
console.log(parseInt(y));           // 输出 NaN
console.log(parseInt(z));           // 输出 NaN

parseInt方法会从左往右开始匹配，保留字串中以数字开始的部分，并且取整数；如果开头字符串不是数字则转为NaN，null、false、undefined等特殊值也输出NaN。

2.3 parseFloat方法

console.log(parseFloat('100.33'));    // 输出数字 100.33
console.log(parseFloat(100.33));    // 输出数字 100.33
console.log(parseFloat(90));    // 输出数字 90
console.log(parseFloat('2cdef'));   // 输出数字 2
console.log(parseFloat('cd5f'));    // 输出 NaN
console.log(parseFloat('cdef'));    // 输出 NaN
console.log(parseFloat(undefined));   // 输出 NaN
console.log(parseFloat(null));    // 输出 NaN

parseFloat和parseInt类似，区别是parseFloat会保留下小数部分。

2.4 使用算术运算符转化

根据隐式类型转换规则(之前我在https://blog.youkuaiyun.com/fageaaa/article/details/145670792中的5.2部分有对这部分知识进行讲解):减法、乘法、除法三者的规则是把非Number类型转为Number类型进行运算;而加法运算遵守以下 3 条规则,优先级从高到低

• 当一侧为 String 类型,被识别为字符串拼接,并会优先将另一侧转换为字符串类型。
• 当一侧为 Number 类型,另一侧为原始类型,则将原始类型转换为 Number 类型。
• 当一侧为 Number 类型,另一侧为引用类型,将引用类型和 Number 类型转换成字符串后拼接。

  //使用算数运算符转化
  let number1 = '90';
  console.log(+number1);      // 取正数输出数字 90
  console.log(-number1);      // 取负数输出数字 -90
  console.log(number1 * 0);   // 输出数字0
  console.log(number1 - 0);   // 输出数字90
  console.log(number1 + 0);   // 注意number1 + 0 输出字符串900，不是数字