前端-JavaScript1-6——JavaScript之变量类型的转换

6.1 string → number

先来学习一个语句，这个语句和alert差不多，也是弹窗，弹的是输入框：

1 prompt("请输入你的电话","139");

这些小功能，就叫做程序给我们提供的API，每个API都有自己不同的语法。

1 prompt(“提示文本”,”默认值”);

默认值可以省略。

可以把用户输入的值，存入变量：

1 var a = prompt("请输入你的电话","139");

2 alert("哈哈，你输入的电话是" + a);

用prompt接收的任何东西都是字符串，哪怕用户输入了一个数字，也是字符串的数字。

好了，下面附上代码

prompt的样子

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>Document</title>
    <script type="text/javascript">
        // 输入框
        // 第一步先让输入电话号码，存入变量
        // var a = prompt("请输入你的电话","139");
        // //第二步显示用户输入的电话
        // alert("哈哈，你输入的电话是" + a);
 
        //计算器
        //第1步让用户先输入第1个数字
        var a = prompt("请输入第1个数字啊");
        //第2步让用户先输入第2个数字
        var b = prompt("请输入第2个数字啊啊");
        //第3步求和
        var sum = parseFloat(a) + parseFloat(b);
        //第4步弹出结果
        alert(sum);
    </script>
</head>
<body>
 
</body>
</html>

有一些方法可以将内存中表示一个数字的字符串转换为对应的数字

parseInt()和parseFloat()。

parseInt就是将一个string转为一个整数，不四舍五入，直接截取整数部分。如果这个string有乱七八糟的东西，那么就截取前面数字部分。

1 var a = "123";

2 var b = parseInt(a); //parseInt就把字符串123转为数字123了

3 console.log(b);

4 console.log(typeof b);

下面的实例结果都是123，最后一个是-123：

1 parseInt("123") //123

2 parseInt("123.6") //123

3 parseInt("123年都会很爱你") //123

4 parseInt("123年11月") //123

5 parseInt("123px") //123

6 parseInt("-123.99999999") //-123

parseInt()不仅仅能够进行一个转为整数，更能进行一个进制的转换，把任何进制的数字，都换为10进制。

进制和要转换的字符串，用逗号隔开。

下面的运算结果都是15：

1 parseInt(15,10)

2 parseInt(17,8)

3 parseInt(1111,2)

4 parseInt("0xf",16)

5 parseInt("f",16)

6 parseInt(16,9)

7 parseInt("15e6",10)

8 parseInt("15*6",10)

parseInt如果不能转，那么就返回NaN

1 parseInt("Hello", 8);

2 parseInt("546", 2);

3 parseInt("三百六十五");

得到NaN的方法又多了一种，上午讲的是6/0得到Infinity。0/0得到NaN。

parseInt的样子

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>Document</title>
    <script type="text/javascript">
        // var a = "123";
        // var b = parseInt(a);    //parseInt就把字符串123转为数字123了
        // console.log(b);
        // console.log(typeof b);
 
        // console.log(parseInt("123"));    //123
        // console.log(parseInt("123.6"));     //123
        // console.log(parseInt("123年都会很爱你"));     //123
        // console.log(parseInt("123年11月"));        //123
        // console.log(parseInt("123px"));        //123
        // console.log(parseInt("-123.99999999")); //-123
 
        // 下面的结果都是15
        // console.log(parseInt(15,10));
        // console.log(parseInt(17,8));
        // console.log(parseInt(1111,2));
        // console.log(parseInt("0xf",16));
        // console.log(parseInt("f",16));
        // console.log(parseInt(16,9));
        // console.log(parseInt("15e6",10));
        // console.log(parseInt("15*6",10));
 
        //NaN
        console.log(parseInt("三百六十五"));
    </script>
</head>
<body>
 
</body>
</html>

parseFloat就是将字符串转为浮点数

尽可能的将一个字符串转为浮点数，浮点数之后如果有乱七八糟的内容，直接舍弃。

1 <script type="text/javascript">

2 var a = "123.67.88";

3 var b = parseFloat(a);

4 console.log(b);

5 </script>

也就是说，数字类型都是number，不分整数和浮点数，但是转换的时候分。

parseFloat的样子

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>Document</title>
    <script type="text/javascript">
        // var a = "123.67.88";
        // var b = parseFloat(a);
        // console.log(b);
 
        console.log(parseFloat("123.67年"));        //123.67
        console.log(parseFloat("哈哈123.67年"));    //NaN
 
    </script>
</head>
<body>
 
</body>
</html>

5.2 number →
string

将一个数字，与一个空字符串进行连字符运算，那么就是自动转为字符串了。

1 var a = 123;

2 var b = a +
"";

3 console.log(b);

4 console.log(typeof b);

转型的样子

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>Document</title>
    <script type="text/javascript">
        var a = 123;
        var b = a + "";
        console.log(b);
        console.log(typeof b);
    </script>
</head>
<body>
 
</body>
</html>

over，next！