美文网首页
JS-转换类型

JS-转换类型

作者: 远方的路_ | 来源:发表于2018-11-07 01:37 被阅读0次

    转换为字符串类型

    • 将其它基本数据类型转换为字符串类型的第一种方式
      1. 对于Number类型和Boolean类型来说, 直接利用变量调用toString()方法即可
        toString()方法会将调用者转换为字符串, 并且会将转换后的结果返回给我们并且不会修改调用者原有的值。 toString()方法是可以接收参数的, 参数代表告诉解析引擎, 需要将Number类型转换为多少进制
        toString(2) 代表需要将调用者转换为2进制
        toString(8) 代表需要将调用者转换为8进制
        toString(16) 代表需要将调用者转换为16进制

      2. 对于null和undefined来说, 不能通过调用toString()方法来转换

    // number类型
    var num = 123;
    var res = num.toString();
    console.log(res); // 在谷歌浏览器中String类型输出之后是灰色的
    console.log(typeof res); // string
    console.log(num); // 在谷歌浏览器中Number类型输出之后是蓝色的
    console.log(typeof num);
    // Boolean布尔类型
    var flag = true;
    var res2 = flag.toString();
    console.log(res2);
    // null和 undefined
    var n = null;
    var res3 = n.toString(); // 会报错
    var u = undefined;
    var res4 = u.toString(); // 会报错
    
    • 将其它基本数据类型转换为字符串类型的第二种方式

      由于toString()方法不能将null, undefined转换为字符串. 所以就有了第二种方式, 将需要转换的数据传递给String()函数

    var num = 123;
    var res1 = String(num);
    console.log(res1);  // 123
    console.log(typeof res1); // string
    
    var flag = false;
    var res2 = String(flag);
    console.log(res2); // false
    
    var n = null;
    var res3 = String(n);
    console.log(res3); // null
    
    var u = undefined;
    var res4 = String(u);
    console.log(res4); // undefined
    
    • 将其它基本数据类型转换为字符串类型的第三种方式

      1. toString()方法只能将Number和Boolean类型转换为字符串
      2. String()函数可以将Number/Boolean/null/undefined转换为字符串

      3. 利用算数运算符的加法运算来换, Number/Boolean/null/undefined转换为字符串
      格式: 需要转换的数据 + " " ;

    var num = 123;
    var flag = true;
    var n = null;
    var u = undefined;
    
    // 任何类型和字符串相加, 都会先转换为字符串之后再相加
    var res1 = num + ""; // 123 + ""  --> "123" + "" --> "123"
    console.log(res1); // 123
    console.log(typeof res1); // string
    
    var res2 = flag + "";
    console.log(res2); // true
    
    var res3 = n + "";
    console.log(res3); // null
    
    var res4 = u + "";
    console.log(res4); // undefined
    

    转换为Number类型

    • 转换为Number类型第一种方式:
      将需要转换的数据传递给Number()函数即可

      1. 对于字符串:
        如果字符串中都是数字, 那么就正常转换
        如果字符串中不仅仅有数字, 那么转换为NaN
        如果字符串中没有内容"" " ", 那么就转换为0

      2. 对于布尔类型: true转换为1, false转换为0

      3. 对于null: 转换为0

      4. 对于undefined: 转换为NaN

      总结:
      空字符串(""/" ") /false /null --> 0
      不仅仅包含数字的字符串 和 undefined --> 转换为NaN
      其它的均可正常转换

    • 转换为Number类型第二种方式:
      利用算数运算符来转换, 在需要转换的类型前面加上+加号或者-减号即可
      注意点:
      +加号不会改变数据的正负性
      -减号会改变数据的正负性

    var str1 = "123";
    var res1 = +str1;
    console.log(res1); // 123
    console.log(typeof res1); // number
    
    var res2 = -str1;
    console.log(res2); // -123
    console.log(typeof res2); // number
    
    var str2 = "3.14";
    var res3 = +str2;
    console.log(res3); // 3.14
    
    var flag1 = true;
    var res4 = +flag1;
    console.log(res4); // 1
    
    var flag2 = false;
    var res5 = +flag2;
    console.log(res5); // 0
    
    var n = null;
    var res6 = +n;
    console.log(res6); // 0
    
    var u = undefined;
    var res7 = +u;
    console.log(res7); // NaN
    
    • 转换为Number类型第三种方式:

      1. 通过Number函数或者通过+-运算符转换, 都不能转换复杂的字符串
        例如: "12px"

      2. 所以就有第三种转换的方式, 通过parseInt()/parseFloat()函数
        parseInt: 只能提取整数
        parseFloat: 可以提取小数

      注意点:

      • parseInt/parseFloat , 会从左至右的提取, 一旦被中断后续的就提取不到了
      • 对于parseFloat来说, 只能提取一个点, 第二个点会被中断
    var str1 = "3.14px";
    var res1 = parseInt(str1);
    console.log(res1); // 3
    console.log(typeof res1); // number
    
    var res2 = parseFloat(str1);
    console.log(res2); // 3.14
    console.log(typeof res2); // number
    
    var str = "12px666px";
    var res1 = parseInt(str);
    console.log(res1); // 12
    
    var str = "3.14.15px";
    var res1 = parseFloat(str);
    console.log(res1); // 3.14
    

    转换为Boolean类型

    • 将需要转换的数据传递给Boolean()函数即可

      1. 对于字符串而言:
        只要不是空字符串(没有任何内容), 都会转换为 false
        只要字符串中有内容(包含空格/Table), 都会转换为 true

      2. 对于Number类型而言: 只要不是 0 都会转换为 true, 只有0会转换为 false

      3. 对于 null 和 undefined 而言, 都会转换为 false

      4. 对于 NaN 也会转换为false

      总结: "" / 0 / null / undefined / NaN --> false

    相关文章

      网友评论

          本文标题:JS-转换类型

          本文链接:https://www.haomeiwen.com/subject/cgxmxqtx.html