Number数据类型

Number类型使用IEEE754格式来表示整数和浮点值,这也是0.2 + 0.3不等于0.5的原因,

最基本的数值类型字面量格式是十进制整数

var a = 10;

1. 浮点数值

整理中。。。

2. NaN

Not a Number:不是一个数,但它属于数值类型

NaN的特点

  • NaN和任何值进行操作都会返回NaN
  • NaN与任何值都不相等,包括NaN本身
console.log(NaN == NaN)

3. isNaN函数

用于检测一个变量不是数值(Number)类型。isNaN()接收一个参数,这个参数可以是任何类型。这个函数会尝试把传入的参数转换为数值,某些不是数值的值会直接转换成数值,例如字符串"10"Boolean值,不能转换为数值的值返回true,能转换的返回false

console.log( isNaN(NaN ) // true
console.log( isNaN(10 ) // false
console.log( isNaN('10') // false
console.log( isNaN('blue') // true
console.log(isNaN( true )) // false (true会被转换成1)

总结:

  • isNaN意思是:是不是非数值,是的话返回true,所有能被该函数转换能Number类型的值,都返回false
  • 在使用isNaN进行检测的时候,首先会验证检测的值是否为数字类型,如果不是,先基于Number()这个方法,把值转换成数字类型,然后再检测。
  • 空字符串、空数组、布尔值、null会转成数值,所以isNaN函数返回false
  • 空对象、函数、undefined不能转换成数值,返回true

4. 数值转换

把非数值值转换为数值:

  • Number()
  • parseInt() 取整
  • parseFloat() 浮点数

`Number()转换规则

  • 如果是布尔值,truefalse会被转换为10
Number(true) // 1
Number(false) // 0
  • 如果是数字,只是简单的传入和返回。
Number(1) // 1
Number(100) // 100
  • 如果是null值,返回0
Number(null) // 0

  • 如果是undefined,返回NaN
Number(undefined) // NaN

  • 如果是字符串:

    • 字符串中只包含数字(包括前面带正/负号的情况),则将其转换为十进制数值,数字前面有0的会被忽略(不管前面有几个0,全部忽略),例如"010"会转换成10
    • 字符串中包含有效的浮点格式,如"1.1",则将其转换为对应的浮点数值。
    • 字符串中包含有效的十六进制格式(一般用数字09和字母AF(或a~f)表示,其中:A~F表示10~15,这些称作十六进制数字),如"0xf",将其转换成相同大小的十进制整数值。
    • 字符串为空,转换成0
    • 字符串中包含除了以上格式之外的字符,则转换为NaN,如字符串中既有数字又有字母的情况。

// 规则一
Number("1") // 1
Number("123") // 123
Number("010") // 10 (前导的0会被忽略)
Number("-10") // -10 // 规则2
Number("1.1") // 1.1
Number("0.1") // 0.1
Number("0000.1") // 0.1 (前导的0会被忽略) // 规则3
Number(0xf) // 15 // 规则4
Number("") // 0
Number(" ") // 0
Number('') // 0 // 规则5
Number("Hello Wolrd") // NaN
Number("0ff6600") // NaN
Number("ff6600") // NaN
Number("0.1a") // NaN
Number("10a") // NaN
Number("a10.1") // NaN var goodsList = {
'pop':
} var arr = [1,2,3,4]
Number(arr)
  • 如果对象,调用对象的valueOf(),空数组返回0,空对象返回NaN。

parseInt(string,radix)

将一个字符串转换成x进制的整数。

传入的第一个参数为字符串,如果参数不是字符串,则将其转换为字符串(使用 ToString 抽象操作)。字符串开头的空白符将会被忽略。

第二个参数为整数,表示按照xx进制转换,如传入参数10表示按十进制规则转换,

从左到右依次查找有效数字字符,直到遇到非有效数字字符,停止查找(不管后面是否好友数字),把找到的当做数字返回。

如果字符串中以0x开头且后跟数字字符,就会将其当做一个十六进制整数。

如果字符串以"0"开头且后跟数字字符,则会被当做一个八进制数来解析。

如果不传第二个参数,会按照八进制解析。在大多数情况下,我们要解析的都是十进制数值,因此始终将10作为第二个参数是非常必要的。

parseInt("123abc") // 123
parseInt("") // NaN
parseInt("12.5px") // 12
parseInt("0xA") // 10 (16进制)
parseInt("0xf") // 15 (16进制)
parseInt("070") // 70
parseInt("70") // 70

parseFloat(string)

解析一个参数(必要时先转换为字符串)并返回一个浮点数。默认解析十进制值。

function circumference(r) {
return parseFloat(r) * 2.0 * Math.PI;
} console.log(circumference(4.567));
// expected output: 28.695307297889173 console.log(circumference('4.567abcdefgh'));
// expected output: 28.695307297889173
  • 从左到右依次解析字符,一直解析到字符串末尾,遇到非数字字符会或遇到第二个浮点数(在这之前的字符串都会被解析)会使解析停止,如"3.14"解析成3.14"3.14.1234"解析成3.14

  • 忽略参数首尾空白符


parseFloat("3.14") // 3.14
parseFloat("-3.14") //-3.14
parseFloat("+3.14") //3.14
parseFloat("0003.14") // 3.14
parseFloat(" 3.14 ") // 3.14
parseFloat("3.14abc") // 3.14
parseFloat("3.14.5678") // 3.14
parseFloat("abc3.14") // NaN
parseFloat("abc123") // NaN
parseFloat("123abc") // 123

总结:

为什么NumberparseInt/parseFloat计算结果不一样呢?

  • Number转换规则是浏览器底层渲染规则,是浏览器的一个非常重要的方法,parseInt/parseFloat是一个单独方法的规则,就是用来处理字符串的。

  • Number走的是最底层的机制,遇到其他类型,底层机制会告诉我们哪个类型跟哪个类型应该怎么转换,这是底层机制已经规定好的,比如遇到布尔值,true转为1false转为0

    parseIntparseFloat是额外提供的方法,就是浏览器提供的方法,它们的源码处理机制很简单,会先把传入的参数转换为字符串,然后在从左到右查找数字有效字符。

JS中的Number数据类型详解的更多相关文章

  1. JS中的event 对象详解

    JS中的event 对象详解   JS的event对象 Event属性和方法:1. type:事件的类型,如onlick中的click:2. srcElement/target:事件源,就是发生事件的 ...

  2. js中鼠标滚轮事件详解

    js中鼠标滚轮事件详解   (以下内容部分内容参考了http://adomas.org/javascript-mouse-wheel/ ) 之前js 仿Photoshop鼠标滚轮控制输入框取值中已使用 ...

  3. js中中括号,大括号使用详解

    js中中括号,大括号使用详解 一.总结 一句话总结:{ } 是一个对象,[ ] 是一个数组 1.js大括号{}表示什么意思? 对象 { } 大括号,表示定义一个对象,大部分情况下要有成对的属性和值,或 ...

  4. JS中的this对象详解

    JS中this关键字很常见,但是它似乎变幻莫测,让人抓狂.这篇文章就来揭示其中的奥秘. 借助阮一峰老师的话:它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用.这句话看似平常,可是要非常注意 ...

  5. JS中的this用法详解

    随着对js的深入学习和使用,你会发现它里面包含了很多令人困惑的机制,比如对象.闭包.原型链继承等等,而这其中肯定包含令你现在或者曾经费解的this,如果你不把心一横,花点时间还真不明白这个this的用 ...

  6. js 中中括号,大括号使用详解

    一.{ } 大括号,表示定义一个对象,大部分情况下要有成对的属性和值,或是函数.如:var LangShen = {"Name":"Langshen",&quo ...

  7. Vue.js中学习使用Vuex详解

    在SPA单页面组件的开发中 Vue的vuex和React的Redux 都统称为同一状态管理,个人的理解是全局状态管理更合适:简单的理解就是你在state中定义了一个数据之后,你可以在所在项目中的任何一 ...

  8. Js中的For循环详解

    大家好,我是逆战班的一员,今天给大家讲解一下Js循环中的For循环. For循环是JS循环中一个非常重要的部分. 我们先讲一下for循环的作用: For循环用在需要重复执行的某些代码,比如从1打印到1 ...

  9. JS中常见排序算法详解

    本文将详细介绍在JavaScript中算法的用法,配合动图生动形象的让你以最快的方法学习算法的原理以及在需求场景中的用途. 有句话怎么说来着: 雷锋推倒雷峰塔,Java implements Java ...

随机推荐

  1. [Luogu1220]关路灯(区间dp)

    [Luogu1220]关路灯 题目描述 某一村庄在一条路线上安装了n盏路灯,每盏灯的功率有大有小(即同一段时间内消耗的电量有多有少).老张就住在这条路中间某一路灯旁,他有一项工作就是每天早上天亮时一盏 ...

  2. rabbit-c编译 vs2013

    需要openssl的库

  3. CSS中用 opacity、visibility、display 属性将 元素隐藏 的 对比分析

    说明 opacity 用来设置透明度 display 定义建立布局时元素生成的显示框类型 visibility 用来设置元素是否可见. opacity.visibility.display 这三个属性 ...

  4. Task3.特征选择

    参考:https://www.jianshu.com/p/f3b92124cd2b 互信息 衡量两个随机变量之间的相关性,两个随机变量相关信息的多少. 随机变量就是随机试验结果的量的表示,可以理解为按 ...

  5. Selenium-Switch与SelectApi介绍

    Switch 我们在UI自动化测试时,总会出现新建一个tab页面,弹出一个浏览器级别的弹框或者是出现一个iframe标签,这时我们用WebDriver提供的Api接口就无法处理这些情况了.需要用到Se ...

  6. Word文档粘贴到DEDECMS

    Chrome+IE默认支持粘贴剪切板中的图片,但是我要发布的文章存在word里面,图片多达数十张,我总不能一张一张复制吧?Chrome高版本提供了可以将单张图片转换在BASE64字符串的功能.但是无法 ...

  7. [CF846A]Curriculum Vitae题解

    枚举一个点,假设它一定符合条件,据此珂以\(O(n)\)算出要删去几个点 于是就\(O(n^2)\)解决了,貌似加一个前缀和可以在\(O(n)\)的时间复杂度内解决本问题,但对于这个数据范围来说\(O ...

  8. Python Web框架本质——Python Web开发系列一

    前言:了解一件事情本质的那一瞬间总能让我获得巨大的愉悦感,希望这篇文章也能帮助到您. 目的:本文主要简单介绍Web开发中三大基本功能:Socket实现.路由系统.模板引擎渲染. 进入正题. 一. 基础 ...

  9. C# Label换行解决方法

    一.label太短,无法完成显示所要显示信息长度,要换行,解决方法如下: (1) string aa =(长串) ; string cc= aa.Substring(0,10);//取前10个字符 s ...

  10. 破解 MyEclipse For Spring 的步骤

    破解 MyEclipse For Spring 的步骤: 1.关闭myeclipse: 2.运行破解工具,写上UserCode,最好是 8 位以上, 3.注意选择 myeclipse 的版本,我提供的 ...