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 相关文章推荐
JS之小练习代码
Oct 12 Javascript
JS的get和set使用示例
Feb 20 Javascript
JavaScript继承基础讲解(原型链、借用构造函数、混合模式、原型式继承、寄生式继承、寄生组合式继承)
Aug 16 Javascript
JavaScript计算某一天是星期几的方法
Aug 05 Javascript
如何消除inline-block属性带来的标签间间隙
Mar 31 Javascript
AngularJS  自定义指令详解及实例代码
Sep 14 Javascript
jQuery实现加入收藏夹功能(主流浏览器兼职)
Dec 24 Javascript
关于javascript事件响应的基础语法总结(必看篇)
Dec 26 Javascript
vue轮播图插件vue-awesome-swiper的使用代码实例
Jul 10 Javascript
基于vue.js路由参数的实例讲解——简单易懂
Sep 07 Javascript
微信小程序--特定区域滚动到顶部时固定的方法
Apr 28 Javascript
vue实现element表格里表头信息提示功能(推荐)
Nov 20 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
php如何解决无法上传大于8M的文件问题
2014/03/10 PHP
js导出table数据到excel即导出为EXCEL文档的方法
2013/10/10 Javascript
jquery 删除cookie失效的解决方法
2013/11/12 Javascript
Jquery方式获取iframe页面中的 Dom元素
2014/05/07 Javascript
javascript实现时间格式输出FormatDate函数
2015/01/13 Javascript
常常会用到的截取字符串substr()、substring()、slice()方法详解
2015/12/16 Javascript
javascript基础知识之html5轮播图实例讲解(44)
2017/02/17 Javascript
jQuery动态移除和添加背景图片的方法详解
2017/03/07 Javascript
js canvas实现适用于移动端的百分比仪表盘dashboard
2017/07/18 Javascript
Vue.js仿微信聊天窗口展示组件功能
2017/08/11 Javascript
原生JS实现瀑布流插件
2018/02/06 Javascript
vue-auto-focus: 控制自动聚焦行为的 vue 指令方法
2018/08/25 Javascript
vue 使某个组件不被 keep-alive 缓存的方法
2018/09/21 Javascript
angularjs手动识别字符串中的换行符方法
2018/10/02 Javascript
用python实现的可以拷贝或剪切一个文件列表中的所有文件
2009/04/30 Python
详解Python中的__init__和__new__
2014/03/12 Python
Python实现Logger打印功能的方法详解
2017/09/01 Python
python实现俄罗斯方块游戏
2020/03/25 Python
Python实现注册、登录小程序功能
2018/09/21 Python
Linux下Pycharm、Anaconda环境配置及使用踩坑
2018/12/19 Python
利用python实现在微信群刷屏的方法
2019/02/21 Python
django中ORM模型常用的字段的使用方法
2019/03/05 Python
详解pyppeteer(python版puppeteer)基本使用
2019/06/12 Python
django框架事务处理小结【ORM 事务及raw sql,customize sql 事务处理】
2019/06/27 Python
Numpy数组array和矩阵matrix转换方法
2019/08/05 Python
解决Tensorflow 内存泄露问题
2020/02/05 Python
python简单的三元一次方程求解实例
2020/04/02 Python
python实现从ftp上下载文件的实例方法
2020/07/19 Python
《小熊住山洞》教学反思
2014/02/21 职场文书
电子商务专业学生职业生涯规划
2014/03/07 职场文书
老师对学生的评语
2014/04/18 职场文书
基于Redis实现分布式锁的方法(lua脚本版)
2021/05/12 Redis
Vue如何实现组件间通信
2021/05/15 Vue.js
Mysql中where与on的区别及何时使用详析
2021/08/04 MySQL
MySQL修改默认引擎和字符集详情
2021/09/25 MySQL
Pillow图像处理库安装及使用
2022/04/12 Python