Javascript 类型转换方法


Posted in Javascript onOctober 24, 2010

Javascript中的变量同样支持自由类型转换成为适用(或者要求)的内容以便于使用。

弱类型的Javascript不会按照程序员的愿望从实际的变量类型到所需要的数据类型转换,例如一个非常常见的错误,在浏览器脚本中,从表单控件中获取用户将要输入的一个数值类型的变量与另一个数值变量的和。因为变量类型在表单控件中是字符串类型(计时字符串序列包含一个数字)这种尝试将会添加那个字符串到变量,即使这些值碰巧是一些数字,结果在第二个变量将会被转换为字符串类型,在最后只会把从表单控件中得到的变量添加到第一个字符串末尾。

转换到布尔类型

当表达式是 if 以及其他一些判断情况时,类型转换的结果将会是布尔型为了用于判断。这些判断包括逻辑运算比如 与 (&&), 或 (||) 以及 非 (!)。 非运算转换变量为波尔型并且如果变量是波尔型-真。那么将返回假,反之将返回真。两次非操作将会返回等同于变量转换成为波尔型的值。
var boolValue = !!x;
这个技巧将会后面将会用到。
另外一种可选择的方法就是把目标作为参数传递给Boolean 构造函数。
var boolValue = Boolean(x);
(1) 当数值类型转换为布尔型时,数值零将会变成假而其他数值将会变成真。除开特殊数值 NaN (Not a Number),NaN 被用于其他类型转换到数值类型时当没有返回一个有意义的数值时。NaN 总是返回假。 无论是无限大还是无限小或者是有限数值,只要不是零,在转换为布尔型时总是返回true。
(2) 字符串类型转换规则是简单的,字符串类型转换到布尔型除了空字符串外都是返回真,空字符串返回假。
(3) 对于其他类型,undefined 和 null 将会返回假,Object以及function类型总是返回真。
当需要判断某一对象是否是未定义的对象时,这是最有价值的功能。如果调用未定义的变量(undefined 或者 null) 将会产生错误。当这些都还不确定时(通常是网页浏览器所关心的)为了避免代码产生错误,需要对对象进行 if 判断。建议把对象作为表达式,转换为波尔型,如果返回 false 则说明对象不存在,如果返回 true 则说明对象存在。
if(document.documentElement){
scrollX = document.documentElement.scrollLeft;
}
两次非操作可以判断对象是否能被使用。

var hasDocEl = !!document.documentElement; 
... 
if(hasDocEl){ 
scrollX = document.documentElement.scrollLeft; 
}

转换到字符串类型

Javascript 类型转换方法
另外一种可选择的方法就是把目标作为参数传递给 String 构造函数。

var stringValue = String(x);

注意上面数值 123e-2 已经被转换为字符串 "1.23" ,因为已经由科学计数法转换为普通表达式了。然而,Javascript 的本质数值类型是来自于IEEE的双精度浮点类型,这就意味着只能储存有限的精度。数学操作结果可能只能产生近似的值。当他们转换到字符串时,可能会收到意想不到(指坏的)的结果。所以常常需要设置特定的定制函数用以获得可接受的结果。这种类型转换机制难以保证正常结果。

当一个对象或者函数被转换为字符串时,他们的 toString 方法将会被调用。默认会执行 Object.prototype.toString 以及Function.prototype.toString 除 除非重写 "toString" 方法。把一个函数转换到字符串,返回结果并非是必须的.Function.prototype.toString 方法就能完成大部分需要,它将会返回 "host objects" 和方法(这个对象和方法取决于不同环境,比如 DOM 元素)。

转换到数值型

转换到数值类型,特别是由字符串转换到数值类型,有很多通用的方法,任何数学操作方法除了加法( + )都会执行类型转换。所以转换字符串类型到数值类型可以使之与一个数值操作,比如减去零或者乘以一。

var numValue = stringValue - 0;

/* or */

var numValue = stringValue * 1;

/* or */

var numValue = stringValue / 1;

但是 + (取正)操作还是可以转换字符串类型到数值类型。因为他不做任何计算操作,所以这种方法是最快的。

顺便一提,相反数操作 - 同样也会执行类型转换,使得目标成为相反的结果。

var numValue = (+stringValue);

/* 这是不必要的,在 + 操作后已经被添加了括弧,只是为了使得代码更容易被人理解并且使得他很清楚,特别是避免了与添加和连续操作相混淆。

+ (取正)操作是最快的转换字符串类型到数值类型的方法。传递给 Number 构造函数一个参数,它将会执行类型转换并且返回一个数值类型。
var numValue = Number(stringValue);
Number构造函数是最慢的类型转换方法,但是当速度不是所考虑的关键时,使用它能够使得代码变得很干净。

对于其他类型,Objects 和 functions 总是被转换为 NaN 。undefined 与 null 同样代表没有东西,但是只有 null 被转换为数值零。可能是因为他们先被转换为波尔型,然后才转换为数值型,在上文中转换为波尔型的结果已经很清楚了, null 转换为波尔型将会返回 false 。它将会变为数值零。他们几乎都不必转换为数值类型,他们如何进行转换的真正意义在于为了考虑一些偶然的结果,要转换一个字符串时,结果返回的是他们这些(或者是由于进行了一些数学计算操作才返回了这些)。

parseFloat

Javascript 类型转换方法

对于 parseFloat 解析空字符串将会返回对于 parseFloat 解析空字符串将会返回 NaN ,是因为空字符串不属于数字表达式。指数可以被解析,由0起头的八进制不会阻止字符串解析为十进制数。十六进制数却因为 "x" 无法作为数字被解析而停止解析而返回一个零。

Javascript 类型转换方法

非字符串类型转换成为快速转换,作为一个字符串传递给 parseFloat 。当那些类型转换作为字符串时不在是正常的结果,它的解析结果是 NaN,Objects 和 functions 。可能有自定义 toString 方法返回字符串将会被解析成为数值,这是一个特殊的要求。

parseInt
parseInt 函数的工作方式和parseFloat 有些相似,不同之处在于它是尝试把字符串转换为整型数值,只能辨认几个少数作为数字的符号。

parseInt 函数偶尔被用作转换单精度浮点数值类型为整型。由于这种转换首先要从字符串类型转换到单精度数值类型所以是不太适用的。另外由于它会产生一些错误,所以变得非常没有效率,比如 2e-200 这个科学计数法的数值正确的返回因该是零,但是 parseInt 返回 2。并且由于是Javascript 格式化,数值常常返回的是一些近似值。比如 1/2 + 1/3 + 1/6 = 0.9999999999999999 ,这个表达式的结果的近似值应该是 1 ,但 parseInt 竟会返回 0。
可以取得近似值的 Math.round,Math.ceil 和 Math.floor 都比较合适这个工作,为了取得结果,表达式将会被作为32位有符号整型,这个规则同样适用于下面这些情况。

注 Math.round 函数执行的是常见的四舍五入,0.4以及一下将会被忽略,0.5以及以上将会被加1。Math.ceil 函数在只要有小数的情况是就加1 。Math.floor 函数则无论小数大小都会被忽略。由这些函数的定义可知 parseInt 方法对于小数采取的是同 Math.floor 一样的处理方式。

ToInt32
ToInt32 是一个内置函数,虽然很有用,但是无法像 parseInt 一样被直接调用。用它转换Javascript变量到数值有一些不同寻常的方式。但是它能在一些有限的情况下被使用。位操作,比如按位OR(|)和 按位AND (&) 操作数值时,在使用它们操作时能被转换为数值类型。但是他们只工作在32位有符号的整形中,所以我们可以通过调用内置函数 ToInt32 返回已转换的32位有符号整形变量(进行类型转换)。结果就像是 parseInt 函数调用后,只是结果被限定为32位,因此都是数值,而没有 NaN 或者 Infinity。就算是用空值进行操作,结果返回的也是一个数值,使用一个位运算不会印象结果,却可以调用 ToInt32 函数。

甚至 undefined, objects 和 functions 都被转换为 0,布尔值 true 被转换成了数值 1。

文章作者:高维鹏(Brian)
文章出处:http://www.cnblogs.com/gaoweipeng

Javascript 相关文章推荐
JavaScript 高级篇之函数 (四)
Apr 07 Javascript
node.js中的buffer.slice方法使用说明
Dec 10 Javascript
JS点击链接后慢慢展开隐藏着图片的方法
Feb 17 Javascript
vue,angular,avalon这三种MVVM框架优缺点
Apr 27 Javascript
js获取所有checkbox的值的简单实例
May 30 Javascript
JS简单实现点击按钮或文字显示遮罩层的方法
Apr 27 Javascript
js随机生成一个验证码
Jun 01 Javascript
基于Vue实现支持按周切换的日历
Sep 24 Javascript
nuxt+axios解决前后端分离SSR的示例代码
Oct 24 Javascript
浅谈vue后台管理系统权限控制思考与实践
Dec 19 Javascript
JS使用正则表达式判断输入框失去焦点事件
Oct 16 Javascript
解决vue的过渡动画无法正常实现问题
Oct 31 Javascript
js创建对象的几种常用方式小结(推荐)
Oct 24 #Javascript
JavaScript arguments 多参传值函数
Oct 24 #Javascript
ExtJs事件机制基本代码模型和流程解析
Oct 24 #Javascript
JQuery EasyUI 对话框的使用方法
Oct 24 #Javascript
javascript textContent与innerText的异同分析
Oct 22 #Javascript
js各种验证文本框输入格式(正则表达式)
Oct 22 #Javascript
JavaScript学习点滴 call、apply的区别
Oct 22 #Javascript
You might like
PHP5 操作MySQL数据库基础代码
2009/09/29 PHP
php 上传文件类型判断函数(避免上传漏洞 )
2010/06/08 PHP
PHP+SQL 注入攻击的技术实现以及预防办法
2011/01/27 PHP
destoon各类调用汇总
2014/06/20 PHP
javascript编程起步(第五课)
2007/02/27 Javascript
javascript下给元素添加事件的方法与代码
2007/08/13 Javascript
浏览器窗口加载和大小改变事件示例
2014/02/27 Javascript
不同编码的页面表单数据乱码问题解决方法
2015/02/15 Javascript
实例详解angularjs和ajax的结合使用
2015/10/22 Javascript
解决微信浏览器Javascript无法使用window.location.reload()刷新页面
2016/06/21 Javascript
JS实现JSON.stringify的实例代码讲解
2017/02/07 Javascript
Nodejs调用WebService的示例代码
2017/09/29 NodeJs
JavaScript设计模式之装饰者模式实例详解
2019/01/17 Javascript
详解vue2.6插槽更新v-slot用法总结
2019/03/09 Javascript
JS/CSS实现字符串单词首字母大写功能
2019/09/03 Javascript
深入理解javascript prototype的相关知识
2019/09/19 Javascript
javascript实现鼠标点击生成文字特效
2019/12/24 Javascript
[35:27]完美世界DOTA2联赛循环赛 GXR vs FTD BO2第二场 10.29
2020/10/29 DOTA
Numpy数据类型转换astype,dtype的方法
2018/06/09 Python
详解TensorFlow查看ckpt中变量的几种方法
2018/06/19 Python
python 读取摄像头数据并保存的实例
2018/08/03 Python
python 切换root 执行命令的方法
2019/01/19 Python
Python列表常见操作详解(获取,增加,删除,修改,排序等)
2019/02/18 Python
python实现超市商品销售管理系统
2019/10/25 Python
Django框架安装方法图文详解
2019/11/04 Python
Pandas时间序列重采样(resample)方法中closed、label的作用详解
2019/12/10 Python
python django中8000端口被占用的解决
2019/12/17 Python
Python使用QQ邮箱发送邮件报错smtplib.SMTPAuthenticationError
2019/12/20 Python
app内嵌H5 webview 本地缓存问题的解决
2020/10/19 HTML / CSS
历史学专业推荐信
2013/11/06 职场文书
大学系主任推荐信范文
2013/12/24 职场文书
更夫岗位责任制
2014/02/11 职场文书
商场促销活动总结
2014/07/10 职场文书
走群众路线学习心得体会
2014/10/31 职场文书
租车协议书
2015/01/27 职场文书
幼儿园园长六一致辞
2015/07/31 职场文书