详解js中Number()、parseInt()和parseFloat()的区别_javascript技巧

一:Number()

如果是Boolean值,true和false值将分别被转换为1和0。

如果是数字值,只是简单的传入和返回。

如果是null值,返回0。

如果是undefined,返回NaN。

如果是字符串:

  a.  如果字符串中只包含数字时,将其转换为十进制数值,忽略前导0

  b. 如果字符串中包含有效浮点格式,如“1.1”,将其转换为对应的浮点数字,忽略前导0

  c. 如果字符串中包含有效的十六进制格式,如“0xf”,将其转换为相同大小的十进制数值

  d. 如果字符串为空,将其转换为0

  e. 如果字符串中包含除上述格式之外的字符,则将其转换为NaN

如果是对象,则调用对象的valueOf()方法,然后依照前面的规则转换返回的值。如果转换的结果是NaN,则调用对象的toString()方法,然后再依照前面的规则转换返回的字符串值。

例: 

 var num1 = Number("Hello world");       //NaN
 var num2 = Number("");            //0
 var num3 = Number("0000011");        //11

二:parseInt()

处理整数的时候parseInt()更常用。parseInt()函数在转换字符串时,会忽略字符串前面的空格,知道找到第一个非空格字符。

如果第一个字符不是数字或者负号,parseInt() 就会返回NaN,同样的,用parseInt() 转换空字符串也会返回NaN。

如果第一个字符是数字字符,parseInt() 会继续解析第二个字符,直到解析完所有后续字符串或者遇到了一个非数字字符。

parseInt()方法还有基模式,可以把二进制、八进制、十六进制或其他任何进制的字符串转换成整数。

基是由parseInt()方法的第二个参数指定的,所以要解析十六进制的值,当然,对二进制、八进制,甚至十进制(默认模式),都可以这样调用parseInt()方法。

例:

 var num1 = parseInt("AF",16);           //175
    var num2 = parseInt("AF");            //NaN
    var num3 = parseInt("10",2);           //2  (按照二进制解析)
    var num4 = parseInt("sdasdad");         //NaN

三:parseFloat()

 与parseInt() 函数类似,parseFloat() 也是从第一个字符(位置0)开始解析每一个字符。也是一直解析到字符串末尾,或者解析到遇见一个无效的浮点数字字符为止。

 也就是说,字符串中第一个小数点是有效的,而第二个小数点就是无效的了,它后面的字符串将被忽略。

 parseFloat() 只解析十进制,因此它没有第二个参数指定基数的用法

 如果字符串中包含的是一个可解析为正数的数(没有小数点,或者小数点后都是零),parseFloat() 会返回整数。

例:

 var num1 = parseFloat("123AF");           //123
  var num2 = parseFloat("0xA");            //0
  var num3 = parseFloat("22.5");            //22.5
  var num4 = parseFloat("22.3.56");         //22.3
  var num5 = parseFloat("0908.5");          //908.5

parseInt() 和parseFloat() 的区别在于:

  • parseFloat() 所解析的字符串中第一个小数点是有效的,而parseInt() 遇到小数点会停止解析,因为小数点并不是有效的数字字符。
  • parseFloat() 始终会忽略前导的零,十六进制格式的字符串始终会被转换成0,而parseInt() 第二个参数可以设置基数,按照这个基数的进制来转换。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持!

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索js
, number
, parsefloat
parseInt
parseint parsefloat、parseint和parsefloat、number parsefloat、js number parsefloat、parseint float,以便于您获取更多的相关知识。

时间: 2024-12-31 10:41:19

详解js中Number()、parseInt()和parseFloat()的区别_javascript技巧的相关文章

详解js中的apply与call的用法_javascript技巧

前言 call 和 apply 都是为了改变某个函数运行时的 context 即上下文而存在的,换句话说,就是为了改变函数体内部 this 的指向.call 和 apply二者的作用完全一样,只是接受参数的方式不太一样. 方法定义applyFunction.apply(obj,args)方法能接收两个参数: obj:这个对象将代替Function类里this对象 args:这个是数组或类数组,apply方法把这个集合中的元素作为参数传递给被调用的函数. call call方法与apply方法的第

详解js中class的多种函数封装方法_javascript技巧

本文实例讲解了js中class的多种函数封装方法,分享给大家供大家参考,具体内容如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>关于class的多种函数封装</title> <style> body{ margin: 0; } li{ height: 20px; } </style

详解JavaScript中的4种类型识别方法_javascript技巧

具体内容如下: 1.typeof [输出]首字母小写的字符串形式 [功能] [a]可以识别标准类型(将Null识别为object) [b]不能识别具体的对象类型(Function除外) [实例] console.log(typeof "jerry");//"string" console.log(typeof 12);//"number" console.log(typeof true);//"boolean" console

详解js跨域原理以及2种解决方案_javascript技巧

1.什么是跨域 我们经常会在页面上使用ajax请求访问其他服务器的数据,此时,客户端会出现跨域问题. 跨域问题是由于javascript语言安全限制中的同源策略造成的. 简单来说,同源策略是指一段脚本只能读取来自同一来源的窗口和文档的属性,这里的同一来源指的是主机名.协议和端口号的组合. 例如: 2.实现原理 在HTML DOM中,Script标签是可以跨域访问服务器上的数据的.因此,可以指定script的src属性为跨域的url,从而实现跨域访问. 例如: 这种访问方式是不行的.但是如下方式,

一道优雅面试题分析js中fn()和return fn()的区别_javascript技巧

在js中,经常会遇到在函数里调用其它函数的情况,这时候会有 fn() 这种调用方式,还有一种是 return fn() 这种调用方式,一些初学者经常会被这两种方式给绕晕了.这里用一个优雅的面试题来分析一下两种方式的不同之处.  var i = 0; function fn(){ i++; if(i < 10){ fn(); }else{ return i; } } var result = fn(); console.log(result); 这是一道隐藏了坑的面试题,看似很简单,大部分人可能想

详解js实现线段交点的三种算法_javascript技巧

本文讲的内容都很初级, 主要是面向和我一样的初学者, 所以请各位算法帝们轻拍啊 引用 已知线段1(a,b) 和线段2(c,d) ,其中a b c d为端点, 求线段交点p .(平行或共线视作不相交) 算法一: 求两条线段所在直线的交点, 再判断交点是否在两条线段上. 求直线交点时 我们可通过直线的一般方程 ax+by+c=0 求得(方程中的abc为系数,不是前面提到的端点,另外也可用点斜式方程和斜截式方程,此处暂且不论). 然后根据交点的与线段端点的位置关系来判断交点是否在线段上. 公式如下图:

详解JavaScript中Hash Map映射结构的实现_javascript技巧

Hash Map通常在JavaScript中作为一个简单的来存储键值对的地方.然而,Object并不是一个真正的哈希映射,如果使用不当可能会带来潜在的问题.而且JavaScript可能不提供本地哈希映射(至少不是跨浏览器兼容的),有一个更好的声明对象属性的方法. Hash Map的简单实现: var hashMap = { Set : function(key,value){this[key] = value}, Get : function(key){return this[key]}, Co

详解js中构造流程图的核心技术JsPlumb(2)_javascript技巧

前言:上篇详解js中构造流程图的核心技术JsPlumb介绍了下JsPlumb在浏览器里面画流程图的效果展示,以及简单的JsPlumb代码示例.这篇还是接着来看看各个效果的代码说明. 一.设置连线的样式和颜色效果代码示例 大概的效果如图: 这些效果看着很简单,那么,我们如何用代码去实现它呢.上章我们说过,JsPlumb的连线样式是由点的某些属性决定的,既然如此,我们就通过设置点的样式来动态改变连线的样式即可.来看代码: 首先来看看连线类型的那个select <div id="btn_line

详解js中Json的语法与格式_javascript技巧

JSON 文本格式在语法上与创建 JavaScript 对象的代码相同. 由于这种相似性,无需解析器,JavaScript 程序能够使用内建的 eval() 函数,用 JSON 数据来生成原生的 JavaScript 对象. JSON语法规则: 数据在 名称/值 对仲 数据由逗号分隔 花括号保存对象 方括号保存数组 JSON 名称/值 对介绍 "name":"张飞", "age":23 Json的值可以是: 数字(整数或浮点数) 字符串(要包括在