手记

04-JavaScript基础-数据类型转换

什么是数据类型转换

  • 将一个数据类型转换为其他的数据类型

    • 例如: 将Number类型转换为Boolean类型

    • 例如: 将Number类型转换为字符串类型

    • ... ...

将其它类型转换为字符串

调用被转换数据类型的toString()方法

        var num1 = 10;        var res1 = num1.toString(); // 重点
        console.log(res1); // 10
        console.log(typeof res1); // string

        var num2 = true;        var res2 = num2.toString(); // 重点
        console.log(res2); // true
        console.log(typeof res2); // string
  • null和undefined这两个值没有toString()方法,如果调用他们的方法,会报错

        var num3 = undefined;        var res3 = num3.toString(); // 报错
        console.log(res3);        var num4 = null;        var res4 = num4.toString(); // 报错
        console.log(res4);        var num5 = NaN;        var res5 = num5.toString();        console.log(res5); // NaN
        console.log(typeof res5); // String
  • 该方法不会影响到原变量,它会将转换的结果返回

        var num6 = 10;        var res6 = num6.toString();        console.log(typeof num6); // number
        console.log(typeof res6); // string
  • 数值类型的toString(),可以携带一个参数,输出对应进制的值(暂时不用了解, 讲到进制转换再回来看)

        var num7 = 20;        var res7 = num7.toString(2);        var res8 = num7.toString(8);        var res9 = num7.toString(10);        var res10 = num7.toString(16);        console.log(res7); // 10100
        console.log(res8); // 24
        console.log(res9); // 20
        console.log(res10); // 14

将被转换的数据传入String()函数中

  • String()函数存在的意义:

    • 有些值没有toString(),这个时候可以使用String()。比如:undefined和null

  • 对于Number和Boolean实际上就是调用的toString()方法

        var num1 = 10;        var res1 = String(num1); // 重点
        console.log(res1); // 10
        console.log(typeof res1); // string

        var num2 = true;        var res2 = String(num2); // 重点
        console.log(res2); // true
        console.log(typeof res2); // string
  • 对于null和undefined,就不会调用toString()方法(因为这两个哥们没有这个方法).而是在内部生成一个新的字符串

        var num3 = undefined;        var res3 = String(num3);        console.log(res3); // undefined
        console.log(typeof res3); // string

        var num4 = null;        var res4 = String(num4);        console.log(res4); // null
        console.log(typeof res4); // string

将被转换的数据和+""连接到一起

  • 任何数据和 +"" 连接到一起都会转换为字符串

  • 内部实现原理和String()函数一样

        var num1 = 10;        var res1 = num1 + "";        console.log(res1); // 10
        console.log(typeof res1); // string

        var num2 = true;        var res2 = num2 + "";        console.log(res2); // true
        console.log(typeof res2); // string

        var num3 = undefined;        var res3 = num3 + "";        console.log(res3); // undefined
        console.log(typeof res3); // string

        var num4 = null;        var res4 = num4 + "";        console.log(res4); // null
        console.log(typeof res4); // string

将其它类型转换为Number类型

将被转换的数据传入Number()函数中

  • 字符串 --> 数字

    • 如果是纯数字的字符串,则直接将其转换为数字

          var str1 = "123";    var res1 = Number(str1);    console.log(res1); // 123
          console.log(typeof  res1); // number
    • 如果字符串中有非数字的内容,则转换为NaN

          var str2 = "123ab";    var res2 = Number(str2);    console.log(res2); // NaN
    • 如果字符串是一个空串或者是一个全是空格的字符串,则转换为0

          var str3 = "";    var res3 = Number(str3);    console.log(res3); // 0
      
          var str4 = "    ";    var res4 = Number(str4);    console.log(res4); // 0
  • 布尔 --> 数字

    • true 转成 1

    • false 转成 0

          var bool1 = true;    var res5 = Number(bool1);    console.log(res5); // 1
      
          var bool2 = false;    var res6 = Number(bool2);    console.log(res6); // 0
  • null --> 数字 --> 0

        var str5 = null;    var res7 = Number(str5);    console.log(res7); // 0
  • undefined --> 数字 --> NaN

       var str6 = undefined;   var res8 = Number(str6);   console.log(res8); // NaN

将被转换的数据传入parseInt()函数中/parseFloat()函数中

  • Number()函数中无论混合字符串是否存在有效整数都会返回NaN

  • 利用parseInt()/parseFloat()可以提取字符串中的有效整数

  • 两者之前的区别是前者只能提取整数,后者可以提取小数

  • parseInt()提取字符串中的整数

    • 从第一位有效数字开始, 直到遇到无效数字

    • 如果第一位不是有效数字, 什么都提取不到, 会返回NaN

    • 第一个参数是要转换的字符串,第二个参数是要转换的进制

          var str7 = "300px";    var res9 = parseInt(str7);    console.log(res9); // 300
      
          var str8 = "300px250";    var res10 = parseInt(str8);    console.log(res10); // 300
      
          console.log(parseInt("abc123"));  //返回NaN,如果第一个字符不是数字或者符号就返回NaN
          console.log(parseInt(""));        //空字符串返回NaN,Number("")返回0
  • parseFloat提取字符串中的小数

    • 会解析第一个. 遇到第二个.或者非数字结束

    • 如果第一位不是有效数字, 什么都提取不到

    • 不支持第二个参数,只能解析10进制数

    • 如果解析的内容里只有整数,解析成整数

          var str9 = "20.5px";    var res11 = parseInt(str9);    console.log(res11); // 20
      
          var str10 = "20.5.5.5px";    var res12 = parseFloat(str10);    console.log(res12); // 20.5
  • 对非String使用parseInt()或parseFloat(), 会先将其转换为String然后在操作

        var str11 = true;        var res13 = parseInt(str11); // 这里相当于parseInt("true");
        console.log(res13); // NaN
        var res14 = Number(str11);        console.log(res14); // 1

进制转换

  • 什么是进制?

    • 是一种计数的方式,数值的表示形式

  • 常见的进制

    • 十进制、二进制、八进制、十六进制

  • 进制数字进位方法

    • 16进制就是逢16进1,但我们只有0~9这十个数字,所以我们用A,B,C,D,E,F这五个字母来分 别表示10,11,12,13,14,15。字母不区分大小写。

    • 书写形式:在前面加个0x或者0X,比如0x45

    • 书写形式:在前面加个0,比如045

    • 书写形式:需要以0b或者0B开头,比如0b101

    • 十进制 0、1、2、3、4、5、6、7、8、9 逢十进一

    • 二进制 0、1 逢二进一

    • 八进制 0、1、2、3、4、5、6、7 逢八进一

    • 十六进制 0、1、2、3、4、5、6、7、8、9、A、B、C、D、E、F 逢十六进一

  • 数一下方块的个数, 并用十进制,二进制,八进制,十六进制表示


  • 练习判断下列数字是否合理

00011  0x001  0x7h4  10.98  0986  .089-109+178  0b325  0b0010  0xffdc  -.003
  • 十进制转换二进制

    • 规律: 用需要转换的十进制/2取余然后倒叙

          9 / 2 = 4 = 1
          4 / 2 = 2 = 0
          2 / 2 = 1 = 0
          1 / 2 = 0 = 1
          结果1001
      
          var num = 0b1001;    console.log(num);    console.log(parseInt("1001", 2));
  • 二进制转换十进制

    • 规律: 从低位数开始, 用低位 * 2的多少次幂, 幂数从0开始递增

          1001
          1 * 2(0) = 1
          0 * 2(1) = 0
          0 * 2(2) = 0
          1 * 2(3) = 8
          结果: 1 + 0 + 0 +8 = 9
  • 二进制转换八进制

    • 因为八进制逢八进一

    • 规律: 三个二进制位代表一个八进制位, 只需要从低位开始将三个二进制位转换为十进制再链接起来

                 00 001 001
       结果:    0     1     1 = 011
       console.log(parseInt("011", 8)); // 9
  • 二进制转换十六进制

    • 因为十六进制逢十六进一

    • 规律: 四个二进制位代表一个十六进制位, 只需要从低位开始将事个二进制位转换为十进制再链接起来

              0001 1011
        结果:    1      b = 0x1b
        console.log(parseInt("0x1b", 16));// 27



作者:极客江南
链接:https://www.jianshu.com/p/a0334a7b905b


0人推荐
随时随地看视频
慕课网APP