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资料prototype 属性
Mar 13 Javascript
JS 无法通过W3C验证的处理方法
Mar 09 Javascript
JavaScript 布尔操作符解析  &amp;&amp; || !
Aug 10 Javascript
jquery 实现返回顶部功能
Nov 17 Javascript
jQuery内部原理和实现方式浅析
Feb 03 Javascript
JavaScript在浏览器标题栏上显示当前日期和时间的方法
Mar 19 Javascript
jQuery的extend方法【三种】
Dec 14 Javascript
Node.js 使用命令行工具检查更新
Jun 08 Javascript
Vue + Vue-router 同名路由切换数据不更新的方法
Nov 20 Javascript
实例教学如何写vue插件
Nov 30 Javascript
ES6 Promise对象的应用实例分析
Jun 27 Javascript
bootstrap-table+treegrid实现树形表格
Jul 26 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
WAR3重制版DOTA 5V5初体验
2020/04/09 DOTA
PHP使用http_build_query()构造URL字符串的方法
2016/04/02 PHP
PHP 自动加载的简单实现(推荐)
2016/08/12 PHP
javascript定时保存表单数据的代码
2011/03/17 Javascript
JS关闭窗口与JS关闭页面的几种方法小结
2013/12/17 Javascript
JavaScript中输出标签的方法
2014/08/27 Javascript
教你如何使用firebug调试功能了解javascript闭包和this
2015/03/04 Javascript
JS实现的表格行上下移动操作示例
2016/08/03 Javascript
使用jquery datatable和bootsrap创建表格实例代码
2017/03/17 Javascript
JS实现图片上传多次上传同一张不生效的处理方法
2018/08/06 Javascript
JavaScript使用prototype原型实现的封装继承多态示例
2018/08/31 Javascript
bootstrap Table实现合并相同行
2019/07/19 Javascript
Node.js系列之连接DB的方法(3)
2019/08/30 Javascript
Vue数字输入框组件的使用方法
2019/10/19 Javascript
vue-openlayers实现地图坐标弹框效果
2020/09/24 Javascript
python创建和使用字典实例详解
2013/11/01 Python
Python中的闭包实例详解
2014/08/29 Python
Python中map,reduce,filter和sorted函数的使用方法
2015/08/17 Python
django允许外部访问的实例讲解
2018/05/14 Python
python中字符串的操作方法大全
2018/06/03 Python
浅谈flask源码之请求过程
2018/07/26 Python
使用python将多个excel文件合并到同一个文件的方法
2019/07/09 Python
Python 读取用户指令和格式化打印实现解析
2019/09/02 Python
使用pytorch实现可视化中间层的结果
2019/12/30 Python
Python Celery异步任务队列使用方法解析
2020/08/10 Python
新郎父亲婚宴答谢词
2014/01/11 职场文书
喝酒检查书范文
2014/02/23 职场文书
教学质量评估实施方案
2014/03/17 职场文书
广告学专业毕业生自荐信
2014/05/28 职场文书
会计专业毕业生自荐书
2014/06/25 职场文书
作风转变心得体会
2014/09/02 职场文书
单位委托书格式范本
2014/09/29 职场文书
2015年销售内勤工作总结
2015/04/27 职场文书
一般纳税人申请报告
2015/05/18 职场文书
详解Python 3.10 中的新功能和变化
2021/04/28 Python
python+pytest接口自动化之token关联登录的实现
2022/04/06 Python