编程笔记 html5&css&js 066 JavaScript Number数据类型

简介: 编程笔记 html5&css&js 066 JavaScript Number数据类型


Javascript语言中的Number数据类型详解。在JavaScript中,Number 是一种基本数据类型,用于表示数字。

在JavaScript中,Number 是一种基本数据类型,用于表示数字。以下是关于JavaScript中 Number 数据类型的详细说明

一、Number数据类型

  1. 存储方式
  • JavaScript中的所有数字都以64位浮点数格式存储,遵循IEEE 754标准。这意味着即使整数值也没有单独的整数类型,它们也是以双精度浮点数的形式存储。
  • 这种设计允许JavaScript中的Number类型支持非常大或非常小的数值范围,但也意味着它存在精度问题,特别是在处理极大或极小的数字时,以及进行某些精确整数运算时。
  1. 数值范围
  • 最小值:Number.MIN_VALUE 表示可以表示的最小正数,大约为 5e-324
  • 最大值:Number.MAX_VALUE 表示可以表示的最大正数,大约为 1.7976931348623157e+308
  • 负无穷:Number.NEGATIVE_INFINITY,当一个数值小于可表示的最小负数时出现。
  • 正无穷:Number.POSITIVE_INFINITY,当一个数值大于可表示的最大正数时出现。
  • 非数字(NaN):NaN 表示“Not-a-Number”,即无法表示为数字的值,比如 0/0Math.sqrt(-1) 的结果都是 NaN。
  1. 特殊数值
  • NaN 不与自身相等,即 NaN === NaN 返回 false,所以需要使用 isNaN() 函数来检查一个值是否是 NaN。
  • Infinity-Infinity 可以通过除以零或者执行超过Number.MAX_VALUE的乘法得到。
  1. 转换规则
  • 使用 Number() 函数可以将其他类型转换成数字类型。例如,空字符串、空数组和布尔值会转换为相应的数字值(空字符串转为 0,空数组转为 0true 转为 1false 转为 0),而不能被转换为数字的值(如空对象、undefined 等)会被转换为 NaN
  • parseInt()parseFloat() 函数专门用于从字符串中解析出整数或浮点数。
  1. 进制转换
  • JavaScript 中可以使用二进制、八进制和十六进制字面量表示数字,例如 0b1010(二进制)、0o777(八进制)和 0x1A(十六进制)。
  • toString() 方法可用于将数字转换为不同基数的字符串形式。
  1. 舍入误差
  • 由于采用浮点数存储,一些精确的数学运算可能会因为浮点数的内在表示机制而导致微小的误差。
  1. 安全整数范围
  • ECMAScript 提供了 Number.isSafeInteger() 方法来判断一个数是否落在 [-2^53, 2^53] 范围内,这个范围内的整数能保证精确无误地表示和操作。

总之,JavaScript中的Number类型功能强大但也有其局限性,尤其需要注意的是浮点数计算可能带来的精度问题。

二、数制表示

在JavaScript中,可以使用不同的数制来表示数字。以下是几种常见的数制表示方法:

  1. 十进制(Decimal)
  • JavaScript默认采用十进制表示数值,例如:12345
  1. 二进制(Binary)
  • 从ES6开始,可以使用 0b 前缀来表示二进制数。例如:0b1010 表示十进制的10。
  1. 八进制(Octal)
  • 在ES6之前,JavaScript允许使用前导零表示八进制数,但这种方式在现代浏览器和严格模式下已不再支持,可能会引发错误。不过你仍然可以通过先将八进制转换为字符串再转回Number类型的方式来表示,如:parseInt('0777', 8)
  • ES6引入了新的字面量形式,通过 0o 或者 0O 前缀来表示八进制数,例如:0o777 表示十进制的511。
  1. 十六进制(Hexadecimal)
  • 通过 0x 前缀来表示十六进制数。例如:0xFF 表示十进制的255。

转换不同数制的方法:

  • parseInt(str, radix):解析一个字符串并返回指定基数(radix)下的整数值。
  • Number.parseInt(str, radix):同上,是全局函数 parseInt 的静态版本。
  • Number.toString(radix):将数字转换为指定基数的字符串表示形式。

例如:

let decimal = 10;
console.log(decimal.toString(2)); // 输出 "1010",表示十进制10的二进制形式
console.log(parseInt("0xFF", 16)); // 输出 255,将十六进制数 FF 转换为十进制数

三、类型运算

在JavaScript中,Number 数据类型支持多种运算符来进行数值计算和比较。以下是一些主要的运算符:

  1. 算术运算符
  • +(加法):将两个数字相加,例如 2 + 3 结果为 5
  • -(减法):从第一个数中减去第二个数,例如 5 - 2 结果为 3
  • *(乘法):将两个数字相乘,例如 4 * 3 结果为 12
  • /(除法):用第一个数除以第二个数,例如 6 / 3 结果为 2
  • %(模/取余):返回除法操作后的余数,例如 7 % 3 结果为 1
  • **(指数运算):求幂运算,例如 2 ** 3 结果为 8
  1. 赋值运算符
  • =:简单赋值,如 x = 10;
  • +=-=*=/=:复合赋值运算符,它们分别执行加法、减法、乘法和除法后再赋值给变量,例如 x += 2 等价于 x = x + 2;
  1. 增量与减量运算符
  • ++(前置或后置):自增运算符,增加变量的值1,如 ++xx++
  • --(前置或后置):自减运算符,减少变量的值1,如 --xx--
  1. 关系运算符
  • <(小于)、>(大于)、<=(小于等于)、>=(大于等于):用于比较两个数字的大小关系,返回布尔值。
  • ==(等于)和 !=(不等于):检查两个值是否相等(注意会进行类型转换)。
  • ===(全等)和 !==(不全等):不仅检查值是否相等,还检查数据类型是否相同。
  1. 逻辑运算符
  • &&(逻辑与):如果两边的操作数都为真,则结果为真。
  • ||(逻辑或):如果两边至少有一个操作数为真,则结果为真。
  • !(逻辑非):对一个布尔值进行否定。
  1. 位运算符
  • &(按位与)
  • |(按位或)
  • ^(按位异或)
  • ~(按位非)
  • <<(左移)
  • >>(有符号右移)
  • >>>(无符号右移)

这些运算符应用于 Number 类型时,遵循特定的优先级规则,并且可能涉及到隐式类型转换,特别是在使用 == 进行比较时要注意。在实际编程中,应根据需求合理运用这些运算符进行数值计算和逻辑判断。

四、代码示例

当然,以下是一些关于JavaScript中Number数据类型及其运算和比较的代码示例:

算术运算符示例:

let a = 5;
let b = 3;
// 加法
let sum = a + b;
console.log(sum); // 输出:8
// 减法
let diff = a - b;
console.log(diff); // 输出:2
// 乘法
let product = a * b;
console.log(product); // 输出:15
// 除法
let quotient = a / b;
console.log(quotient); // 输出:1.6666666666666667(浮点数)
// 模运算
let remainder = a % b;
console.log(remainder); // 输出:2
// 指数运算
let power = a ** b;
console.log(power); // 输出:125

赋值运算符示例:

let c = 10;
// 复合加法赋值
c += 5;
console.log(c); // 输出:15
// 复合减法赋值
c -= 3;
console.log(c); // 输出:12
// 复合乘法赋值
c *= 2;
console.log(c); // 输出:24
// 复合除法赋值
c /= 2;
console.log(c); // 输出:12

增量与减量运算符示例:

let d = 5;
// 前置自增
console.log(++d); // 输出:6,然后d变为6
console.log(d); // 输出:6
// 后置自增
console.log(d++); // 输出:6,然后d变为7
console.log(d); // 输出:7
// 前置自减
console.log(--d); // 输出:6,然后d变为5
console.log(d); // 输出:5
// 后置自减
console.log(d--); // 输出:5,然后d变为4
console.log(d); // 输出:4

关系和全等比较运算符示例:

let e = 4;
let f = 5;
// 小于
console.log(e < f); // 输出:true
// 大于
console.log(e > f); // 输出:false
// 小于等于
console.log(e <= f); // 输出:true
// 大于等于
console.log(e >= f); // 输出:false
// 等于 (可能进行类型转换)
console.log(e == '4'); // 输出:true
// 不等于 (可能进行类型转换)
console.log(e != f); // 输出:true
// 全等 (不进行类型转换)
console.log(e === f); // 输出:false
// 不全等 (不进行类型转换)
console.log(e !== f); // 输出:true

小结

学习时,编写代码如示例,认真查看输入结果。

相关文章
|
3天前
|
JavaScript 前端开发
页面滚动触发css3动画js插件
delighters.js是一款页面滚动触发css3动画js插件。该js插件可以在页面向下滚动时,为进入浏览器视口的元素制作各种炫酷的CSS3动画效果。
27 13
|
4天前
|
存储 JavaScript 前端开发
JavaScript中的数据类型以及存储上的差别
通过本文的介绍,希望您能够深入理解JavaScript中的数据类型及其存储差别,并在实际编程中灵活运用这些知识,以提高代码的性能和稳定性。
20 3
|
12天前
纸屑飘落生日蛋糕场景js+css3动画特效
纸屑飘落生日蛋糕CSS3动画特效是一款js+css3制作的全屏纸屑飘落,生日蛋糕点亮庆祝动画特效。
30 3
|
12天前
|
Web App开发 移动开发 HTML5
html5 + Three.js 3D风雪封印在棱镜中的梅花鹿动效源码
html5 + Three.js 3D风雪封印在棱镜中的梅花鹿动效源码。画面中心是悬浮于空的梅花鹿,其四周由白色线段组成了一个6边形将中心的梅花鹿包裹其中。四周漂浮的白雪随着多边形的转动而同步旋转。建议使用支持HTML5与css3效果较好的火狐(Firefox)或谷歌(Chrome)等浏览器预览本源码。
42 2
|
28天前
|
存储 JavaScript 前端开发
js中的数据类型
JavaScript 中的数据类型包括五种基本类型(String、Number、Undefined、Boolean、Null)和三种引用类型(Object、Array、Function,以及ES6新增的Symbol)。基本类型直接存储值,引用类型存储的是指向实际数据的内存地址。了解它们的区别对于掌握 JavaScript 的变量赋值和函数传参至关重要。
21 1
|
1月前
|
前端开发 JavaScript
用HTML CSS JS打造企业级官网 —— 源码直接可用
必看!用HTML+CSS+JS打造企业级官网-源码直接可用,文章代码仅用于学习,禁止用于商业
124 1
|
1月前
|
前端开发 JavaScript 安全
HTML+CSS+JS密码灯登录表单
通过结合使用HTML、CSS和JavaScript,我们创建了一个带有密码强度指示器的登录表单。这不仅提高了用户体验,还帮助用户创建更安全的密码。希望本文的详细介绍和代码示例能帮助您在实际项目中实现类似功能,提升网站的安全性和用户友好性。
46 3
|
1月前
|
JavaScript
JS鼠标框选并删除HTML源码
这是一个js鼠标框选效果,可实现鼠标右击出现框选效果的功能。右击鼠标可拖拽框选元素,向下拖拽可实现删除效果,简单实用,欢迎下载
42 4
|
1月前
|
移动开发 HTML5
html5+three.js公路开车小游戏源码
html5公路开车小游戏是一款html5基于three.js制作的汽车开车小游戏源代码,在公路上开车网页小游戏源代码。
57 0
html5+three.js公路开车小游戏源码
|
1月前
|
JSON 移动开发 数据格式
html5+css3+js移动端带歌词音乐播放器代码
音乐播放器特效是一款html5+css3+js制作的手机移动端音乐播放器代码,带歌词显示。包括支持单曲循环,歌词显示,歌曲搜索,音量控制,列表循环等功能。利用json获取音乐歌单和歌词,基于html5 audio属性手机音乐播放器代码。
110 6