JS 类型转换常见方法小结


Posted in Javascript onMay 31, 2010

一、类型转换

1.转换成字串

ECMAScript的Boolean值、数字和字串的原始值的有趣之处在于它们是伪对象,这意味着它们实际上具有属性和方法。
如:

Js代码

var sColor = "blue"; 
alert(sColor.length);//outputs "4" 
var sColor = "blue"; 
alert(sColor.length);//outputs "4"

总而言之,3种主要的原始值Boolean值、数字和字串都有toString()方法。ECMAScript定义的所有对象都有toString()方法,无论它是伪对象,还是真的对象。

Boolean型的toString()方法只是输出"true"或"false",结果由变量的值决定:

Js代码

var bFound = false; 
alert(bFound.toString());//outputs "false" 
var bFound = false; 
alert(bFound.toString());//outputs "false"

Number类型的toString()方法比较特殊,它有两种模式,即默认模式和基模式,采用默认模式,toString()方法只是用相应的字符串输出数字值(无论是整数、浮点数还是科学记数法)。
Js代码

var iNum1 = 10; 
var fNum2 = 10.0; 
alert(iNum1.toString()); //outputs "10" 
alert(fNum2.toString()); //outputs "10" 
var iNum1 = 10; 
var fNum2 = 10.0; 
alert(iNum1.toString()); //outputs "10" 
alert(fNum2.toString()); //outputs "10"

采用Number类型的toString()方法的基模式,可以用不同的基(进制基数)输出数字。
Js代码

var iNum = 10; 
alert(iNum.toString(2)); //outputs "1010" 
alert(iNum.toString(8)); //outputs "12" 
alert(iNum.toString(16)); //outputs "A" 
var iNum = 10; 
alert(iNum.toString(2)); //outputs "1010" 
alert(iNum.toString(8)); //outputs "12" 
alert(iNum.toString(16)); //outputs "A"

2.转换成数字

ECMAScript提供了两种把非数字的原始值转换成数字的方法,即parseInt()和parseFloat()。
注意:只有对String类型(Number除外)调用这些方法,才能正确运行对其他类型返回的都是NaN。

例如:
Js代码

var iNum1 = parseInt("1234blue");//returns 1234 
var iNum2 = parseInt("oxA"); //returns 10 
var iNum3 = parseInt("22.5"); //returns 22 
var iNum4 = parseInt("blue"); //returns NaN 
var iNum1 = parseInt("1234blue");//returns 1234 
var iNum2 = parseInt("oxA"); //returns 10 
var iNum3 = parseInt("22.5"); //returns 22 
var iNum4 = parseInt("blue"); //returns NaN

parseInt()方法还有基模式,可以把二进制、八进制、十六进制或者其他任何进制的字符串转换成十进制整数。第二个参数指定按哪一种进制来解析。
Js代码

var iNum1 = parseInt("AF",16);// returns 175 
var iNum2 = parseInt("10",2); // returns 2 
var iNum3 = parseInt("10",8); //returns 8 
var iNum4 = parseInt("10",10); //returns 10 
var iNum1 = parseInt("AF",16);// returns 175 
var iNum2 = parseInt("10",2); // returns 2 
var iNum3 = parseInt("10",8); //returns 8 
var iNum4 = parseInt("10",10); //returns 10

说明:如果十进制数包含前导0,那么最好采用基数10,否则得到的是八进制的值。
Js代码

var iNum1 = parseInt("010"); // returns 8 
var iNum2 = parseInt("010",8); //returns 8 
var iNum3 = parseInt("010",10);//returns 10 
var iNum1 = parseInt("010"); // returns 8 
var iNum2 = parseInt("010",8); //returns 8 
var iNum3 = parseInt("010",10);//returns 10

parseFloat()方法与parseInt()方法的处理方式相似,从位置0开始查看每个字符,直到找到第一个非有效的字符为止,然后把该字符之前的字串转换成数字。对于这个方法来说,第一个出现的小数点是有效字符。如果用两个小数点,第二个小数点将被看作无效的。使用该方法的另一个不同之处在于,字串必须以十进制形式表示浮点数。

Js代码

var fNum1 = parseFloat("1234blue"); //returns 1234.0 
var fNum2 = parseFloat("0xA"); //returns NaN 
var fNum3 = parseFloat("22.5"); //returns 22.5 
var fNum4 = parseFloat("22.34.5");//returns 22.34 
var fNum5 = parseFloat("0908");//returns NaN 
var fNum6 = parseFloat("blue");//returns NaN 
var fNum1 = parseFloat("1234blue"); //returns 1234.0 
var fNum2 = parseFloat("0xA"); //returns NaN 
var fNum3 = parseFloat("22.5"); //returns 22.5 
var fNum4 = parseFloat("22.34.5");//returns 22.34 
var fNum5 = parseFloat("0908");//returns NaN 
var fNum6 = parseFloat("blue");//returns NaN

3.强制类型转换
ECMAScript中可用的3种强制类型转换如下:
(1).Boolean(value)
把给定的值转换成Boolean型。
当要转换的值是至少有一个字符的字符串、非0数字或对象时,Boolean()函数将返回true。如果该值是空字符串、数字0、undefined或null,它将返回false。
如:
Js代码

var b1 = Boolean(""); // false; 
var b2 = Boolean("hi");//true 
var b3 = Boolean(100);//true 
var b4 = Boolean(null);//false 
var b5 = Boolean(0);//false 
var b6 = Boolean(new Object());//true 
var b1 = Boolean(""); // false; 
var b2 = Boolean("hi");//true 
var b3 = Boolean(100);//true 
var b4 = Boolean(null);//false 
var b5 = Boolean(0);//false 
var b6 = Boolean(new Object());//true

(2).Number(value)
把给定的值转换成数字(可以是整数或浮点数)。
还记得parseInt()和parseFloat()方法只转换第一个无效字符之前的字符串,因此"4.5.6"将被转换为"4.5"。用 Number()进行强制类型转换,"4.5.6"将返回NaN,因为整个字符串值不能转换成数字。如果字符串能被完整地转换,Number()将判断是调用parseInt()方法还是调用parseFloat()方法。
如:
Js代码

Number(false);//0 
Number(true);//1 
Number(undefined);//NaN 
Number(null);//0 
Number("5.5");//5.5 
Number("56");//56 
Number("5.6.7");//NaN 
Number(new Object());//NaN 
Number(100);//100 
Number(false);//0 
Number(true);//1 
Number(undefined);//NaN 
Number(null);//0 
Number("5.5");//5.5 
Number("56");//56 
Number("5.6.7");//NaN 
Number(new Object());//NaN 
Number(100);//100

(3).String(value)
把给定的值转换成字串。
与调用toString()方法的唯一不同之处在于,对null或undefined值强制类型转换可以生成字符串而不引发错误:
Js代码

var s1 = String(null);//"null" 
var oNull = null; 
var s2 = oNull.toString();//causes an error
Javascript 相关文章推荐
jq选项卡鼠标延迟的插件实例
May 13 Javascript
jquery和javascript的区别(常用方法比较)
Jul 04 Javascript
js判断屏幕分辨率的代码
Jul 16 Javascript
js中function()使用方法
Dec 24 Javascript
jQuery中的read和JavaScript中的onload函数的区别
Aug 27 Javascript
javascript中的this详解
Dec 08 Javascript
JavaScript动态创建link标签到head里的方法
Dec 22 Javascript
jQuery的ready方法实现原理分析
Oct 26 Javascript
Laravel整合Bootstrap 4的完整方案(推荐)
Jan 25 Javascript
vue实现多级菜单效果
Oct 19 Javascript
前端vue-cli项目中使用img图片和background背景图的几种方法
Nov 13 Javascript
Element el-button 按钮组件的使用详解
Feb 01 Javascript
javascript 传统事件模型构造的事件监听器实现代码
May 31 #Javascript
LazyLoad 延迟加载(按需加载)
May 31 #Javascript
基于jquery的气泡提示效果
May 31 #Javascript
niceTitle 基于jquery的超链接提示插件
May 31 #Javascript
jQuery 获取对象 根据属性、内容匹配, 还有表单元素匹配
May 31 #Javascript
jQuery 获取对象 定位子对象
May 31 #Javascript
jQuery 获取对象 基本选择与层级
May 31 #Javascript
You might like
php中防止恶意刷新页面的代码小结
2012/10/31 PHP
利用PHPStorm如何开发Laravel应用详解
2017/08/30 PHP
PHP应用跨时区功能的实现方法
2019/03/21 PHP
PHP实现本地图片转base64格式并上传
2020/05/29 PHP
制作特殊字的脚本
2006/06/26 Javascript
node.js开机自启动脚本文件
2014/12/24 Javascript
jquery实现点击变换导航样式的方法
2015/08/31 Javascript
Angularjs 设置全局变量的方法总结
2016/10/20 Javascript
jquery css实现邮箱自动补全
2016/11/14 Javascript
Node.js中使用mongoose操作mongodb数据库的方法
2017/09/12 Javascript
bootstrap fileinput插件实现预览上传照片功能
2018/01/23 Javascript
ios设备中angularjs无法改变页面title的解决方法
2018/09/13 Javascript
vue3.0 CLI - 1 - npm 安装与初始化的入门教程
2018/09/14 Javascript
Vuex 快速入门(简单易懂)
2018/09/20 Javascript
新手快速上手webpack4打包工具的使用详解
2019/01/28 Javascript
小程序实现订单倒计时功能
2019/04/23 Javascript
[36:19]2018DOTA2亚洲邀请赛 小组赛 A组加赛 Newbee vs LGD
2018/04/03 DOTA
使用Python编写简单网络爬虫抓取视频下载资源
2014/11/04 Python
Python简单删除目录下文件以及文件夹的方法
2015/05/27 Python
实例讲解Python的函数闭包使用中应注意的问题
2016/06/20 Python
python实现ID3决策树算法
2017/12/20 Python
Python+matplotlib实现计算两个信号的交叉谱密度实例
2018/01/08 Python
Python决策树之基于信息增益的特征选择示例
2018/06/25 Python
Python标准库shutil用法实例详解
2018/08/13 Python
anaconda如何查看并管理python环境
2019/07/05 Python
python中eval与int的区别浅析
2019/08/11 Python
Django通过dwebsocket实现websocket的例子
2019/11/15 Python
Python中的面向接口编程示例详解
2021/01/17 Python
ECCO爱步官方旗舰店:丹麦鞋履品牌
2018/01/02 全球购物
怎样在 Applet 中建立自己的菜单(MenuBar/Menu)?
2012/06/20 面试题
六年级学生评语
2014/04/22 职场文书
放飞理想主题班会
2015/08/14 职场文书
小学音乐课教学反思
2016/02/18 职场文书
MySQL 存储过程的优缺点分析
2021/05/20 MySQL
linux下导入、导出mysql数据库命令的实现方法
2021/05/26 MySQL
nodejs利用readline提示输入内容实例代码
2021/07/15 NodeJs