深入理解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的loading效果实现代码
Nov 05 Javascript
js confirm()方法的使用方法实例
Jul 13 Javascript
js中事件的处理与浏览器对象示例介绍
Nov 29 Javascript
详解JavaScript逻辑Not运算符
Dec 04 Javascript
微信小程序 教程之模板
Oct 18 Javascript
利用Js+Css实现折纸动态导航效果实例源码
Jan 25 Javascript
jQuery创建及操作xml格式数据示例
May 26 jQuery
浅谈微信页面入口文件被缓存解决方案
Sep 29 Javascript
基于vue-upload-component封装一个图片上传组件的示例
Oct 16 Javascript
JQuery获取元素尺寸、位置及页面滚动事件应用示例
May 14 jQuery
nuxt引入组件和公共样式的操作
Nov 05 Javascript
js实现鼠标拖曳效果
Dec 30 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类继承 extends使用介绍
2014/01/14 PHP
php 批量添加多行文本框textarea一行一个
2014/06/03 PHP
学习php开源项目的源码指南
2014/12/21 PHP
学习php设计模式 php实现备忘录模式(Memento)
2015/12/09 PHP
PHP中addcslashes与stripcslashes函数用法分析
2016/01/07 PHP
PHP编写简单的App接口
2016/08/28 PHP
PHP开发中csrf攻击的简单演示和防范
2017/05/07 PHP
ext 代码生成器
2009/08/07 Javascript
在JavaScript中实现类的方式探讨
2013/08/28 Javascript
JavaScript操作Cookie详解
2015/02/28 Javascript
JQuery显示、隐藏div的几种方法简明总结
2015/04/16 Javascript
js实现的黑背景灰色二级导航菜单效果代码
2015/08/24 Javascript
JavaScript 浏览器兼容性总结及常用浏览器兼容性分析
2016/03/30 Javascript
浅谈js中startsWith 函数不能在任何浏览器兼容的问题
2017/03/01 Javascript
jQuery实现百度图片移入移出内容提示框上下左右移动的效果
2018/06/05 jQuery
jquery获取元素到屏幕四周可视距离的方法
2018/09/05 jQuery
vue和better-scroll实现列表左右联动效果详解
2019/04/29 Javascript
nodejs搭建本地服务器并访问文件操作示例
2019/05/11 NodeJs
vue.js 实现a标签href里添加参数
2019/11/12 Javascript
[05:06]2017亚洲邀请赛DAC回顾片
2017/04/19 DOTA
使用Python下的XSLT API进行web开发的简单教程
2015/04/15 Python
python压缩文件夹内所有文件为zip文件的方法
2015/06/20 Python
python网络编程调用recv函数完整接收数据的三种方法
2017/03/31 Python
关于Python中空格字符串处理的技巧总结
2017/08/10 Python
python 借助numpy保存数据为csv格式的实现方法
2018/07/04 Python
Tensorflow使用支持向量机拟合线性回归
2018/09/07 Python
python同时替换多个字符串方法示例
2019/09/17 Python
python标准库OS模块详解
2020/03/10 Python
Windows下pycharm安装第三方库失败(通用解决方案)
2020/09/17 Python
利用纯CSS3实现动态的自行车特效源码
2017/01/20 HTML / CSS
可能这些是你想要的H5软键盘兼容方案(小结)
2019/04/23 HTML / CSS
美国的Eastbay旗下的运动款子品牌:Final-Score
2018/01/01 全球购物
家得宝官网:The Home Depot(全球最大的家居装饰专业零售商)
2018/12/17 全球购物
回门宴父母答谢词
2014/01/26 职场文书
喝酒检查书范文
2014/02/23 职场文书
2015年外联部工作总结
2015/04/03 职场文书