JavaScript字符串转数字的简单实现方法


Posted in Javascript onNovember 27, 2020

由于输入框或对话框返回的类型是字符串,但当我们想使用数字类型时进行一些数学的计算时我们就需要转换为数字类型,使用parseInt、parseFloat即可。

用法:↓

parseInt(想要转换的字符串) //转为 int类型
parseFloat(想要转换的字符串) //转为 float类型

parseInt

样例代码:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script>
			var age1 = prompt("请输入小明的年龄:"); // 12
			var age2 = prompt("请输入小刚的年龄:"); // 13
			
			//小明十年后 转int
			age1 = parseInt(age1);
			age1 += 10;
			
			//小刚十年后 不转 int
			age2 += 10;
			
			
			document.write("十年后小明的年龄:" + age1 + "</br>"); //22
			document.write("十年后小刚的年龄:" + age2); // 1310
			
		</script>
		<title></title>
	</head>
	<body>
		
		
	</body>
</html>

效果截图:

JavaScript字符串转数字的简单实现方法

很明显我们可以看出,如果不转int我们+10的时候就会得到拼接字符串的效果。

parseFloat

样例代码:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script>
			var num1 = prompt("请输入第一个数字(小数):"); // 11.22
			var num2 = prompt("请输入第二个数字(小数):"); // 22.33
			
			var num11=num1;
			var num22=num2;
			
			num1 = parseFloat(num1);
			num2 = parseFloat(num2);
			
			var sum = num1+num2; // 33.55
			
			var sum2 = num11 + num22; //11.2222.33
			
			document.write("相加的结果(转float):"+sum + "</br>");
			document.write("相加的结果(不转float):"+sum2);
		</script>
		<title></title>
	</head>
	<body>
	</body>
</html>

效果截图:

JavaScript字符串转数字的简单实现方法

同样我们可以看出,如果不转float我们就会得到拼接字符串的效果。

总结

到此这篇关于JavaScript字符串转数字的简单实现方法的文章就介绍到这了,更多相关JavaScript字符串转数字内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
一个JS翻页效果
Jul 23 Javascript
js如何设置在iframe框架中指定div不显示
Dec 04 Javascript
javascript使用定时函数实现跳转到某个页面
Dec 25 Javascript
JS和Jquery获取和修改label的值的示例代码
Jan 15 Javascript
使用jquery/js获取iframe父子级、同级获取元素的方法
Aug 05 Javascript
jquery.flot.js简单绘制折线图用法示例
Mar 13 Javascript
vuejs如何配置less
Apr 25 Javascript
jquery实现tab选项卡切换效果(悬停、下方横线动画位移)
May 05 jQuery
解决Vue使用mint-ui loadmore实现上拉加载与下拉刷新出现一个页面使用多个上拉加载后冲突问题
Nov 07 Javascript
vue2.0项目集成Cesium的实现方法
Jul 30 Javascript
图解JS原型和原型链实现原理
Sep 15 Javascript
js加减乘除精确运算方法实例代码
Jan 17 Javascript
使用vue编写h5公众号跳转小程序的实现代码
Nov 27 #Vue.js
JavaScript中的Proxy对象
Nov 27 #Javascript
详解JavaScript中的链式调用
Nov 27 #Javascript
在Vue中使用CSS3实现内容无缝滚动的示例代码
Nov 27 #Vue.js
vuex的数据渲染与修改浅析
Nov 26 #Vue.js
vue动态合并单元格并添加小计合计功能示例
Nov 26 #Vue.js
JavaScript用document.write()输出换行的示例代码
Nov 26 #Javascript
You might like
计算php页面运行时间的函数介绍
2013/07/01 PHP
destoon网站转移服务器后搜索汉字出现乱码的解决方法
2014/06/21 PHP
PHP开发之归档格式phar文件概念与用法详解【创建,使用,解包还原提取】
2017/11/17 PHP
在视频前插入广告
2006/11/20 Javascript
js控制div及网页相关属性的代码
2009/12/19 Javascript
js常用代码段收集
2011/10/28 Javascript
JQuery UI的拖拽功能实现方法小结
2012/03/14 Javascript
jquery常用特效方法使用示例
2014/04/25 Javascript
js的for in循环和java里foreach循环的区别分析
2015/01/28 Javascript
Javascript 正则表达式实现为数字添加千位分隔符
2015/03/10 Javascript
JavaScript实现数字数组按照倒序排列的方法
2015/04/06 Javascript
jQuery+html5实现div弹出层并遮罩背景
2015/04/15 Javascript
JavaScript保存并运算页面中数字类型变量的写法
2015/07/06 Javascript
js+canvas绘制五角星的方法
2016/01/28 Javascript
js实现带农历和八字等信息的日历特效
2016/05/16 Javascript
bootstrap读书笔记之CSS组件(上)
2016/10/17 Javascript
Bootstrap轮播图的使用和理解4
2016/12/14 Javascript
BootStrap3使用错误记录及解决办法
2016/12/22 Javascript
vue2组件实现懒加载浅析
2017/03/29 Javascript
ionic 3.0+ 项目搭建运行环境的教程
2017/08/09 Javascript
vue做网页开场视频的实例代码
2017/10/20 Javascript
localstorage实现带过期时间的缓存功能
2019/06/28 Javascript
Vue的路由及路由钩子函数的实现
2019/07/02 Javascript
[15:57]教你分分钟做大人:斧王
2014/10/30 DOTA
django框架用户权限中的session缓存到redis中的方法
2019/08/06 Python
Python如何在DataFrame增加数值
2020/02/14 Python
Python如何实现的二分查找算法
2020/05/27 Python
python代码实现猜拳小游戏
2020/11/30 Python
一道SQL存储过程面试题
2016/10/07 面试题
经理管理专业自荐信范文
2013/12/31 职场文书
店长职务说明书
2014/02/04 职场文书
学校领导干部民主生活会整改方案
2014/09/29 职场文书
环卫工人慰问信
2015/02/15 职场文书
小学秋季运动会通讯稿
2015/11/25 职场文书
2019年消防宣传标语集锦
2019/11/21 职场文书
海康机器人重磅发布全新算法开发平台VM4.2
2022/04/21 数码科技