JS中的类型转换非常恶心,大家都懂的,不过该学还是要学。

今天看犀牛书看到了转换规则,总结出来。

X转字符串、数字、布尔值

X表示各种类型的值,直接上图:

转数字 转字符串 转布尔值
undefined NaN “undefined” false
null 0 “null” false
true 1 “true”  
false 0 “false”  
0   “0” false
-0   “0” false
NaN   “NaN” false
Infinity   “Infinity” true
-Infinity   ”-Infinity” true
1(非零)   “1” true
{}(任意对象) 见下文 见下文 true
[](任意数组) 0 ”” true
[9](包含一个数字元素) 9 “9” true
[”a”](其他数组) NaN 使用.join()方法 true
function(){}(任意函数) NaN 见下文 true

两个基本方法

上文中有三个“见下文”,就是见这里了。这三个地方也就是JS转换最麻烦的地方。

首先来看两个基本的转换方法:

toString()  // 返回对象的字符串表示形式

valueOf()  // 返回对象的数字表示形式

乍一看很简单是吧,别着急,关键是JS并不会像你想的那样单纯地调用这些方法。

对象转字符串

具体步骤如下:

  • 如果有toString()方法,调用对象的toString()方法,如果返回一个字面量就把这个字面量转换成字符串并返回。字面量转字符串见上表。
  • 如果没有toString()方法或者没有返回字面量,并且有valueOf()方法,调用valueOf()方法。如果这个方法返回字面量就转换成字符串返回。
  • 如果以上两步都没有成功,就抛出一个类型错误异常。

对象转数字

其实就是把对象转字符串的前两步调换了一下,然后把返回结果都转换成数字。

具体步骤如下:

  • 如果有valueOf()方法,调用valueOf()方法。如果这个方法返回字面量就转换成数字返回。
  • 如果没有valueOf()方法或者没有返回字面量,并且有toString()方法,调用对象的toString()方法,如果返回一个字面量就把这个字面量转换成数字并返回。字面量转数字见上表。
  • 如果以上两步都没有成功,就抛出一个类型错误异常。

对象转字面量

有些特殊的运算符并不会把对象转换成数字或者字符串,而是转换成字面量。

对象转字面量的具体步骤和对象转数字的具体步骤一样,先调用valueOf再调用toString,区别是,对象转字面量并不会在返回之前把结果转换成字符串或者数字,也就是说没有上面步骤中的粗体部分。

那么什么运算符会这么SB呢:

  • +
  • ==
  • !=
  • <,>以及所有关系运算符

处理日期类

别着急,JS还有更SB的一种情况,就是处理Date类型。

如果“+”和“==”遇到的是Date类型对象,那就会采用去除粗体部分的对象转字符串步骤,也就是说先调用toString再调用valueOf,并且不会对结果进行类型转换。

总结

普通转换参见表格,+、==、!=、<>和关系运算符的文艺转换参见对象转字面量,+、==遇见Date的2B转换参见处理日期类。

JS中的各种类型转换规则(转)的更多相关文章

  1. js中的变量类型

    js 中输出定义变量的类型  typeof  变量名. var u:  --underfined类型 var s = "你是一个好人":   --string类型 var n = ...

  2. JS 中对变量类型的五种判断方法

    5种基本数据类型:undefined.null.boolean.unmber.string 复杂数据类型:object. object:array.function.date等 方法一:使用typeo ...

  3. JS中 typeof,instanceof类型检测方式

    在js中的类型检测目前我所知道的是三种方式,分别有它们的应用场景: 1.typeof:主要用于检测基本类型. typeof undefined;//=> undefined typeof 'a' ...

  4. JS 中对变量类型判断的几种方式

    文章整理搬运,出处不详,如有侵犯,请联系~   数据类型判断和数据类型转换代码工具 在 JS 中,有 5 种基本数据类型和 1 种复杂数据类型,基本数据类型有:Undefined, Null, Boo ...

  5. js中的基本类型与引用类型学习

    一.基本数据类型 ECMAScript 有 5 种原始类型(primitive type),即 Undefined.Null.Boolean.Number 和 String,也称为基本数据类型,ES6 ...

  6. JS 中对变量类型的判断

    总结:1. 一般简单的使用 typeof 或 instanceof 检测(这两种检测的不完全准确)          2. 完全准确的使用 原生js中的 Object.prototype.toStri ...

  7. js中对象的类型

    js中的类型分为三种,"内部对象"."宿主对象"."自定义对象" 1."内部对象"有Date.Function.Arra ...

  8. jquery ajax中支持哪些返回类型以及js中判断一个类型常用的方法?

    1 jquery ajax中支持哪些返回类型在JQuery中,AJAX有三种实现方式:$.ajax() , $.post , $.get(). 预期服务器返回的数据类型.如果不指定,jQuery 将自 ...

  9. js中判断对象类型的几种方法

    我们知道,JavaScript中检测对象类型的运算符有:typeof.instanceof,还有对象的constructor属性: 1) typeof 运算符 typeof 是一元运算符,返回结果是一 ...

随机推荐

  1. php解析一个url

    $url = "http://shopnc.localhost/shop/index.php?act=goods&op=index&goods_id=25220"; ...

  2. window.self ->window.top->window.parent

    在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口, opener是用open方法 ...

  3. 11高级网站构建:div和span

    用<div>元素把属于一个逻辑部分的元素包围起来.可以用id属性为<div>提供一个唯一的标签. <div>的作用:1.更深一步展示页面的基本逻辑结构(相当于一个逻 ...

  4. [Virtualization][qemu][kvm][virtio] 使用 QEMU/KVM 模拟网卡多队列

    序: 做DPDK例子的时候,发现一些例子需要多队列,而我当前所使用的虚拟机并不是多队列的.关于我当前虚拟机的状态,可以见前文. 所以,我的需求就是,让虚拟机里的网卡,有多队列! 参考: http:// ...

  5. [daily][troubleshoot][archlinux][wps][font] wps文档中的图内容无法显示中文

    序 用linux作为工作生产环境的几个需要解决的问题之一是:文档协作,即如何兼容Micro$oft Office格式的文档. 我一般的工作方式是:在linux下创建一个win7的虚拟机,安装常用的wi ...

  6. 微信蓝牙BLE接入调试指引 硬件篇

    1 平台框架简介 微信蓝牙BLE由三个模块组成,分别是蓝牙设备.微信和第三方服务器,如下图: 蓝牙设备与微信之间的通信是通过蓝牙GATT协议进行. 微信与第三方服器之间的通信是通过网络http 接口进 ...

  7. 【axc】简单的线性动画绘制

    在一个View上绘制一条直线  然后做出相应的动画效果  可以这样封装三个方法: /** *  划线工具 * *  @param lineArray   线段的点数组 NSValue 类型  默认第一 ...

  8. 获取唯一UUID/UDID方案

    概述 如何保证获取到的UUID能够唯一标识每一台设备呢?我们知道通过UIDevice可以获取到UUIDString,但是如果App被删除了然后重新安装,就会得到不同的UUIDString,这并不是我们 ...

  9. 在Altium_Designer_PCB_中插入图片的方法

    详细请看PDF: http://files.cnblogs.com/files/BinB-W/在Altium_Designer_PCB_中插入图片的方法.pdf 配套文件: http://files. ...

  10. Java学习-001-JDK安装配置

    本节主要讲述在 Win7 64bit 系统下安装.配置 JDK8u25,敬请参阅.详细步骤如下: 一.JDK下载 您可到 官方网站 或 我的云盘 下载,对应的JDK8u25的安装程序,下载过程不再赘述 ...