• js类型转换的坑


      JS的灵活

      说好听是说JS灵活, 说不好听就是JS的太多, JS类型转换就是一个大坑, JS的类型包括了原始类型的[null, undefined, String ,Number, Boolean],以及对象类型的[function, object];

    null, undefined, "", 0, -0, NaN 转换成布尔值是false, 剩下的全转化为 ==>> true;
    null, "", false, , [] 转换成数字是 ==>> 0;
    undefind,
    "One", 一个非数字值的数组:["a"], function(){} 转化成数字是 ==>> NaN;
    true, 一个值为数字的数组:[1] , 是数字的字符串:"1",转换为数字是 ==>> 1;

      其中null和undefined没有构造函数, 他们两个转化为对象的时候会报类型错误

      JS把对象转化成原始值

      JS如果把对象转化成只付出 会调用对象的toString()方法,如果toString()方法返回的值是一个对象,那么会调用对象的valueOf()方法,把valueOf()的返回值转化成字符串, 如果该值还不是原始值就会报错;

      对象转化成数字的时候会调用valueOf()方法, 如果该方法返回值非原始值, 那么回调用该对象的toString(),  把toString的返回值转化成数字, 如果toString()返回值还是非原始值,那么就会报错;

      那么为什么第一个是NaN呢? 因为obj是一个空对象, (除了Date类型的对象的valueOf()返回的是数字以外, 所有的对象的valueOf()返回自己 , 神设定~。~),obj的valueOf()返回的是对象,所以他又调用toString()方法, toString()返回了字符串[object Object], [object Object]转化成数字就变成了NaN;

      如果是对象类型转换成原始类型,只要把需要转化的对象放到原始类型的构造函数中进行解包,比如:

    Number( {valueOf:function(){return 1111}} ) // ==>>  1111
    String( {toString:function(){return 1111}} ) //==>>  "1111"
    Boolean( {} )  // ==>> true

      如果你觉得麻烦的话可以通过算术运算符进行快速转换

        var obj = { toString : function() {return 1111}};
        obj+"" ==>> "1111";
        
        var obj = { valueOf : function() {return 1111}};
        +obj ==>> 1111;

      JS把原始值转化成对象

      要让原始类型转化成对象类型要将元素类型放到对象类型的构造函数中, 需要让构造函数包装

    console.log( typeof true ); //==>> boolean
    console.log( typeof new Boolean( true ) ) //==>> object

     

      参考表

      表作为参考, 来自js权威指南, 看过书的应该都记得这表:

    原始类型和对象类型转换成String:转换成Number转换成Boolean转换成Object
    undefined "undefined" NaN false throws TypeError
    null "null" 0 false throws TypeError
    true "true" 1   new Boolean(true)
    false "false" 0   new Boolean(false)
    "" (empty string)   0 false new String("");Object("")
    "1.2" (nonempty, numeric)   1.2 true new String("1.2");Object("1.2")
    "one" (nonempty, non-numeric)   NaN true new String("one");Object("one")
    0 "0"   false new Number(0);Object(0)
    -0 "0"   false new Number(-0);Object(-0)
    NaN "undefined"   false new Number(NaN);Object(NaN)
    Infinity "Infinity"   true new Number(Infinity);Object(Infinity)
    -Infinity "-Infinity"   true new Number(-Infinity);Object(-Infinity)
    1 (finite, non-zero) "1"   true new Number(1);Object(1)
    {} (any object)   NaN true  
    [] (empty array) "" 0 true  
    [9] (1 numeric elt) "9" 9 true  
    ['a'] (any other array) use join() method NaN true  
    function(){} (any function "undefined" NaN true  
  • 相关阅读:
    Consul常用命令
    ECharts 避免变窄
    TP3.2 日期默认格式
    新订单提示效果
    php 按照字典序排序 微信卡券签名算法用到
    td宽度自适应 窄的地方自动收缩
    git 删除本地分支,删除远程分支
    分页Model
    chrome表单自动填充如何取消
    tp3.2 如何比较两个字段
  • 原文地址:https://www.cnblogs.com/diligenceday/p/4393210.html
Copyright © 2020-2023  润新知