zoukankan      html  css  js  c++  java
  • JS系列:js数据类型的转换

    数据类型的转换
    【基本数据类型】
    数字 number
    字符串 string
    布尔 boolean
    空 null
    未定义 undefined
    【引用数据类型】
    对象 object
    普通对象 {}
    数组对象 [](Array)
    正则对象 (RegExp)
    日期对象 (Date)
    数学函数 (Math)

    函数 function

    真实项目中根据需求,我们徐亚进行对数据类型转换(规则和规则之间是相互独立的,千万不要混着记)

    把其他数据类型转换为number类型
    1.发生的情况
    - isNaN检测的时候:当检测的值不是数字类型,浏览器会自己调用Number方法把它先转化为数字,然后再检测是否为非有效数字。

    例子1:isNaN('3') =>false
    Number('3') ->3
    isNaN(3) ->false 是有效数字
    例子2:isNaN('3px') =>false
    Number('3px') ->NaN
    isNaN(3) ->true 非有效数字
    1
    2
    3
    4
    5
    6
    基于parseInt/parseFloat/Number 去手动转换为数字类型
    数学运算:+ - * / %,但是"+"不仅是数学运算,也可能是字符串拼接
    '3'- 1 =>2
    Number('3')->3
    3-1->2

    '3px'- 1 =>NaN

    '3px'+ 1 =>'3px1' 字符串拼接

    var i='3';
    i=i++; => 4 // i++就是单纯的数学运算,不是字符串拼接
    i=i+1; => '31'
    i+=1; => '31'
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    在基于"=="比较的时候,有时候也会把其他的值转换为数字类型。
    2.转换规律
    转换的方法:Number (浏览器自行转换都是基于这个方法完成的)
    【把字符串转换为数字】
    只有遇到一个非有效数字字符,结果都是NaN
    Number(’’) ->0
    ’ ’ ->0
    ‘ ’ ->0 // 为换行符
    ‘ ’ ->0 // 为制表符键盘 也就是Tab,一个Tab就是4个空格键盘
    【把布尔转换为数字】
    true->1
    false->0
    【把没有转换为数字】
    null ->0
    undefined ->NaN
    【把引用类型转换为数字】
    首先先转换为字符串(toString),然后再转换为数字(Number)

    把其他的值转化为字符串
    1.发生的情况
    - 基于alert/confirm/prompt/document.write 等方法输出内容的时候,会把输出的值转化为字符串,然后输出。

    alert(1)=>'1'
    1
    基于’+'进行字符串拼接的时候
    把引用值转换为数字的时候,首先为转换为字符串,然后再转换为数字,
    对对象设置属性名,如果不是字符串,首先转换为字符串,然后再当做属性存储到对象中(对象的属性只能是数字或者字符串)
    手动调用toString/toFixed/Join/String等方法的时候,也是为了转换为字符串
    var m = Math.PI //=>获取圆周率
    m.toFixed(2) => '3.14'

    var ary = [12,34,23];
    ary.join('+') = '12+34+23'
    1
    2
    3
    4
    5
    2.转换规律

    //=>调用的方法:toString

    1 -> '1'
    [] -> ''
    [12] -> '12'
    [12,23] -> '12,23'

    (function(){}).toString() =>"function(){}"
    new Date().toString() =>"Mon Dec 09 2019 15:13:53 GMT+0800 (中国标准时间)"
    ...
    【对象】
    {name:'xxx'} -> '[object Object]'
    {} -> '[object Object]'
    不管是啥样的普通对象,最后结果都是一样的。
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    把其他的值转换为布尔类型
    1.发生的情况
    - 基于!/!!/Boolean等方法转换
    - 条件判断中的条件最后都会转换为布尔类型

    if(n){
    //=>把n的值转换为布尔验证条件真假
    }
    if('3px'+3){
    //=>先计算表达式的结果'3px3',把结果转换为布尔true,条件成立。
    } alert(1)=>'1'
    1
    2
    3
    4
    5
    6
    2.转换规律
    只有"0/NaN/null/undefined/'' "五个值转换为布尔的false,其余为true

    特殊情况:数学运算与字符串拼接 “+”
    //=>当表达式中出现字符串,就是字符串拼接,否则就是数学运算
    1+true => 2 不是字符串当做数学运算,true变成1,所以为2
    '1' + true => '1true' 字符串拼接

    [12]+10 =>'1210' 虽然现在没看到字符串,但是引用类型转换为数字,首先会转换为字符串,所以会变成了字符串拼接
    ({})+10 =>"[object Object]10"
    []+10="10"

    {}+10 =>10 这个和以上说的没有任何关系,因为不是数学运算,也不是字符串拼接,它是两部分代码
    {} 代表一个代码块(块级作用域)
    +10 才是我们的操作
    严格写法:{}; +10
    function fn(); + 10 =>10

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    思考题:

    12+true+false+null+underfined+[]+'前端'+null+underfined+[]+true =>"NaN前端nullundefinedtrue"
    解析:
    12+true =>13
    13+false =>13
    13+null =>13
    13+undefined =>NaN
    NaN+[] =>'NaN'
    'NaN'+'前端' =>'NaN前端'
    ...
    'NaN前端trueundefined'+[] =>'NaN前端trueundefined'
    ...
    =>'NaN前端trueundefined'
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    特殊情况:"=="在进行比较时候,如果左右两边的数据类型不一样,则先转换为相同的类型,在进行比较
    对象==对象:不一定相等,因为对象操作的是引用地址,地址不相同,则不相等

    {name:'xxx'} == {name:'xxx'} =>false
    []==[] =>false

    var obj1={};
    var obj2=obj1;
    obj1==obj2 =>true
    1
    2
    3
    4
    5
    6
    对象数字:把对象转换为数字
    对象布尔:把对象转换为数字,把布尔也转换为数字
    对象字符串:把对象转换为数字,把字符串转换为数字
    字符串数字:字符串转换为数字
    字符串布尔:都转换为数字
    布尔数字:布尔转换为数字
    =====================>不同情况的比较,都是把其他的值转换为数字,然后再进行比较
    nullundefined: true
    nulll=undefined:false
    null&undefined和其他值都不相等

    NaN==NaN:false
    NaN和谁都不相等包括自己
    =============================>以上都需要特殊记忆

    1==true =>true
    1==false =>false
    2==true =>false 规律不要混淆,这里是把true变为数字1

    []==[] =>false
    ![]==[] =>true
    []==false => true //转换为数字都为0
    []==true => false //[]转换为数字都为0,true转换为数字都为1

    ![]==false =>true 先算![],把数组转换为布尔取反=>false =>false==false
    ![]==true =>false //true为1 ,![]为0
    ————————————————

  • 相关阅读:
    代码是什么
    关于程序
    信息系统分析三原则
    设计的一个原则,妥协,不完美
    Algs4-1.4.30一个栈和一个steque实现的双向队列
    Algs4-1.4.31三个栈实现的双向队列
    Algs4-1.4.29两个栈实现的steque
    Algs4-1.4.27两个栈实现队列
    Algs4-1.4.28一个队列实现的栈
    *Algs4-1.4.26-三点共线-(未解决)
  • 原文地址:https://www.cnblogs.com/fron-tend/p/12050524.html
Copyright © 2011-2022 走看看