当前位置: 首页 > news >正文

JS实现数字千分位分割(手写纯享版)

简介

在前端开发中,我们经常需要对数字进行格式化,其中一种常见的需求就是将数字表示为千分位格式,以提高可读性。本文将介绍如何使用 JavaScript 实现一个简单而有效的千分位格式化函数。

千分位格式化的需求

千分位格式化是一种将数字中的每三位数字用逗号分隔的表示方法。例如,数字 1234567 将被格式化为 1,234,567。这种格式化方法通常用于显示大额金额、统计数据等。

思路

  • 将输入的数字转换为字符串。
  • 如果有小数部分,将整数部分和小数部分分别提取出来。
  • 对整数部分和小数部分进行千分位格式化。使用循环,从字符串的末尾开始,每隔三位插入一个逗号。
  • 将格式化后的整数部分和小数部分拼接起来,用小数点连接。
  • 返回格式化后的字符串。

实现

function formatNumber(number) {let str = number.toString();let integerPart = str.split('.')[0].split('');let decimalPart = str.split('.')[1] ? str.split('.')[1].split('') : [];// 对整数部分进行千分位格式化for (let i = integerPart.length - 3; i > 0; i -= 3) {integerPart[i] = ',' + integerPart[i];}// 对小数部分进行千分位格式化for (let i = decimalPart.length - 3; i > 0; i -= 3) {decimalPart[i] = ',' + decimalPart[i];}// 拼接整数部分和小数部分return integerPart.join('') + (decimalPart.length ? '.' + decimalPart.join('') : '');
}const number = 9999999.9999const ans = formatNumber(number);
console.log(ans); // 9,999,999.9,999

总结

千分位格式化是前端开发中一个常见而有用的需求。通过使用上述简单的 JavaScript 函数。

希望本文对您理解和实现千分位格式化有所帮助!

相关文章:

JS实现数字千分位分割(手写纯享版)

简介 在前端开发中,我们经常需要对数字进行格式化,其中一种常见的需求就是将数字表示为千分位格式,以提高可读性。本文将介绍如何使用 JavaScript 实现一个简单而有效的千分位格式化函数。 千分位格式化的需求 千分位格式化是一种将数字中…...

入门指南:介绍Python库——Pandas

个人网站 本文首发于公众号小肖学数据分析 Pandas是一个功能强大、灵活易用的Python数据处理库。 无论你是数据分析师、数据科学家还是Python初学者,掌握Pandas都将为你提供高效、便捷的数据处理和分析能力。 本文将为你详细介绍Pandas的基本概念、常用功能和使…...

数据库语句执行流程(查询原理)SQL

SQL作为一种数据库编程语言,其执行过程大致为,终端上输入SQL语句 会传输到数据库服务器,然后SQL语句在服务器内经过解析器的检查和翻译,优化器的执行效率提升,在执行器中通过存储引擎提供的数据给出结果。详细过程如下…...

FileReader与URL.createObjectURL实现图片、视频上传预览

之前做图片、视频上传预览常用的方案是先把文件上传到服务器,等服务器返回文件的地址后,再把该地址字符串赋给img或video的src属性,这才实现所谓的文件预览。实际上这只是文件“上传后再预览”,这既浪费了用户的时间,也…...

基于python+Django+SVM算法模型的文本情感识别系统

欢迎大家点赞、收藏、关注、评论啦 ,由于篇幅有限,只展示了部分核心代码。 文章目录 一项目简介1. 简介2. 技术栈3. 系统架构4. 关键模块介绍5. 如何运行 二、功能三、系统四. 总结 一项目简介 # 基于 Python Django SVM 算法模型的文本情感识别系统介…...

数据结构之栈与队列习题详解解析

个人主页:点我进入主页 专栏分类:C语言初阶 C语言程序设计————KTV C语言小游戏 C语言进阶 C语言刷题 数据结构初阶 欢迎大家点赞,评论,收藏。 一起努力,一起奔赴大厂。 目录 1.前言 2.概念题…...

C++ 动态规划 DP教程 (一)思考过程(*/ω\*)

动态规划是一种思维方法,大家首先要做的就是接受这种思维方法,认同他,然后再去运用它解决新问题。 动态规划是用递推的思路去解决问题。 首先确定问题做一件什么事情? 对这件事情分步完成,分成很多步。 如果我们把整件…...

【python基础(九)】文件和异常详解:使用、读取、写入、追加、保存用户的信息,以及优雅的处理异常

文章目录 一. 从文件中读取数据1. 读取整个文件2. 文件路径3. 逐行读取4. 创建一个包含文件各行内容的列表 二. 写入文件1. 写入空文件2. 写入多行3. 附加到文件 三. 异常1. 处理ZeroDivisionError异常2. 使用try-except代码块3. try-except-else ing4. 处理FileNotFoundError异…...

详解C语言中的指针数组和数组指针

指针数组和数组指针是 C 语言中比较常见的两种类型。它们虽然名字很相似,但是含义、用法以及指向类型都不同,需要分开理解。 指针数组 指针数组是一个数组,其中每个元素都是一个指针。这些指针可以指向不同类型的数据,也可以指向…...

【done】剑指offer18:删除链表指定节点

力扣,https://leetcode.cn/problems/shan-chu-lian-biao-de-jie-dian-lcof/description/ // 自己写的答案 class Solution {public ListNode deleteNode(ListNode head, int val) {if (head null) {return null;}if (head.val val) {return head.next;}ListNode …...

图形编辑器开发:缩放和旋转控制点

大家好,我是前端西瓜哥。好久没写图形编辑器开发的文章了。 今天来讲讲控制点。它是图形编辑器的不可缺少的基础功能。 控制点是吸附在图形上的一些小矩形和圆形点击区域,在控制点上拖拽鼠标,能够实时对被选中进行属性的更新。 比如使用旋…...

【2023 云栖】阿里云田奇铣:大模型驱动 DataWorks 数据开发治理平台智能化升级

云布道师 本文根据 2023 云栖大会演讲实录整理而成,演讲信息如下: 演讲人:田奇铣 | 阿里云 DataWorks 产品负责人 演讲主题:大模型驱动 DataWorks 数据开发治理平台智能化升级 随着大模型掀起 AI 技术革新浪潮,大数…...

Rust语言入门教程(二) - 变量与作用域

变量与作用域 变量的声明与初始化 Rust的基本语法格式如下: fn main(){let bunnies 2; }语句以分号结尾,用花括号包含语句块。 Rust的语法其实借鉴了很多其他的语言,比如C语言和Python, 所以变量定义的格式看起来也跟很多我们…...

芯知识 | Flash可更换声音语音芯片—引领音频IC技术革新的新篇章

随着科技的飞速发展,人们对于电子产品的音频性能要求越来越高。在这种背景下,Flash可更换声音语音芯片应运而生,成为音频技术领域的一颗璀璨明星。本文将详细介绍Flash可更换声音语音芯片的特点、优势以及应用场景,展望其在未来科…...

合共软件创新亮相:第102届上海电子展成就技术新篇章

2023年,第102届中国(上海)电子展活动在全球瞩目中圆满落幕。作为下半年华东地区最具影响力的电子展会,此次盛会吸引了来自全球的600家领先企业,共同探讨电子元器件行业的最新发展成果和趋势。 本届展会围绕核心先导元器…...

Ubuntu20.04清理垃圾vscode缓存

使用VM虚拟机安装了Ubuntu系统,主目录空间越来越小,硬盘扩容之后很快又空间不足,甚至出现了开机卡黑屏的情况,这里记录一下解决过程。 1 重新开机进入系统 状态:卡到了开机黑屏状态,左上角有一条小横杠 原…...

网络数据结构skb_buff原理

skb_buff基本原理 内核中sk_buff结构体在各层协议之间传输不是用拷贝sk_buff结构体,而是通过增加协议头和移动指针来操作的。如果是从L4传输到L2,则是通过往sk_buff结构体中增加该层协议头来操作;如果是从L4到L2,则是通过移动sk_…...

SpringCache使用详解

SpringCache 1.新建测试项目SpringCache2.SpringCache整合redis2.1.Cacheable2.2.CacheEvict2.3.Cacheput2.4.Caching2.5.CacheConfig 3.SpringCache问题4.SpringCache实现多级缓存 1.新建测试项目SpringCache 引入依赖 <dependencies><dependency><groupId&g…...

windows版本的grafana如何离线安装插件

本文以安装clickhouse的插件为例&#xff0c;记录下如何离线安装插件 1 下载插件 ClickHouse plugin for Grafana | Grafana Labs 2 找到grafana的配置文件 打开编辑&#xff0c;搜索plugin关键字&#xff0c;修改plugin的加载目录 目录不存在&#xff0c;手动创建&#xff0…...

ElasticSearch01

ElasticSearch 版本&#xff1a;7.8 学习视频&#xff1a;尚硅谷 笔记&#xff1a;https://zgtsky.top/ ElasticSearch介绍 Elaticsearch&#xff0c;简称为es&#xff0c; es是一个开源的高扩展的分布式全文检索引擎&#xff0c;它可以近乎实时的存储、检索数据&#xff1b…...

Cursor Free VIP:深入解析AI编程工具的设备标识重置技术

Cursor Free VIP&#xff1a;深入解析AI编程工具的设备标识重置技术 【免费下载链接】cursor-free-vip [Support 0.45]&#xff08;Multi Language 多语言&#xff09;自动注册 Cursor Ai &#xff0c;自动重置机器ID &#xff0c; 免费升级使用Pro 功能: Youve reached your t…...

从CCF A类清单看计算机学科前沿:如何选择你的学术发表阵地

1. CCF A类清单&#xff1a;计算机学术圈的"米其林指南" 第一次看到CCF A类清单时&#xff0c;我正为博士开题选方向发愁。导师甩给我这份列表说&#xff1a;"这就是计算机学界的米其林三星榜单&#xff0c;发一篇能顶三篇普通论文。"后来我才理解&#x…...

如何用RL4CO构建智能决策引擎:5分钟掌握强化学习组合优化

如何用RL4CO构建智能决策引擎&#xff1a;5分钟掌握强化学习组合优化 【免费下载链接】rl4co A PyTorch library for all things Reinforcement Learning (RL) for Combinatorial Optimization (CO) 项目地址: https://gitcode.com/gh_mirrors/rl/rl4co RL4CO是一个强大…...

如何在Zotero中为PDF文档添加可搜索文本层:Zotero-OCR插件完全指南

如何在Zotero中为PDF文档添加可搜索文本层&#xff1a;Zotero-OCR插件完全指南 【免费下载链接】zotero-ocr Zotero Plugin for OCR 项目地址: https://gitcode.com/gh_mirrors/zo/zotero-ocr Zotero作为一款强大的文献管理工具&#xff0c;能够帮助研究人员和学生高效管…...

别再踩坑了!Ubuntu 20.04/22.04下禾赛Pandar系列激光雷达ROS驱动保姆级安装指南

Ubuntu 20.04/22.04下禾赛激光雷达ROS驱动安装避坑指南 刚拿到禾赛Pandar系列激光雷达时&#xff0c;那种兴奋感我至今记得——直到在Ubuntu系统上折腾ROS驱动连续报错三天。如果你正在经历catkin_make编译失败、rviz里死活看不到点云、或者依赖库版本冲突的绝望时刻&#xff…...

Vue 3定时任务可视化终极指南:no-vue3-cron插件完整解析

Vue 3定时任务可视化终极指南&#xff1a;no-vue3-cron插件完整解析 【免费下载链接】no-vue3-cron 这是一个 cron 表达式生成插件,基于 vue3.0 与 element-plus 实现 项目地址: https://gitcode.com/gh_mirrors/no/no-vue3-cron 还在为复杂的Cron表达式语法而头疼吗&am…...

从《倘若鸟儿回还》看无障碍设计:如何用技术为轮椅用户打造真正的“独立出行”体验

从《倘若鸟儿回还》看无障碍设计&#xff1a;如何用技术为轮椅用户打造真正的“独立出行”体验 艾米的故事让我们看到&#xff0c;残障人士对独立性的渴望往往被善意所掩盖。查尔斯希望成为她"唯一的推椅人"&#xff0c;却忽略了轮椅对她而言不是束缚&#xff0c;而是…...

从PyTorch到TensorRT Engine:动态Batch模型转换的完整避坑指南(含trtexec命令详解)

从PyTorch到TensorRT Engine&#xff1a;动态Batch模型转换的完整避坑指南&#xff08;含trtexec命令详解&#xff09; 在深度学习模型部署的实践中&#xff0c;动态Batch支持一直是工程落地的关键需求。想象一下这样的场景&#xff1a;你的PyTorch模型在训练时表现优异&#x…...

伪类与伪元素

伪类和伪元素的本质区别是修饰的东西是否能在DOM中找到对应的真实节点,比如伪类:first-of-type修饰的是一个能找到的真实节点,而伪元素::first-line修饰的不是一个真实的节点而是一段文本的一行 伪类: 伪类以单个冒号(:)开头,用于在元素特定状态为他添加样式(注意伪类本身不决定…...

点云全局配准实战——Go-ICP从零实现与PCL集成优化

1. Go-ICP算法与点云配准基础 刚接触三维点云处理时&#xff0c;第一次听说"配准"这个词还以为是什么高深莫测的黑科技。其实简单来说&#xff0c;点云配准就是把不同视角扫描得到的点云数据对齐到同一个坐标系的过程。想象你拿着手机绕着物体拍了一圈照片&#xff…...