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 编程笔记 无名函数
Jun 28 Javascript
初学Jquery插件制作 在SageCRM的查询屏幕隐藏部分行的功能
Dec 26 Javascript
认识Knockout及如何使用Knockout绑定上下文
Dec 25 Javascript
js实现的彩色方块飞舞奇幻效果
Jan 27 Javascript
JS实现的表格行上下移动操作示例
Aug 03 Javascript
使用ionic在首页新闻中应用到的跑马灯效果的实现方法
Feb 13 Javascript
浅谈React Native 中组件的生命周期
Sep 08 Javascript
利用JS如何计算字符串所占字节数示例代码
Sep 13 Javascript
浅谈webpack性能榨汁机(打包速度优化)
Jan 09 Javascript
30分钟用Node.js构建一个API服务器的步骤详解
May 24 Javascript
Vue中多元素过渡特效的解决方案
Feb 05 Javascript
vue 实现动态路由的方法
Jul 06 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
discuz7 phpMysql操作类
2009/06/21 PHP
PHP中overload与override的区别
2017/02/13 PHP
详解PHP处理字符串类似indexof的方法函数
2017/06/11 PHP
YII2自动登录Cookie总是失效的解决方法
2017/06/28 PHP
制作特殊字的脚本
2006/06/26 Javascript
区分JS中的undefined,null,&quot;&quot;,0和false
2007/03/08 Javascript
JS中confirm,alert,prompt函数使用区别分析
2010/04/01 Javascript
js+css在交互上的应用
2010/07/18 Javascript
javascript时区函数介绍
2012/09/14 Javascript
raphael.js绘制中国地图 地图绘制方法
2014/02/12 Javascript
Jquery中find与each方法用法实例
2015/02/04 Javascript
web前端开发upload上传头像js示例代码
2016/10/22 Javascript
深入理解jQuery()方法的构建原理
2016/12/05 Javascript
JS原生轮播图的简单实现(推荐)
2017/07/22 Javascript
react-navigation 如何判断用户是否登录跳转到登录页的方法
2017/12/01 Javascript
jQuery实现标签子元素的添加和赋值方法
2018/02/24 jQuery
jQuery实现带右侧索引功能的通讯录示例【附源码下载】
2018/04/17 jQuery
详解微信JS-SDK选择图片遇到的坑
2018/08/15 Javascript
基于jQuery ztree实现表格风格的树状结构
2018/08/31 jQuery
angular4 获取wifi列表中文显示乱码问题的解决
2018/10/20 Javascript
LayUi使用switch开关,动态的去控制它是否被启用的方法
2019/09/21 Javascript
vue实现购物车的监听
2020/04/20 Javascript
详解Python中break语句的用法
2015/05/14 Python
Python中使用装饰器来优化尾递归的示例
2016/06/18 Python
浅谈Python类里的__init__方法函数,Python类的构造函数
2016/12/10 Python
神经网络理论基础及Python实现详解
2017/12/15 Python
python中selenium库的基本使用详解
2020/07/31 Python
HTML5 Geolocation API的正确使用方法
2018/12/04 HTML / CSS
澳大利亚自然和有机的健康美容产品一站式商店:Ziani Beauty
2017/12/28 全球购物
综合实践教学反思
2014/01/31 职场文书
先进事迹演讲稿
2014/09/01 职场文书
画展邀请函
2015/01/31 职场文书
2015年银行客户经理工作总结
2015/04/01 职场文书
numpy数据类型dtype转换实现
2021/04/24 Python
Python实现PIL图像处理库绘制国际象棋棋盘
2021/07/16 Python
HTML5 语义化标签(移动端必备)
2021/08/23 HTML / CSS