类型转换

转字符串 数字 布尔值 对象
undefined 'undefined' 0 false throws TypeError
null 'null' 0 false throws TypeError
true 'true' 1 new Boolean(true)
false 'false' 0 new Boolean(false)
'' (空字符串) 0 false new String('')
'1.2'(数字字符串) 1.2 true new String('1.2')
'shiny'(非数字字符串) NaN true new String('shiny')
0 '0' false new Number(0)
-0 '0' false new Number(-0)
Infinity 'Infinity' true new Number(Infinity)
-Infinity '-Infinity' true new Number(-Infinity)
33 '33' true new Number(33)
{} (任意对象) true new Number(NaN)
[] '' 0 true new Number(NaN)
[33] '33' 33 true new Number(NaN)
['a'] 'a' NaN true new Number(NaN)
function(){} NaN true new Number(NaN)
  • 原始值转对象很简单,原始值通过调用String(),Number(),Boolean()构造函数,转换为他们各自的包装对象。nullundefined属于例外,当将他们用在期望是一个对象的地方都会造成一个类型错误(TypeErroe)异常,而不会执行正常的转换。
  • 对象转换相对复杂,下面具体描述

1、转换和相等性

由于JS可以做灵活的类型转换,因此其'=='相等运算符也随相等的含义灵活多变。例如:

null == undefined		// 这两值被认为相等
'0' == 0 // 前面的字符串转为了数字
0 == false // 比较之前布尔值转成了数字
'0' == false // 比较前字符串和布尔值都转成了数字

一个值转换为另一个值并不意味着两个值相等。比如,如果在期望使用布尔值的地方使用了undefined,它将会转换为false,但这并不表明undefined == false。JS运算符和语句期望使用多样化的数据类型,并可以相互转换。if语句将undefined转换为false,但==运算符从不试图将其操作数转换为布尔值。

相等运算符==比较并不严格。如果两个操作数不是同一类型,那么相等运算符会尝试进行一些类型转换,然后进行比较:

  • 如果两个操作数的类型相同,则根据值进行比较,也就是类似于严格相等(===)进行比较。
  • 如果两个操作数类型不同,==相等操作符也可能会认为他们相等。检测相等将会遵守如下规则和类型转换:

    1、如果一个值是null,另一个是undefined,则它们相等。

    2、如果一个值是数字,另一个是字符串,先将字符串转换为数字,然后使用转换后的值进行比较。

    3、如果其中一个值是true,则将其转为1再进行比较。如果其中一个值是false,则将其转换为0再进行比较。

    4、如果一个值是对象,另一个值是数字或字符串,则将对象转为原始值,然后再进行比较。对象通过toString()方法或者valueOf()方法转换为原始值。JS语言核心的内置首先尝试使用valueOf(),再尝试使用toString(),除了日期类,日期类只是用toString()转换。那些不是JS语言核心中的对象则通过各自的实现中定义的方法转换为原始值。

    5、其他不同类型之间的比较均不相等。

2、显示类型转换

  • 做显示类型转换最简单的方法就是使用Boolean()、Number()、String()或Object()函数。当不通过new运算符调用这些函数时,它们会作为类型转换函数:
Number('3')			>> 3
String(false) >> 'false'
Boolean([]) >> true
Object(3) >> new Number(3)

需要注意的是,除了null或undefined之外的任何值都具有toString()方法,这个方法执行结果通常和String()方法的返回结果一致。

  • JS中某些运算符会做隐式的类型转换,又是用户类型转换。
x+''			//等价于String('x')
+x // 等价于Number(x).也可以写成x-0
!!x // 等价于Boolean(x).注意是双叹号。
10+'shiny' // '10shiny',数字10转换为字符串
'7'*'4' // 28,两个字符串均转换为数字
var n = 1 - 'x' // NaN: 字符串x无法转换为数字
n + 'shiny' // 'NaN shiny': NaN转换为字符串NaN
  • Number类定义的toString()方法可以接收表示转换基数(radix)的可选参数,如果不指定此参数,转换规则将是基于十进制。
var n = 17;
var a = n.toString(2); // 转化为 ‘10001’
var b = '0' + n.toString(8); // 转换为‘021’
var c = '0x' + n.toString(16); // 转换为‘0x11'
  • 如果通过Number()转换函数传入一个字符串,它会试图将其转化为一个整数或浮点数直接量,这个方法只能基于十进制数进行转换,并且不能出现非法的尾随字符。parseInt()函数和parseFloat()函数(它们是全局函数,不从属于任何类的方法)更加灵活。parseInt()可以接收第二个可选参数,这个参数指定数字转换的基数,合法的取值范围是2-36。
parseInt('1 shinygang')				>> 3
parseFloat('3.14 shinygang') >> 3.14
parseInt('-12.33') >> -12
parseInt('0xff') >> 255
parseFloat('.1') >> 0.1
parseInt('.1') >> NaN,整数不能以'.'开始
parseInt('11', 2) >> 3 (1*2+1)
parseInt('ff', 16) >> 255 (15*16+15)

3、对象转换为原始值

  • 对象到布尔值的转换非常简单:所有对象(包括数组和函数)都转换为true。对于包装对象亦是如此:new Boolean(false)是一个对象而不是原始值,它江转换为true。
  • 对象到字符串和对象到数字的转换都是通过调用带转换对象的一个方法来完成的。JS对象有两个不同的方法来执行转换:toString()和valueOf()

    toString():它的作用是返回一个反应这个对象的字符串。默认的toString()方法并不会返回一个有趣的值。
({x:1}).toString()   	>> "[object Object]"

很多类定义了更多特定版本的toString()方法。例如,数组类的toString()方法将每个数组元素转换为一个字符串,并在元素之间添加逗号后合并成结果字符串。函数类的toString()方法返回这个函数的实现定义表示方式。日期类定义的toString()方法返回了一个可读的日期和时间字符串。RegExp类定义的toString()方法将RegExp对象转换为表示正则表达式直接量的字符串。

[1,2,3].toString()					>> "1,2,3"
(function(x){f(x);}).toString() >> "function(x){\n f(x); \n}"
/\d/g.toString() >> "/\\d/g"
new Date(2010,0,1).toString() >> "Fri Jan 01 2010 00:00:00 GMT+0800 (CST)"

valueOf():如果存在任意原始值,它就默认将对象转换为表示它的原始值。对象是复合值,而且大多数对象无法真正表示为一个原始值,因此默认valueOf()方法简单地返回对象本身,而不是返回一个原始值。数组、函数和正则表达式简单地继承了这个默认方法,调用这些类型的实例的valueOf()方法只是简单返回对象本身。日期则返回对应毫秒数。

3..1、JS中对象到字符串的转换经过了如下这些步骤:

  • 如果对象具有toString()方法,则调用这个方法。如果他返回一个原始值,JS将这个原始值转换为字符串,并返回这个字符串结果。
  • 如果对象没有toString()方法,或这个方法并不返回一个原始值,那么JS会调用valueOf()方法。如果存在这个方法,则JS调用它。如果返回值是原始值,JS将这个值转换为字符串,并返回这个字符串结果。
  • 否则,JS无法从toString()或valueOf()获得一个原始值,因此这时它将抛出一个类型错误异常。

    3.2、在对象到数字的转换过程中,JS做了同样的事情,只是它会首先尝试使用valueOf()方法:
  • 如果对象具有valueOf()方法,后者返回一个原始值,则JS将这个原始值转换为数字返回
  • 否则,如果对象具有toString()方法,返回一个原始值,则JS将其转换并返回
  • 否则,JS抛出一个类型异常错误。

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

  1. js类型转换的坑

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

  2. js类型转换

    1.js中有六种基本类型,分别是object.number.string.Boolean.null.undefined,其中number.string.Boolean为基本类型,有时使用会强制转换成对 ...

  3. js 类型转换学习

    类型转换分为显示转换和隐式转换 参考http://www.cnblogs.com/mizzle/archive/2011/08/12/2135885.html 先事件显示的 通过手动进行类型转换,Ja ...

  4. JS 对象、HTML事件处理、JS 类型转换、Date

    1. JS 对象 <script> var Person = new Object(); Person.id = 1; Person.name = "Hello World&qu ...

  5. 你可能忽略的js类型转换

    前言 相信刚开始了解js的时候,都会遇到 2 == '2',但 1+2 == 1+'2'为false的情况.这时候应该会是一脸懵逼的状态,不得不感慨js弱类型的灵活让人发指,隐式类型转换就是这么猝不及 ...

  6. 一篇文章搞定JS类型转换

    啥要说这个东西?一道面试题就给我去说它的动机.题如下: var bool = new Boolean(false); if (bool) { alert('true'); } else { alert ...

  7. 类型和原生函数及类型转换(三:终结js类型转换)

    Number() parseInt() parseFloat() Boolean() String() toString() 一.显式类型转换 -------Number()函数把对象的值转换为数字. ...

  8. js类型转换比较表格

    JavaScript类型转换表格  值 转换为         字符串 数字 布尔值 对象 undefined "undefined" NaN false throw TypeEr ...

  9. js——类型转换

      总述                   类型转换:显式.隐式(自动) 隐式转换是由编译器自动进行的,基本主要抽象操作有ToPrimitive, ToNumber, ToString, ToBoo ...

  10. JS类型转换(强制和自动的规则)

    显式转换 通过手动进行类型转换,Javascript提供了以下转型函数: 转换为数值类型:Number(mix).parseInt(string,radix).parseFloat(string) 转 ...

随机推荐

  1. 基于NodeJS进行前后端分离

    1.什么是前后端分离 传统的SPA模式:所有用到的展现数据都是后端通过异步接口(AJAX/JSONP)的方式提供的,前端只管展现. 从某种意义上来说,SPA确实做到了前后端分离,但这种方式存在两个问题 ...

  2. Ansible(一) - 入门及安装

    Ⅰ. Ansible简介 ansible是新出现的自动化运维工具,基于Python开发,集合了众多运维工具(puppet.cfengine.chef.func.fabric)的优点,实现了批量系统配置 ...

  3. OpenCV探索之路(二十六):如何去除票据上的印章

    最近在做票据的识别的编码工作时遇到一些问题,就是票据上往往会有一些红色印章把一些重要信息区域给覆盖了,比如一些开发票人员盖印章时比较随意,容易吧一些关键区域给遮蔽了,这让接下来的票据识别很困难,因此, ...

  4. JS脚本检查密码强度

    <html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Con ...

  5. Vue的条件渲染

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  6. MVC中View界面数据呈现示例

    @using System.Text; @model List<MvcShopping.Models.ProductCategory> @{ ViewBag.Title = "测 ...

  7. 关于width与padding

    http://blog.csdn.net/yaoyuan_difang/article/details/24735529

  8. springboot使用zookeeper(curator)实现注册发现与负载均衡

    最简单的实现服务高可用的方法就是集群化,也就是分布式部署,但是分布式部署会带来一些问题.比如: 1.各个实例之间的协同(锁) 2.负载均衡 3.热删除 这里通过一个简单的实例来说明如何解决注册发现和负 ...

  9. 邮件实现详解(四)------JavaMail 发送(带图片和附件)和接收邮件

    好了,进入这个系列教程最主要的步骤了,前面邮件的理论知识我们都了解了,那么这篇博客我们将用代码完成邮件的发送.这在实际项目中应用的非常广泛,比如注册需要发送邮件进行账号激活,再比如OA项目中利用邮件进 ...

  10. iOS音频播放、录音、视频播放、拍照、视频录制

    随着移动互联网的发展,如今的手机早已不是打电话.发短信那么简单了,播放音乐.视频.录音.拍照等都是很常用的功能.在iOS中对于多媒体的支持是非常强大的,无论是音视频播放.录制,还是对麦克风.摄像头的操 ...