首先我们要知道,在 JS 中类型转换只有三种情况,分别是:

  • 转换为布尔值
  • 转换为数字
  • 转换为字符串

我们先来看一个类型转换表格

转Boolean

在条件判断时,除了 undefined, null, false, NaN, '', 0, -0,其他所有值都转为 true,包括所有对象。

对象转原始类型

对象在转换类型的时候,会调用内置的 [[ToPrimitive]] 函数,对于该函数来说,算法逻辑一般来说如下:

  • 如果已经是原始类型了,那就不需要转换了
  • 调用 x.valueOf(),如果转换为基础类型,就返回转换的值
  • 调用 x.toString(),如果转换为基础类型,就返回转换的值
  • 如果都没有返回原始类型,就会报错

当然你也可以重写 Symbol.toPrimitive ,该方法在转原始类型时调用优先级最高。

let a = {
valueOf() {
return 0
},
toString() {
return '1'
},
[Symbol.toPrimitive]() {
return 2
}
}
1 + a // => 3

四则运算符

加法运算符不同于其他几个运算符,它有以下几个特点:

  • 运算中其中一方为字符串,那么就会把另一方也转换为字符串
  • 如果一方不是字符串或者数字,那么会将它转换为数字或者字符串
1 + '1' // '11'
true + true //
4 + [1,2,3] // "41,2,3"
  • 对于第一行代码来说,触发特点一,所以将数字 1 转换为字符串,得到结果 '11'
  • 对于第二行代码来说,触发特点二,所以将 true 转为数字 1
  • 对于第三行代码来说,触发特点二,所以将数组通过 toString 转为字符串 1,2,3,得到结果 41,2,3

另外对于加法还需要注意这个表达式 'a' + + 'b'

'a' + + 'b' // -> "aNaN"

因为 + 'b' 等于 NaN,所以结果为 "aNaN",你可能也会在一些代码中看到过 + '1' 的形式来快速获取 number 类型, + ' ' => 0 。

那么对于除了加法的运算符来说,只要其中一方是数字,那么另一方就会被转为数字

4 * '3' //
4 * [] //
4 * [1, 2] // NaN

比较运算符

  1. 如果是对象,就通过 toPrimitive 转换对象
  2. 如果是字符串,就通过 unicode 字符索引来比较
let a = {
valueOf() {
return 0
},
toString() {
return '1'
}
}
a > -1 // true

在以上代码中,因为 a 是对象,所以会通过 valueOf 转换为原始类型再比较值。

JS的类型转换的更多相关文章

  1. JS 数据类型转换

    JS 数据类型转换 方法主要有三种 转换函数.强制类型转换.利用js变量弱类型转换. 1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把 ...

  2. JS数据类型转换

    JS 数据类型转换 方法主要有三种 转换函数.强制类型转换.利用js变量弱类型转换. 1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把 ...

  3. js值类型转换(boolean/String/number),js运算符,if条件,循环结构,函数,三种弹出框

    js值类型转换 number | string | boolean boolean类型转换 num = 0; var b1 = Boolean(num); console.log(b1) 转化为数字类 ...

  4. js 自动类型转换

    js自动类型转换 1.==符号在判断左右两边数据是否相等时,如果数据类型一致,直接比较值即可 2.==符号左右数据类型不一致时,如果两方数据为布尔型.数值型.字符串型时,不为数字的那一方自动调用Num ...

  5. JS的类型转换,强制转换和隐式转换

    JS的类型转换 1.强制转换 通过String(),Number(),Boolean()函数强制转换 var str=123; var str1='123'; console.log(typeof s ...

  6. js笔记——js数据类型转换

    以下内容摘录自阮一峰的<语法概述 -- JavaScript 标准参考教程(alpha)>章节『数据类型转换』,以做备忘.更多内容请查看原文. JavaScript是一种动态类型语言,变量 ...

  7. JS 数据类型转换-转换函数、强制类型转换、利用js变量弱类型转换

    1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把值转换成浮点数.只有对String类型调用这些方法,这两个函数才能正确运行:对其他类型 ...

  8. {}+[] = ? 和 []+{} = ? 浅谈JS数据类型转换

    参加公司技术嘉年华第一季(前端.服务端)的间隙,陈导问了我一个问题:{}+[] 和 []+{}两个表达式的值分别是什么?根据我的理解我觉得结果应该都是"[object Object]&quo ...

  9. JS 数据类型转换以其他

    JavaScript 是一种弱类型的语言,也就是没有类型限制,变量可以随时被赋予任意值. 同时,在程序运行过程中,类型会被自动确认的.因此,这就是涉及到数据的类型转换.在 JS 的世界中,数据类型转换 ...

随机推荐

  1. 问题:C#Chart控件自动添加Series;结果:图形组件Chart动态添加Series

    Chart1.DataSource = dtb; string[] strcolor = new string[20]; strcolor[0] = "220, 224, 64, 10&qu ...

  2. Arduino Uno 在win7 64位下的驱动问题

    1.解压[mdmcpq.inf_amd64_neutral_fbc4a14a6a13d0c8.rar],将[mdmcpq.inf_amd64_neutral_fbc4a14a6a13d0c8]文件夹复 ...

  3. day70-oracle 12-触发器

    查询是没有触发器的.trigger是一个数据库的对象.PL/SQL程序是在我插入之前执行还是在插入之后执行?触发器类似于java中的监听器. 监听插入操作,执行一段PLSQL程序. 禁止在非工作时间插 ...

  4. 数字调节控件JSpinner的使用

    ---------------siwuxie095                         工程名:TestUI 包名:com.siwuxie095.ui 类名:TestList.java   ...

  5. 使用ServerSocket建立聊天服务器(二)

    -------------siwuxie095                         工程名:TestMyServerSocket 包名:com.siwuxie095.socket 类名:M ...

  6. 数组中的最大值以及最小值的位置变换的问题(C++)

    将一个5×5的数组中的最大值放到数组的中心位置 分析:遍历数组,找到最大的元素,然后将该元素与中心位置的元素交换位置 #include<iostream> #include <std ...

  7. IFC4 在线参考手册

    国内地址1:http://www.vfkjsd.cn/ifc/ifc4/index.htm 国内地址2:http://www.bim-times.com/ifc/ifc4/index.htm 官方地址 ...

  8. PCL — Point Pair Feature 中层次点云处理

    博客转载自:http://www.cnblogs.com/ironstark/p/5971976.html 机器人视觉中有一项重要人物就是从场景中提取物体的位置,姿态.图像处理算法借助Deep Lea ...

  9. alias这个命令还是很有用的

    这是在知乎看到的一个回答. 我一开始学习linux命令的时候觉得这个alias命令很奇怪,为什么要给别人起个别名呢?有什么好处? 因为当时接触的是比较简单的命令 比如ls -al的这种短小的命令,对a ...

  10. SDUT 3376 数据结构实验之查找四:二分查找

    数据结构实验之查找四:二分查找 Time Limit: 20MS Memory Limit: 65536KB Submit Statistic Problem Description 在一个给定的无重 ...