• JavaScript之数据类型转换


    JavaScript中有多种数据类型,在实际工作中,不管是有意还是无意的,我们总能碰到不一样的数据类型值之间进行运算,或者我想从用户输入获得一个数字时,而用户却输入了一个字符串,这种时候就需要用到今天介绍的东西了——数据类型转换。JS中的数据类型转换主要分为两大类:显式类型转换,隐式类型转换。

    一     显示类型转换

             1、Number()

                  接受一个参数,并把它转换成数字。

                  如果参数包含数字和小数点以外的其他字符,则转换失败,返回NaN。下面是一些特殊值转换为数字的结果:

    1 Number(null);//0
    2 Number(undefined);//NaN
    3 Number(true);//1
    4 Number(false);//0
    5 Number("");//0

            

      2、parseInt()

                  接受两个参数,第一个参数会被转换成十进制整数,第二个参数是一个数字,规定第一个参数的进制,它是可选的,默认是10。

                  转换规则:

        a,首先判断第一个参数的数据类型,如果不是字符串或数字类型,则转换失败,直接返回NaN;

        b,若是数字,则原样返回;

        c,若是字符串,则从第一个非空白字符开始检测,直到遇到第一个非数字字符为止,然后返回前面的部分;

        d,如果正负号是第一个非空字符,那么可以识别正负号;

        e,不能识别小数点。

     1 parseInt("123");//123
     2 parseInt("-123");//-123
     3 parseInt(123.123);//123
     4 parseInt("    123");//123
     5 parseInt("123abc");//123
     6 parseInt("abc123");//NaN
     7 parseInt(true);//NaN
     8 parseInt(undefined);//NaN
     9 parseInt(unll);//NaN
    10 parseInt("");//NaN
    11 parseInt(110,2);//6
    12 parseInt(110,16);//272

            

      3、parseFloat()

                  接受一个参数,并把它转换成小数。如果正负号是第一个非空字符,那么可以识别正负号。和parseInt唯一不同的是,它可以识别第一次出现的小数点。

    1 parseFloat("123.123");//123.123
    2 parseFloat("123.1.2.3");//123.1
    3 parseFloat("123.123abc");//123.123

            

      4、toString()

                  用需要被转换成字符串的值调用toString()方法,格式:test.toString(),注意:数字不能直接调用,需要把数字赋值给变量调用。toString()方法的返回值都是字符串类型。

                  在转换数字时,可以接受一个数字类型作为参数,参数规定了转换后结果的进制。其他时候传参无效。

    1 var num = 10;
    2 var a = num.toString();//"10"
    3 var b = num.toString(2);//"1010"
    4 var c = num.toString(8);//"12"
    5 var d = num.toString(16);//"a"

            

      5、String()

                  接受一个参数,将它转换成字符串。任何东西传进去都能的到字符串类型的返回值。

    1 String(123);//"123"
    2 String(123.123);//"123.123"
    3 String(undefined);//"undefined"
    4 String(null);//"null"
    5 String(true);//"true"

            

      6、Boolean()

                  除undefined、null、0、NaN、“”(空串)、false转换成false外,其他任何东西都被转成true。

    1 Boolean(undefined);//false
    2 Boolean(null);//false
    3 Boolean(0);//false
    4 Boolean(NaN);//false
    5 Boolean("");//false
    6 Boolean(false);//false

    二  隐式类型转换

      

      1、isNaN()

        接受一个参数,判断参数是否是数字,是则返回false,否则返回ture。

        会触发隐式类型转换,先调用Number()把参数转换成数字类型。

    1 isNaN(123);//false
    2 isNaN("123");//false
    3 isNaN("");//false
    4 isNaN("abc");true

           

      2、++/--(自增自减)和+/-(正负)

                 会触发隐式类型转换,先调用Number()把操作数转换成数字类型。

    1 var num = "123";
    2 num ++;//123
    3 console.log(num);//124

           

      3、+(数字和字符串相加时)

                 会触发隐式类型转换,先调用String()把操作数转换成字符串类型。

    1 var num = 12;
    2 console.log("I'm " + num + "years old.");//"I'm 12 years old"
    3 console.log(num + "12");//"1212"

           

      4、-、*、/、%

        会触发隐式类型转换,先调用Number()把操作数转换成数字类型。

    1 var num = 12;
    2 console.log(num - 1);//11
    3 console.log(num * 1);//12
    4 console.log(num / 1);//12
    5 console.log(num % 1);//0

          

       5、&&、||、!

        会触发隐式类型转换,调用Boolean()把每个操作数转换成布尔类型。

    1 123 && "abc";//"abc"
    2 0 && "abc";//0
    3 123 || "abc";//123
    4 0 || undefined;//undefined
    5 !0;//true
    6 !1;//false

      关于逻辑运算的返回值:当两个原始值进行逻辑运算时,与运算会返回第一个找到的能被Boolean()转换成false的操作数,否则返回最后一个操作数。或运算会返回第一个能被Boolean()转换成true的操作数,否则返回最后一个操作数。非运算将返回被Boolean()转换成布尔值后再取反的值。即非运算返回的不再是操作数的值,而是布尔值。

      

      6、>、<、<=、>=、==、!=(数字和字符串比较时)

        会触发隐式类型转换,先调用Number()把操作数转换成数字类型。

    1 123 > "122";//true
    2 123 < "124";//true
    3 123 >= "123";//true
    4 123 <= "123";//true
    5 123 == "123";//true
    6 123 != "123";//false

    最后有两个特别的:undefined == null 返回true;NaN == NaN 返回false。另外在做加法(+)运算时字符串优先,在做其他数学计算时,数字优先。

  • 相关阅读:
    "动作面板"组件:<action-sheet> —— 快应用组件库H-UI
    "浮动弹层"组件:<float-layout> —— 快应用组件库H-UI
    "幕帘"组件:<curtain> —— 快应用组件库H-UI
    "轻提示"组件:<toast> —— 快应用组件库H-UI
    "模态框"组件:<modal> —— 快应用组件库H-UI
    "同一行代码片段"组件:<code> —— 快应用组件库H-UI
    "电脑程序输出"组件:<samp> —— 快应用组件库H-UI
    "多行代码"组件:<pre> —— 快应用组件库H-UI
    "按键提示"组件:<kbd> —— 快应用组件库H-UI
    "变量赋值"组件:<var> —— 快应用组件库H-UI
  • 原文地址:https://www.cnblogs.com/ruhaoren/p/11338883.html
Copyright © 2020-2023  润新知