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 相关文章推荐
[原创]用javascript实现检测指定目录是否存在的方法
Jan 12 Javascript
jQuery实现form表单reset按钮重置清空表单功能
Dec 18 Javascript
javascript 通用loading动画效果实例代码
Jan 14 Javascript
jQuery判断数组是否包含了指定的元素
Mar 10 Javascript
javascript实现检验的各种规则
Jul 31 Javascript
js实现带缓冲效果的仿QQ面板折叠菜单代码
Sep 06 Javascript
angularjs2中父子组件的数据传递的实例代码
Jul 05 Javascript
js 获取html5的data属性实现方法
Jul 28 Javascript
vue项目在安卓低版本机显示空白的原因分析(两种)
Sep 04 Javascript
JS滚轮控制图片缩放大小和拖动的实例代码
Nov 20 Javascript
使用Vue父子组件通信实现todolist的功能示例代码
Apr 11 Javascript
JS代码编译器Monaco使用方法
Jun 11 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
PHP5.2下chunk_split()函数整数溢出漏洞 分析
2007/06/06 PHP
PHP mkdir()定义和用法
2009/01/14 PHP
[原创]ThinkPHP让../Public在模板不解析(直接输出)的方法
2015/10/09 PHP
CentOS下与Apache连接的PHP多版本共存方案实现详解
2015/12/19 PHP
php过滤htmlspecialchars() 函数实现把预定义的字符转换为 HTML 实体用法分析
2019/06/25 PHP
老鱼 浅谈javascript面向对象编程
2010/03/04 Javascript
jQuery的内容过滤选择器学习教程
2016/04/18 Javascript
Bootstrap3 图片(响应式图片&amp;图片形状)
2017/01/04 Javascript
Node.js如何响应Ajax的POST请求并且保存为JSON文件详解
2017/03/10 Javascript
JS实现的透明度渐变动画效果示例
2018/04/28 Javascript
微信小程序中this.data与this.setData的区别详解
2018/09/17 Javascript
Vue中 v-if 和v-else-if页面加载出现闪现的问题及解决方法
2018/10/12 Javascript
关于Vue源码vm.$watch()内部原理详解
2019/04/26 Javascript
用Angular实现一个扫雷的游戏示例
2020/05/15 Javascript
python入门之语句(if语句、while语句、for语句)
2015/01/19 Python
Flask框架的学习指南之开发环境搭建
2016/11/20 Python
python subprocess 杀掉全部派生的子进程方法
2017/01/16 Python
Python实现多线程抓取网页功能实例详解
2017/06/08 Python
浅谈python中copy和deepcopy中的区别
2017/10/23 Python
Python爬虫之pandas基本安装与使用方法示例
2018/08/08 Python
Python 实现判断图片格式并转换,将转换的图像存到生成的文件夹中
2020/01/13 Python
python定义类的简单用法
2020/07/24 Python
重构Python代码的六个实例
2020/11/25 Python
CSS3实现精美横向滚动菜单按钮
2017/04/14 HTML / CSS
CSS3实现内凹圆角的实例代码
2017/05/04 HTML / CSS
瑜伽灵感珠宝:Satya Jewelry
2018/01/06 全球购物
一套SQL笔试题
2016/08/14 面试题
优秀社区干部事迹材料
2014/02/03 职场文书
幼儿教育感言
2014/02/05 职场文书
政风行风建设责任书
2014/07/23 职场文书
爱护公共设施演讲稿
2014/09/13 职场文书
计划生育证明书写要求
2014/09/17 职场文书
后备干部推荐材料
2014/12/24 职场文书
责任书格式
2015/01/29 职场文书
放射科岗位职责
2015/02/14 职场文书
初中英语教师个人工作总结2015
2015/07/21 职场文书