js字符串转换成数字与数字转换成字符串的实现方法


Posted in Javascript onJanuary 08, 2014

js字符串转换成数字

将字符串转换成数字,得用到parseInt函数。
parseInt(string) : 函数从string的开始解析,返回一个整数。

举例:
parseInt('123') : 返回 123(int);
parseInt('1234xxx') : 返回 1234(int);

如果解析不到数字,则将返回一个NaN的值,可以用isNaN()函数来检测;

举例 :
var i = parseInt('abc');
if (isNaN(i))
{
alert('NaN value');
}

同样的parseFloat函数是将字符串转换成浮点数。

举例:parseFloat('31.24abc') : 返回 31.24;

js数字转换成字符串

将字符串转换成数字,得用到String类的toString方法

举例:
var i = 10;
var s = i.toString();
alert(typeof s); //将输出 String

js数字与字符串的区别

js的数字的加法与字符串的连接都是 + 符号, 所以究竟是加还是字符串的连接就取决与变量的类型。

举例:
var a = 'abc' + 'xyz'; //a的值为:abcxyz,字符串与字符串是连接
var a = 10 + 5; //a的值为:15,数字是加
var a = 'abc' + 10; //a的值为:abc10,字符串与数字,自动将10转换成字符串了
var a = 'abc' + 10 + 20 + 'cd'; //a的值为:abc1020cd
var a = 10 + 20 + 'abc' + 'cd'; //a的值为:30abccd,可以数字加的先数字加,然后再连接

补充:

js字符串转换数字。方法主要有三种

转换函数、强制类型转换、利用js变量弱类型转换。

1. 转换函数:

js提供了parseInt()和parseFloat()两个转换函数。前者把值转换成整数,后者把值转换成浮点数。只有对String类型调用这些方法,这两个函数才能正确运行;对其他类型返回的都是NaN(Not a Number)。

一些示例如下:

parseInt("1234blue"); //returns 1234
parseInt("0xA"); //returns 10
parseInt("22.5"); //returns 22
parseInt("blue"); //returns NaN

parseInt()方法还有基模式,可以把二进制、八进制、十六进制或其他任何进制的字符串转换成整数。基是由parseInt()方法的第二个参数指定的,示例如下:

parseInt("AF", 16); //returns 175
parseInt("10", 2); //returns 2
parseInt("10", 8); //returns 8
parseInt("10", 10); //returns 10
如果十进制数包含前导0,那么最好采用基数10,这样才不会意外地得到八进制的值。例如:
parseInt("010"); //returns 8
parseInt("010", 8); //returns 8
parseInt("010", 10); //returns 10

parseFloat()方法与parseInt()方法的处理方式相似。
使用parseFloat()方法的另一不同之处在于,字符串必须以十进制形式表示浮点数,parseFloat()没有基模式。

下面是使用parseFloat()方法的示例:
parseFloat("1234blue"); //returns 1234.0
parseFloat("0xA"); //returns NaN
parseFloat("22.5"); //returns 22.5
parseFloat("22.34.5"); //returns 22.34
parseFloat("0908"); //returns 908
parseFloat("blue"); //returns NaN

2. 强制类型转换

还可使用强制类型转换(type casting)处理转换值的类型。使用强制类型转换可以访问特定的值,即使它是另一种类型的。
ECMAScript中可用的3种强制类型转换如下:
Boolean(value)——把给定的值转换成Boolean型;
Number(value)——把给定的值转换成数字(可以是整数或浮点数);
String(value)——把给定的值转换成字符串。
用这三个函数之一转换值,将创建一个新值,存放由原始值直接转换成的值。这会造成意想不到的后果。
当要转换的值是至少有一个字符的字符串、非0数字或对象时,Boolean()函数将返回true。如果该值是空字符串、数字0、undefined或null,它将返回false。

可以用下面的代码段测试Boolean型的强制类型转换。

Boolean(""); //false ? empty string
Boolean("hi"); //true ? non-empty string
Boolean(100); //true ? non-zero number
Boolean(null); //false - null
Boolean(0); //false - zero
Boolean(new Object()); //true ? object

Number()的强制类型转换与parseInt()和parseFloat()方法的处理方式相似,只是它转换的是整个值,而不是部分值。示例如下:

法 结


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  

最后一种强制类型转换方法String()是最简单的,示例如下:

var s1 = String(null); //"null"
var oNull = null;
var s2 = oNull.toString(); //won't work, causes an error

3. 利用js变量弱类型转换

举个小例子,一看,就会明白了。
<script>
var str= '012.345 ';
var x = str-0;
x = x*1;
</script>

上例利用了js的弱类型的特点,只进行了算术运算,实现了字符串到数字的类型转换,不过这个方法还是不推荐的

Javascript 相关文章推荐
13个绚丽的Jquery 界面设计网站推荐
Sep 28 Javascript
jquery ajaxSubmit 异步提交的简单实现
Feb 28 Javascript
浅谈Javascript实现继承的方法
Jul 06 Javascript
js实现带农历和八字等信息的日历特效
May 16 Javascript
String字符串截取的四种方式总结
Nov 28 Javascript
JavaScript数组去重的6个方法
Jan 21 Javascript
微信小程序开发入门基础教程
Apr 19 Javascript
javaScript 逻辑运算符使用技巧整理
May 03 Javascript
最全的JavaScript开发工具列表 总有一款适合你
Jun 29 Javascript
jQuery自动或手动图片切换效果
Oct 11 jQuery
vue-cli3+ts+webpack实现多入口多出口功能
May 30 Javascript
交互式可视化js库gojs使用介绍及技巧
Feb 18 Javascript
JS获取计算机mac地址以及IP的实现方法
Jan 08 #Javascript
JavaScript+CSS控制打印格式示例介绍
Jan 07 #Javascript
jquery实现非叠加式的搜索框提示效果
Jan 07 #Javascript
使用JQUERY进行后台页面布局控制DIV实现左右式
Jan 07 #Javascript
JSF中confirm弹出框的用法示例介绍
Jan 07 #Javascript
jquery删除提示框弹出是否删除对话框
Jan 07 #Javascript
javascript表单验证使用示例(javascript验证邮箱)
Jan 07 #Javascript
You might like
谈谈关于php的优点与缺点
2013/04/11 PHP
PHP跳转页面的几种实现方法详解
2013/06/08 PHP
ThinkPHP标签制作教程
2014/07/10 PHP
php实现的简单美国商品税计算函数
2015/07/13 PHP
tp5框架使用cookie加密算法实现登录功能示例
2020/02/10 PHP
JavaScript中的正则表达式简明总结
2014/04/04 Javascript
ECMAScript 6即将带给我们新的数组操作方法前瞻
2015/01/06 Javascript
js获取checkbox值的方法
2015/01/28 Javascript
angular简介和其特点介绍
2015/01/29 Javascript
jQuery层动画定位滑动效果的方法
2015/04/30 Javascript
信息页文内画中画广告js实现代码(文中加载广告方式)
2016/01/03 Javascript
AngularJS向后端ASP.NET API控制器上传文件
2016/02/03 Javascript
微信小程序 SocketIO 实例讲解
2016/10/13 Javascript
浅谈Vue的基本应用
2016/12/27 Javascript
Angular2使用Angular-CLI快速搭建工程(二)
2017/05/21 Javascript
js设置随机切换背景图片的简单实例
2017/11/12 Javascript
JavaScript时间戳与时间日期间相互转换
2017/12/11 Javascript
bootstrap select2插件用ajax来获取和显示数据的实例
2018/08/09 Javascript
vue实现下拉加载其实没那么复杂
2019/08/13 Javascript
Python的Flask框架应用程序实现使用QQ账号登录的方法
2016/06/07 Python
Python中py文件引用另一个py文件变量的方法
2018/04/29 Python
python 循环读取txt文档 并转换成csv的方法
2018/10/26 Python
python 读取Linux服务器上的文件方法
2018/12/27 Python
python 实现方阵的对角线遍历示例
2019/11/29 Python
在python里创建一个任务(Task)实例
2020/04/25 Python
深入了解Python 变量作用域
2020/07/24 Python
Python如何在单元测试中给对象打补丁
2020/08/03 Python
Python远程linux执行命令实现
2020/11/11 Python
StubHub哥伦比亚:购买和出售您的门票
2016/10/20 全球购物
Clarks英国官方网站:全球领军鞋履品牌
2016/11/26 全球购物
架构师岗位职责
2013/11/18 职场文书
学校元旦晚会方案
2014/02/19 职场文书
公司处罚决定书
2015/06/24 职场文书
学生早退检讨书(范文)
2019/08/19 职场文书
详解Vue的options
2021/05/15 Vue.js
vue @ ~ 相对路径 路径别名设置方式
2022/06/05 Vue.js