07_JavaScript之数据类型转换

最新推荐文章于 2024-07-16 16:43:05 发布

不掉发的程序员tj

最新推荐文章于 2024-07-16 16:43:05 发布

阅读量117

点赞数

文章标签：字符串 js javascript

本文链接：https://blog.csdn.net/weixin_44543513/article/details/107038641

版权

首先在复习一下JavaScript中的基本数据类型：

Number 数值类型
String 字符串类型
Boolean 布尔类型
Undefined 未定义类型
NULL 空类型

本篇文章将阐述类型与类型之间如何进行相互转换。

1.转换为字符串类型

方法一：对于Number类型和Boolean类型来说，可以通过变量名称.toString()的方式来转换。

    <script>
        //Number类型 通过变量名称.toString()的方式来转换
        let num = 100;
        console.log(num);
	    console.log("一开始num的数据类型是：" + typeof num);
        num = num.toString();
        console.log(num);
        console.log("使用了toString()后num的数据类型是：" + typeof num);

        //Boolean类型 通过变量名称.toString()的方式来转换
        let bl = true;
        console.log(bl);
        console.log("一开始bl的数据类型是：" + typeof bl);
        bl = bl.toString();
        console.log(bl);
        console.log("使用了toString()后bl的数据类型是：" + typeof bl);
    </script>

控制台运行结果(字符串显示为黑色字体)：
在这里插入图片描述

方法二：可以通过String(常量 or 变量)来转换。

    <script>
        // Number类型
        let num = 100;
        console.log("一开始num的数据类型是：" + typeof num);
        num = String(num);
        console.log("使用了String(num)后num的数据类型是：" + typeof num);

        // Boolean 布尔类型
        let bl = true;
        console.log("一开始bl的数据类型是：" + typeof bl);
        bl = String(bl);
        console.log("使用了String(bl)后bl的数据类型是：" + typeof bl);

        // Undefined 未定义类型
        let value;
        console.log("一开始bl的数据类型是：" + typeof value);
        value = String(value);
        console.log("使用了String(value)后value的数据类型是：" + typeof value);

        // NULL 空类型
        let a = null;
	    console.log("一开始bl的数据类型是：" + typeof a);
        a = String(a);
        console.log("使用了String(a)后a的数据类型是：" + typeof a);
    </script>

控制台运行结果：
在这里插入图片描述
方法三：可以通过变量 or 常量 + “” / 变量 or 常量 + ‘’

    <script>
        // Number类型
        let num = 100;
        console.log("一开始num的数据类型是：" + typeof num);
        num = num + "";
        console.log("使用了String(num)后num的数据类型是：" + typeof num);

        //Boolean 布尔类型
        let bl = true;
        console.log("一开始bl的数据类型是：" + typeof bl);
        bl = bl + "";
        console.log("使用了String(bl)后bl的数据类型是：" + typeof bl);

        //Undefined 未定义类型
        let value;
        console.log("一开始bl的数据类型是：" + typeof value);
        value = value + "";
        console.log("使用了String(value)后value的数据类型是：" + typeof value);

        //NULL 空类型
        let a = null;
        console.log("一开始bl的数据类型是：" + typeof a);
        a = a + '';
        console.log("使用了String(a)后a的数据类型是：" + typeof a);
    </script>

控制台运行结果：
在这里插入图片描述

2.转换为数值类型

方法一：通过Number(常量 or 变量)的方式来转换。

    <script>
        // String 类型
        let str = "123";
        console.log(str);
        console.log("一开始str的数据类型是：" + typeof str);
        str = Number(str);
        console.log("使用了Number(str)后str的数据类型是：" + typeof str);
        console.log(str);

        // Boolean 类型
        let flag = true;
        console.log(flag);
        console.log("一开始flag的数据类型是：" + typeof flag);
        flag = Number(flag);
        console.log("使用了Number(flag)后str的数据类型是：" + typeof flag);
        console.log(flag);

        //Undefined 未定义类型 
        let value;
        console.log(value);
        console.log("一开始value的数据类型是：" + typeof value);
        value = Number(value);
        console.log("使用了Number(value)后value的数据类型是：" + typeof value);
        console.log(value);

        // NUll 空类型
        let a = null;
        console.log(a);
        console.log("一开始a的数据类型是：" + typeof a);
        a = Number(a);
        console.log("使用了Number(a)后a的数据类型是：" + typeof a);
        console.log(a);
       
        // 空字符串转换
        console.log("空字符串转换成数值类型结果是：" + Number(" "));
    </script>

控制台运行结果：
在这里插入图片描述
方法二：通过数学运算中的+号和-号来转换。
本质: 就是调用了Number函数。虽然可以通过+/-使其他类型转换为数值类型，但是 - 会改变数值的正负性。

        // String 类型
        let str = "123";
        console.log(str);
        console.log("一开始str的数据类型是：" + typeof str);
        str = -str;
        console.log("使用了Number(str)后str的数据类型是：" + typeof str);
        console.log(str);

        // Boolean 类型
        let flag = true;
        console.log(flag);
        console.log("一开始flag的数据类型是：" + typeof flag);
        flag = -flag
        console.log("使用了Number(flag)后str的数据类型是：" + typeof flag);
        console.log(flag);

控制台结果：
在这里插入图片描述

方法三：通过parseInt(需要转换的字符串) / parseFloat(需要转换的字符串)来转换。

当需要转换的字符串中既带有数字又有字符，用方法一和方法二输出的均是NaN（Not a Number）。此时JavaScrip提供parseInt（）、**parseFloat（）**方法，需要注意的是，这两个方法都是从左到右提取数字，一旦遇到非数值就会停止，如果停止的时候还没有提取到数值，则返回NaN

parseInt（）取整
parseFloat（）取得小数

    <script>
        // String 类型
        let str = "123px";
        console.log(str);
        console.log("一开始str的数据类型是：" + typeof str);
        str = parseInt(str);
        console.log("使用了parseInt(str))后str的数据类型是：" + typeof str);
        console.log(str);

        let str2 = "3.14abc"
        console.log(str2);
        console.log("一开始str2的数据类型是：" + typeof str2);
        str2 = parseFloat(str2);
        console.log("使用了parseInt(str2))后str2的数据类型是：" + typeof str2);
        console.log(str2);

        let str3 = "3.14abc15926"
        console.log(str3);
        console.log("一开始str2的数据类型是：" + typeof str3);
        str3 = parseFloat(str3);
        console.log("使用了parseInt(str3))后str3的数据类型是：" + typeof str3);
        console.log(str3);

        let str4 = "abc15926"
        console.log(str4);
        console.log("一开始str4的数据类型是：" + typeof str4);
        str4 = parseFloat(str4);
        console.log("使用了parseInt(str4))后str4的数据类型是：" + typeof str4);
        console.log(str4);
    </script>

在这里插入图片描述

总结：
（1）将String类型转换为数值类型

     - 如果字符串中都是数值，那就正常转换
     - 如果字符串是一个空串" "/ ' '，那么转换之后是0
     - 如果字符串中不仅仅是数字，那么转换之后是NaN（例外看方法三）

（2）将Boolean类型转换为数值类型

     - true 转换之后是1
     - false 转换之后是0

（3）将undefined类型转换为数值类型

     -转换之后是NaN

（4）将null；类型转换为数值类型

     -转换之后是0

3.转换为布尔类型：通过Boolean(常量 or 变量)的方式来转换。

    <script>
        // String 类型
        let str = "123px";
        console.log(str);
        console.log("一开始str的数据类型是：" + typeof str);
        str = Boolean(str);
        console.log("使用了Boolean(str))后str的数据类型是：" + typeof str);
        console.log(str);

        let str5 = "";
        console.log(str5);
        console.log("一开始str的数据类型是：" + typeof str5);
        str5 = Boolean(str5);
        console.log("使用了Boolean(str5))后str5的数据类型是：" + typeof str5);
        console.log(str5);

        let str6 = "  "; //有空格
        console.log(str6);
        console.log("一开始str的数据类型是：" + typeof str6);
        str6 = Boolean(str6);
        console.log("使用了Boolean(str5))后str5的数据类型是：" + typeof str6);
        console.log(str6);

        // Number 类型
        let num = 123;
        console.log(num);
        console.log("一开始num的数据类型是：" + typeof num);
        num = Boolean(num);
        console.log("使用了Boolean(num))后num的数据类型是：" + typeof num);
        console.log(num);

        // undefined 类型
        let str3;
        console.log(str3);
        console.log("一开始num的数据类型是：" + typeof str3);
        str3 = Boolean(str3);
        console.log("使用了Boolean(str3))后str3的数据类型是：" + typeof str3);
        console.log(str3);

        // 空类型
        let str4 = null;
        console.log(str4);
        console.log("一开始str4的数据类型是：" + typeof str4);
        str4 = Boolean(str4);
        console.log("使用了Boolean(str4))后str4的数据类型是：" + typeof str4);
        console.log(str4);
    </script>

控制台结果：
在这里插入图片描述

总结：
（1）将String类型转换为布尔类型

     - 只要字符串中有内容都会转换为true，只有字符串中没有内容才会转换为false

（2）将Boolean类型转换为数值类型

     - 只有数值是0才会转换为false，其余转换为true
     - 如果是NaN也会转换为false

（3）将undefined类型转换为布尔类型

     -undefined转换之后为false

（4）将null；类型转换为数值类型

     -转换之后为false

再次总结：空字符串 / 0 / NaN / undefined / null 会转换成flase 其他都是true

不掉发的程序员tj

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
07_JavaScript之数据类型转换

首先在复习一下JavaScript中的基本数据类型：Number 数值类型String 字符串类型Boolean 布尔类型Undefined 未定义类型NULL 空类型本篇文章将阐述类型与类型之间如何进行相互转换。1.转换为字符串类型方法一：对于Number类型和Boolean类型来说，可以通过变量名称.toString()的方式来转换。 <script> //Number类型通过变量名称.toString()的方式来转换 let nu
复制链接

扫一扫