编程笔记 html5&css&js 072 JavaScript BigInt数据类型

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


JavaScript BigInt 数据类型是一种内置的数据类型,用于表示大于 Number.MAX_SAFE_INTEGER(即2^53 - 1)的整数。由于JavaScript中的标准数字类型(Number)使用双精度浮点格式存储,它在表示非常大的整数时会受限于其精度,可能导致精度丢失或无法正确表示超过安全范围的整数值。

一、BigInt 数据类型

JavaScript BigInt 数据类型是一种内置的数据类型,用于表示大于 Number.MAX_SAFE_INTEGER(即2^53 - 1)的整数。由于JavaScript中的标准数字类型(Number)使用双精度浮点格式存储,它在表示非常大的整数时会受限于其精度,可能导致精度丢失或无法正确表示超过安全范围的整数值。

BigInt类型的引入解决了这个问题,允许程序员处理任意大小的整数,包括那些对于常规Number类型来说过大的整数。

二、BigInt 的创建和使用

  1. 字面量表示法
    创建BigInt对象最直接的方式是通过在整数值后面添加后缀 n
let bigintValue = 9007199254740993n; // 这是一个BigInt值
console.log(bigintValue); // 输出: 9007199254740993n
  1. 构造函数表示法
    如果需要将字符串或其他类型转换为BigInt,可以使用BigInt构造函数。
let alsoBigInt = BigInt("9007199254740993"); // 字符串转BigInt
console.log(alsoBigInt); // 输出: 9007199254740993n
let fromNumber = BigInt(Number.MAX_SAFE_INTEGER + 1); // Number转BigInt
console.log(fromNumber); // 输出: 9007199254740994n

三、BigInt 操作与方法

  • 算术运算:BigInt支持基本的算术运算,如加法、减法、乘法、除法、取模等,但需要注意的是,BigInt与Number不能直接进行混合运算,必须先将Number转换为BigInt。
let a = 123456789012345678901234567890n;
let b = 987654321098765432109876543210n;
let sum = a + b;
console.log(sum); // 正确执行,结果也是一个BigInt
let mixAdd = a + 1; // 错误,BigInt和Number不能直接相加
// 必须改为:
let correctMixAdd = a + BigInt(1);
  • 比较操作:BigInt同样支持比较运算符(<, >, <=, >=, ==, !=)来比较两个BigInt或BigInt与Number(Number会被自动转换为BigInt以便比较)。
  • 位运算:BigInt也支持位操作符,如按位与(&)、按位或(|)、按位异或(^)、左移(<<)、右移(>>)以及无符号右移>>>(ES2022中新增)。
  • 库函数
  • BigInt.asUintN(width, bigint):将BigInt包装为指定宽度(以比特为单位)的无符号整数。
  • BigInt.asIntN(width, bigint):将BigInt包装为指定宽度(以比特为单位)的有符号整数。

三、示例

let uint64Value = BigInt.asUintN(64, BigInt("18446744073709551615")); // 最大64位无符号整数
console.log(uint64Value.toString()); // 输出: "18446744073709551615"
let int64Value = BigInt.asIntN(64, BigInt("-9223372036854775808")); // 最小64位有符号整数
console.log(int64Value.toString()); // 输出: "-9223372036854775808"

小结

总之,BigInt数据类型增强了JavaScript处理大整数的能力,使得在开发中能够更精确地进行大量整数计算而无需担心溢出问题。

相关文章
|
6天前
|
存储 JavaScript 前端开发
JavaScript编程实现tab选项卡切换的效果+1
JavaScript编程实现tab选项卡切换的效果+1
|
9天前
|
JavaScript 前端开发
JavaScript HTML DOM - 改变CSS
JavaScript HTML DOM - 改变CSS
16 4
|
6天前
|
前端开发 JavaScript
HTML+JavaScript+CSS DIY 分隔条splitter
HTML+JavaScript+CSS DIY 分隔条splitter
用CSS+JavaScript打造网页中的选项卡
用CSS+JavaScript打造网页中的选项卡
|
11天前
|
JavaScript 前端开发
JS配合CSS3实现动画和拖动小星星小Demo
本文通过代码示例展示了如何使用JavaScript和CSS3实现动画效果和拖动小星星的交互效果,包括文字掉落动画和鼠标拖动产生小星星动画的实现方法。
26 0
JS配合CSS3实现动画和拖动小星星小Demo
|
6天前
|
JavaScript 前端开发
JavaScript编程实现tab选项卡切换的效果
JavaScript编程实现tab选项卡切换的效果
|
6天前
|
JavaScript 前端开发
用JavaScript编程控制网页上checkbox选择状态:全选、全部取消、反选
用JavaScript编程控制网页上checkbox选择状态:全选、全部取消、反选
|
8天前
|
JavaScript 前端开发 安全
JavaScript编程实现字符和字符串翻转
JavaScript编程实现字符和字符串翻转
|
8天前
|
JavaScript 前端开发
用JavaScript编程定义二维数组并初始化,然后输出元素值
用JavaScript编程定义二维数组并初始化,然后输出元素值
|
9天前
|
JavaScript 前端开发
网页前端课程设计-【模仿】香港中文大学官网,轮播图及div+css布局,js的dom操作
这篇文章介绍了如何模仿香港中文大学官网进行网页前端课程设计,包括使用div+css布局、js的DOM操作以及实现轮播图等技术细节。
下一篇
无影云桌面