最近在读《你不知道的javascript》系列图书,收获蛮大,感慨也挺多的。
是的,关于javascript,你不是不知道,而是真的不知道。?
就比如类型转换,从开始到看完到第二第三第N遍,我经历了如下的心路历程:
这有什么不知道的 → 一脸懵逼 → 有点意思 → 卧槽,怎么这样? → 原来是这样 → 靠,还是坑...
真可谓是不学不知道,一学吓一跳。
为了避免再次入坑,这里做个总结,不,了结。

核心点

Javascript中的强制类型转换总是返回标量基本类型值(string, boolean, number, undefined, null)。
直白点就是Object.toString()或者Object.valueOf()的返回值。

toString和valueOf的区别

  • toString : 以字符串形式返回该对象的原始值

  • valueOf : 返回最适合该对象类型的原始值

  • 在数值运算中,会优先调用valueOf

  • 在字符串运算中,会优先调用toString

var a = 1;
a.toString() // '1'
a.valueOf() // 1a + 2 // 3 优先调用valueOf
a + 'string' // 1string 优先调用toStringa + '' //隐式强制类型转换
String(a) //显示强制类型转换

规则

ToString 字符串化

对象在强制转换为字符串的时候,会优先调用toString()方法,如果返回基本类型的值,则直接使用该返回值;
如果返回值不是基本类型,则会继续调用valueOf()方法,如果valueOf()返回基本类型的值,则直接使用该返回值,否则报错。
数组默认的toString方法经过了重新定义,类似于数组的join(',')方法,会将数组的各个元素以','分隔返回。这就是 String([]) === '' 的原因。

JSON.stringify易错点
  • JSON.stringify对象中遇到undefined、function、symbol时会自动忽略

  • JSON.stringify数组中遇到undefined、function、symbol时会返回null

  • 字符串、数字、布尔、null的JSON.stringify的规则与ToString相同

  • 如果传递给JSON.stringify的对象中定义了toJSON()方法,那么该方法会在字符串化前调用。

JSON.stringify({a : undefined, b : function () {}, c: 1}) // "{"c":1}"
JSON.stringify([undefined, function () {},1])  // "[null, null, 1]"

ToNumber 数字化

对象在强制转换为数字的时候,会优先调用valueOf()方法,如果返回基本类型的值,则直接使用该返回值;
如果返回值不是基本类型,则会继续调用toString()方法,如果toString()返回基本类型的值,则直接使用该返回值,否则报错。

Number([]),因为[].valueOf()返回值不是基本类型,因此会调用toString(), 等价于Number('')

ToBoolean 布尔化

假值

javascript有以下假值:

  • undefined

  • null

  • false

  • +0、-0 和 NaN

  • ''

假值的布尔强制类型转化为false
可以理解为假值列表以外的都是真值(true)

== 和 === 的区别

  • == 允许在相等比较中进行强制类型转换,=== 不允许

  • == 和 === 都会检查操作数的类型,区别在于操作数类型不同时他们的处理方式不同,即== 会进行强制类型转换

容易懵逼的地方

null == undefined
NaN  != NaN
null != 0
undefined != 0
NaN != 0
[] == false
[] == 0
[] == ''
[] == ![]

正确的使用 ==

  • 如果两边的值中有true或者false,千万不要使用 ==

  • 如果两边的值中有[]、'' 或者 0, 尽量不要使用 ==

其他

  • +运算符 (即只有一个操作数) 用来强制转化为数字 + new Date()

  • && 和 || 运算符的返回值并不一定是布尔类型,而是两个操作数其中一个的值

参考

《你不知道的JavaScript(中)》

本文首发于 我的博客

javascript中让人懵逼的类型转换相关推荐

  1. 前端基本功(三):javascript中让人脑壳疼的this关键字

    javascript 的this关键字 1. this是什么 this是javascript中的关键字之一.他是使用对象自动生成的一个内部对象,只能在对象内部使用.它会根据上下文而进行变化,并且会在不 ...

  2. html类型转换函数,如何在JavaScript中转换数据类型?

    在JavaScript中,数据类型用于对一种特定类型的数据进行分类,确定可以分配给类型的值以及可以对其执行的操作.虽然由于类型强制,JavaScript会自动转换许多值,但为了达到预期的结果,通常最好 ...

  3. javascript中强制类型转换详解+总结

    javascript中一共有六种类型:Number,String,Boolean,Undefined,Object,function.可以用typeof来查看声明的变量的类型.注意,typeof是操作 ...

  4. Javascript中的陷阱大集合【译】

    参考:http://www.2cto.com/kf/201111/111203.html 昨天晚上在自己的个人技术博客上翻译了一篇有关Javascript的文章,今天想想还是把它投稿到博客园吧,大家可 ...

  5. JavaScript中圆括号()和方括号[]的一个特殊用法

    缘由: JS这个语言实在过于灵活,当然其不足之处也有很多.当今各种开源JS脚本铺天盖地,所以很多人的编程风格一下涌到你面前,特别是那些大师级的JS编码风格与技巧. 在最近分析NIKE这个网站源码时,看 ...

  6. JavaScript简介及JavaScript中的关键保留字、变量和数据类型

    1. JavaScript简介 JavaScript 诞生于 1995 年.它当时的目的是为了进行表单输入的验证.因为在 JavaScript 问世之前,表单的验证都是通过服务器端验证的.而当时都是电 ...

  7. JavaScript 中 10 个需要掌握基础的问题

    作者:hackernoon 译者:前端小智 来源:Kiran https://mp.weixin.qq.com/s/q0Pvqi9oHOXn7hO02_v4_g 点赞再看,微信搜索 [大迁世界] 关注 ...

  8. Javascript 中 == 和 === 区别是什么?

    首页发现话题 登录加入知乎 Javascript 中 == 和 === 区别是什么? 关注问题写回答 前端开发 JavaScript 前端工程师 原生 JavaScript Javascript 中 ...

  9. javascript案例_如何在JavaScript中使用增强现实-一个案例研究

    javascript案例 by Apurav Chauhan 通过Apurav Chauhan 如何在JavaScript中使用增强现实-一个案例研究 (How to use Augmented Re ...

最新文章

  1. ubuntu18 搜狗输入法 解决版
  2. 如何用极致业务基础平台做一个通用企业ERP系列之三启用期间管理设计
  3. Xshell上传、下载文件到linux
  4. 类和对象—继承—同名成员处理
  5. python pip安装指定版本unittest_你们想要的unittest用例失败重运行,解决方案来啦!...
  6. 拷贝 ioutils linux,使用Apache的IOUtils实现文件下载
  7. 大数据学习(1)-大数据概述
  8. 【opencv 学习】仿射变换(图像的旋转、缩放、平移)
  9. z-index的取值范围
  10. selenium安装_Selenium快速入门知识1-环境安装
  11. 简单介绍Javascript匿名函数和面向对象编程
  12. Ccharles 爬取微信公众号和小程序
  13. 如何用计算机将分栏的文章合并,在Word文档中给文章段落分栏的方法
  14. Win10关闭安全中心的病毒和威胁实时保护
  15. “牵手”南京银行,度小满To B生态能力再次得到强化
  16. 草丛效果-shader forge
  17. Kali Linux签名失效的解决方法
  18. 瞬时: lnstant
  19. L2-027. 名人堂与代金券,结构体排序
  20. elementUI 选择器 html

热门文章

  1. ruoyi是怎么点击菜单跳转页面的_电商后台设计:系统管理、菜单管理
  2. 外贸企业邮箱多少钱? 企业邮箱怎么申请,定制企业域名邮箱流程详解!
  3. 移动办公必不可少的APP,来自办公达人的分享
  4. 戴尔服务器硬件报错信息LCD液晶面板错误信息
  5. Android USB OTG U盘读写相关使用最全总结
  6. CCS报错errors encountered during linking以及unresolved symbols remain
  7. 基于数据库及TCP网络编程实现的电子词典
  8. 用腾讯云linux服务器配置宝塔面板+配置Apache与Nginx共存并可互相切换
  9. 【答辩问题】计算机专业本科毕业设计答辩详细指导
  10. 啊哈!算法—火柴棍等式