深入理解JS中Number(),parseInt(),parseFloat()三者比较


Posted in Javascript onAugust 24, 2018

参考阅读:

在项目开发中我们经常会用到转型方法,尤其是JS这种松散型的语言。其中比较常用的方法就是Number()方法和ParseInt()/ParseFloat()方法了,下面我们分别对这几种方法的转型机制进行详细地说明。具体内容详情如下所示:

【正文内容】

Number()

-------------------------------------------------------------------------------------
--Number()
--
--
--Boolean值,true和false值将分别被转为1和0。
--
--数字值,整型就是整型,浮点型就是浮点型,科学计数就科学计数
--
--null值,转为0
--
--二进制,八进制,十六进制格式,转为十进制的数值
--
--字符串为空,转为0
--
--字符串中是纯科学计数,数值会直接转为十进制的数值
--
--undefined , 对象 , 数组 ,字符串不为纯数字和科学计数时 返回NaN

------------------------------------------------------------------------------------ 

 //JS区分0和-0
 var num = 123;
 var num = 123.123;
 var num = 0b10;
 var num = 010;
 var num = 0xff;
 var num = 5e2;
 var num = 5e-2;
 var num = NaN;
 console.log('值: ' , num);
 console.log('类型: ' , typeof(num))
 //NaN本身为false
 //其他类型转为数值失败时都为NaN
 console.log(NaN - 100);
 if(NaN){
  console.log('Yes');
 }else{
  console.log('No');
 }
 //NaN
 var a = '123ad';
 //123
 var a = '123';
 //NaN
 var a = 'f3ad';
 //0
 var a = false;
 //1
 var a = true;
 //NaN
 var a = undefined;
 var a = new Object();
 var a = Array(1,23);
 //1e+124
 var a = 10e123;
 //3
 var a = 0b11;
 //255
 var a = 0xff;
 //1.23
 var a = 1.23;
 //0
 var a = '';
 //1200
 var a = '12e2';
 //0
 var a = null;
 //90
 var a = 0132;
 var n = Number(a);
 console.log(n);

parseInt()

----------------------------------------------------------------------------------------------------------------------------------------
--parseInt()
--
--
--数值正常转化,如果为浮点数,则转为整型,舍弃小数点后的数值
--
--字符串起始包含数字时则数字那段转为数值,后面舍弃
--
--二进制,八进制,十六进制转化时,转化为十进制的数值
--
--科学计数法,能解析时正常解析,不能时返回第一个数字
--
--Boolean,undefined , 对象 , 数组 ,空字符串,字符串开头不为纯数字和科学计数时 返回NaN
--
--parseInt()方法还有基模式,可以把二进制、八进制、十六进制或其他任何进制的字符串转换成整数。
----------------------------------------------------------------------------------------------------------------------------------------       

//123
 var a = '123ad';
 //123
 var a = '123';
 //NaN
 var a = 'f3ad';
 //NaN
 var a = false;
 //NaN
 var a = true;
 //NaN
 var a = undefined;
 var a = new Object();
 //13 第一个值
 var a = Array(13,2);
 //3100000能够解析处时正常解析,不能时只返回第一个数字
 var a = 31e5;
 //3
 var a = 0b11;
 //255
 var a = 0xff;
 //1
 var a = 1.23;
 //NaN
 var a = '';
 //12 字符串只返回12e舍弃
 var a = '12e2';
 //NaN
 var a = null;
 //1
 var a = 1.5;
 //90
 var a = 0132;
 var n = parseInt(a);
 console.log(n);
 var a = parseInt("10",2);
 var a = parseInt("FF",16);
 var a = parseInt("10",8);
 console.log(a);

 parseFloat()

--------------------------------------------------------------------------------------------------------------------------------
--parseFloat()
--
--
--数值正常转化,整型为整型,浮点型为浮点型
--
--字符串起始包含数字时则数字那段转为数值,后面舍弃
--
--二进制,八进制,十六进制转化时,转化为十进制的数值
--
--科学计数法,能解析时正常解析,超出范围则返回Infinity
--
--Boolean,undefined , 对象 , 数组 ,空字符串,字符串开头不为纯数字和科学计数时 返回NaN
--
--不能有多个小数点报语法错误
--------------------------------------------------------------------------------------------------------------------------------       

//123
 var a = '123ad';
 //123
 var a = '123';
 //NaN
 var a = 'f3ad';
 //NaN
 var a = false;
 //NaN
 var a = true;
 //NaN
 var a = undefined;
 var a = new Object();
 //13 第一个值
 var a = Array(13,2);
 //3100000 范围过大将转为科学计数法再大将为Infinity
 var a = 31e5;
 //3
 var a = 0b11;
 //255
 var a = 0xff;
 //1.23
 var a = 1.23;
 //NaN
 var a = '';
 //1200
 var a = '12e2aa';
 //NaN
 var a = null;
 //1.5
 var a = 1.5;
 //90
 var a = 0132;
 //
 var a = 1.113;
 var n = parseFloat(a);
 console.log(n);

总结

以上所述是小编给大家介绍的深入理解JS中Number(),parseInt(),parseFloat()三者比较,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jQuery选择器简明总结(含用法实例,一目了然)
Apr 25 Javascript
KnockoutJS 3.X API 第四章之数据控制流if绑定和ifnot绑定
Oct 10 Javascript
jQuery实现拖动剪裁图片作为头像
Dec 28 Javascript
javascript自执行函数
Feb 10 Javascript
jquery实现图片平滑滚动详解
Mar 22 jQuery
AngularJS监听ng-repeat渲染完成的方法
Mar 20 Javascript
使用angular-cli webpack创建多个包的方法
Oct 16 Javascript
解决使用layui的时候form表单中的select等不能渲染的问题
Sep 18 Javascript
node省市区三级数据性能测评实例分析
Nov 06 Javascript
Vue2.4+新增属性.sync、$attrs、$listeners的具体使用
Mar 08 Javascript
Vue项目中使用flow做类型检测的方法
Mar 18 Javascript
让你30分钟快速掌握vue3教程
Oct 26 Javascript
微信小程序支付PHP代码
Aug 23 #Javascript
vue+axios 前端实现的常用拦截的代码示例
Aug 23 #Javascript
详解如何配置vue-cli3.0的vue.config.js
Aug 23 #Javascript
JS使用Date对象实时显示当前系统时间简单示例
Aug 23 #Javascript
React key值的作用和使用详解
Aug 23 #Javascript
vue项目中使用lib-flexible解决移动端适配的问题解决
Aug 23 #Javascript
从零开始学习搭建React脚手架项目
Aug 23 #Javascript
You might like
php中strtotime函数性能分析
2016/11/20 PHP
CodeIgniter框架常见用法工作总结
2017/03/16 PHP
PHP实现提取多维数组指定一列的方法总结
2019/12/04 PHP
jQuery实现给页面换肤的方法
2015/05/30 Javascript
点评js异步加载的4种方式
2015/12/22 Javascript
jQuery事件的绑定、触发、及监听方法简单说明
2016/05/10 Javascript
jQuery中借助deferred来请求及判断AJAX加载的实例讲解
2016/05/24 Javascript
点击页面任何位置隐藏div的实现方法
2016/09/05 Javascript
JS防止网页被嵌入iframe框架的方法分析
2016/09/13 Javascript
JavaScript实现的商品抢购倒计时功能示例
2017/04/17 Javascript
详解AngularJS脏检查机制及$timeout的妙用
2017/06/19 Javascript
使用prop解决一个checkbox选中后再次选中失效的问题
2017/07/05 Javascript
基于Vuejs的搜索匹配功能实现方法
2018/03/03 Javascript
vue 进阶之实现父子组件间的传值
2019/04/26 Javascript
js实现文章目录索引导航(table of content)
2020/05/10 Javascript
解决vue项目input输入框双向绑定数据不实时生效问题
2020/08/05 Javascript
JavaScript 实现下雪特效的示例代码
2020/09/09 Javascript
详解python做UI界面的方法
2019/02/27 Python
python+os根据文件名自动生成文本
2019/03/21 Python
Python3 io文本及原始流I/O工具用法详解
2020/03/23 Python
python中matplotlib实现随鼠标滑动自动标注代码
2020/04/23 Python
Tensorflow使用Anaconda、pycharm安装记录
2020/07/29 Python
推荐10个CSS3 制作的创意下拉菜单效果
2014/02/11 HTML / CSS
Ted Baker英国官网:男士和女士服装及配件
2017/03/13 全球购物
Answear匈牙利:来自全球200多个知名时尚品牌
2017/04/21 全球购物
预订从美国飞往印度的机票:MyTicketsToIndia
2017/05/19 全球购物
内部类的定义、种类以及优点
2013/10/16 面试题
护理学毕业生求职信
2013/11/14 职场文书
公职人员索取回扣检举信
2014/04/04 职场文书
卫生系统先进事迹
2014/05/13 职场文书
房地产广告策划方案
2014/05/15 职场文书
单位单身证明样本
2014/10/11 职场文书
学前班学生评语
2014/12/29 职场文书
2016中秋晚会开幕词
2016/03/03 职场文书
python百行代码实现汉服圈图片爬取
2021/11/23 Python
MySQL深分页问题解决思路
2022/12/24 MySQL