JavaScript 类型转换

JavaScript类型转换

  • 隐式转换介绍:

    1. 在js中,当运算符在运算时,如果两边数据不统一,CPU就无法计算,这时我们编译器会自动将运算符两边的数据做一个数据类型转换,转成一样的数据类型再计算这种无需程序员手动转换,而由编译器自动转换的方式就称为隐式转换
    2. 例如1 > "0"这行代码在js中并不会报错,编译器在运算符时会先把右边的"0"转成数字0`然后在比较大小
  • 隐式转换规则:

    1. 转成string类型: +(字符串连接符)
    2. 转成number类型:++/–(自增自减运算符) + - * / %(算术运算符) > < >= <= == != === !=== (关系运算符)
    3. 转成boolean类型:!(逻辑非运算符)
原始值转换为数字转换为字符串转换为布尔值
false0“false”false
true1“true”true
00“0”false
11“1”true
“0”0“0”true
“000”0“000”true
“1”1“1”true
NaNNaN“NaN”false
InfinityInfinity“Infinity”true
-Infinity-Infinity“-Infinity”true
“”0“”false
“20”20“20”true
“Runoob”NaN“Runoob”true
[ ]0“”true
[20]20“20”true
[10,20]NaN“10,20”true
[“Runoob”]NaN“Runoob”true
[“Runoob”,“Google”]NaN“Runoob,Google”true
function(){}NaN“function(){}”true
{ }NaN“[object Object]”true
null0“null”false
undefinedNaN“undefined”false
数据类型转换为true的值转换为false的值
Booleantruefalse
String任何非空字符串“”(空字符串)
Number任何非0数字0和NaN
Object任何对象null
Undefined不适用undefined
	<script> 
		//类型一:  字符串连接符算术运算符 之间隐式转化
        //转String类型 两边必须有一个字符串
        console.log(1 + "true");//1true
        //console.log(String(1) + "true");

        console.log(1 + true);//2
        //console.log(1 + Number(true));

        //undefiend转换为数字类型时为NAN
        console.log(1 + undefined);//NAN

        console.log(1 + null);//1

        //类型二  关系运算符 : 会把其他的数据类型转化为Number 再比较
        console.log("2" > 10); //false

        console.log("2" > "10");//true
        //"2".charCodeAt() == 50 > "10".charCodeAt() == 49

        console.log("abc" > "b");//false
        //先拿 a 和 b 比较

        console.log("abc" > "aab");//true

        //类型三 复杂的类型在隐式转换的时候 先转成String 然后再转Number进行计算

        console.log([1, 2] == "1,2")//true
        // console.log([1, 2].toString())

        var a = {}
        //{}转换为String类型为"[object Object]"
        console.log(a == "[object Object]")//true

        //类型四 当有逻辑非! 在关系运算符里面 怎么进行隐式转换
        //[]空数组先转换为string --> Number
        // "" ---> 0 
        console.log([] == 0);//true

        //只要有 ! 必须把右边转化为布尔值
        //[]转化为布尔值为false
        console.log(![] == 0);//true

        console.log({} == {});//false

        // {}转换为String类型为[object Object]
        console.log({} == !{}); //false
    </script>
已标记关键词 清除标记
相关推荐
<p> <span style="color:#4d4d4d;">当前课程中博客项目的实战源码是我在 GitHub上开源项目 My-Blog,目前已有 2000 多个 star:</span> </p> <p> <span style="color:#4d4d4d;"><img src="https://img-bss.csdnimg.cn/202103310649344285.png" alt="" /><br /> </span> </p> <p> <span style="color:#4d4d4d;">本课程是一个 Spring Boot 技术栈的实战类课程,课程共分为 3 大部分,前面两个部分为基础环境准备和相关概念介绍,第三个部分是 Spring Boot 个人博客项目功能的讲解,<span style="color:#565656;">通过本课程的学习,不仅仅让你掌握基本的 Spring Boot 开发能力以及 Spring Boot 项目的大部分开发使用场景,同时帮你提前甄别和处理掉将要遇到的技术难点,认真学完这个课程后,你将会对 Spring Boot 有更加深入而全面的了解,同时你也会得到一个大家都在使用的博客系统源码,你可以根据自己的需求和想法进行改造,也可以直接使用它来作为自己的个人网站,这个课程一定会给你带来巨大的收获。</span></span> </p> <p> <span style="color:#4d4d4d;"><span style="color:#565656;"> </span></span> </p> <p> <span style="color:#e53333;"><span style="color:#e53333;"><strong>课程特色</strong></span></span> </p> <p> <span style="color:#e53333;"><span style="color:#e53333;"><strong> </strong></span></span> </p> <p> <span style="color:#4d4d4d;"><span style="color:#565656;"> </span></span> </p> <ol> <li> <span style="color:#565656;">课程内容紧贴 Spring Boot 技术栈,涵盖大部分 Spring Boot 使用场景。</span> </li> <li> <span style="color:#565656;">开发教程详细完整、文档资源齐全、实验过程循序渐进简单明了。</span> </li> <li> <span style="color:#565656;">实践项目页面美观且实用,交互效果完美。</span> </li> <li> <span style="color:#565656;">包含从零搭建项目、以及完整的后台管理系统和博客展示系统两个系统的功能开发流程。</span> </li> <li> <span style="color:#565656;">技术栈新颖且知识点丰富,学习后可以提升大家对于知识的理解和掌握,对于提升你的市场竞争力有一定的帮助。</span> </li> </ol> <p> <strong>实战项目预览</strong> </p> <p> <span style="color:#4d4d4d;"><span style="color:#565656;"><span style="color:#e53333;"><strong> </strong></span></span></span> </p> <p> <span style="color:#4d4d4d;"><img src="https://img-bss.csdn.net/202005150303066258.png" alt="" /><br /> </span> </p> <p>   </p> <p> <span style="color:#4d4d4d;"> </span> </p> <p> <span style="color:#4d4d4d;"><img src="https://img-bss.csdn.net/202005150305396930.png" alt="" /><br /> </span> </p> <p> <span style="color:#4d4d4d;"> </span> </p> <p> <span style="color:#4d4d4d;"><img src="https://img-bss.csdn.net/202005150305528842.png" alt="" /><br /> </span> </p> <p> <span style="color:#4d4d4d;"> </span> </p> <p> <span style="color:#4d4d4d;"><img src="https://img-bss.csdn.net/202005150306056323.png" alt="" /><br /> </span> </p>
©️2020 CSDN 皮肤主题: 游动-白 设计师:白松林 返回首页