前端JS必用工具【js-tool-big-box】,Number数值转换的方法调用学习

news2024/11/16 13:32:05

这一小节,我们针对前端工具包(npm)js-tool-big-box的使用做一些讲解,主要是针对Number数值型转换的一些方法使用。

 

目录

前言

1 安装和引入

2 千位逗号分割

3 判断是否大于0

 4 判断是否大于0的整数

5  生成指定范围内的随机数

6 生成指定位数的随机数字 

7 数字转中文

7.1 小写中文

7.2  大写中文

7.3 使用方法总结 


前言

在前端项目中,经常会涉及到一些数值转化的公共方法,而js-tool-big-box 这个工具包里也都包含了,可以直接使用,例如千位分割,保留小数位,生成指定范围内的随机数,转中文大写,中文小写这些,可以说是非常便捷高效,堪称AIGC PLUS。

1 安装和引入

执行安装命令

npm i js-tool-big-box

项目中引入,工具包对外提供了 numberBox 对象,可以用来调用一些数值类型转化的方法。

import { numberBox } from 'js-tool-big-box';

 

2 千位逗号分割

例如数值很长,我们就需要做千位分割,有时候还会保留一些小数位数,使用示例代码如下:

const num1 = numberBox.formatNumberWithCommas(13498345.333, 2);
    console.log('num1转化后:', num1); // 13,498,345.33
    const num11 = numberBox.formatNumberWithCommas(13498345.333);
    console.log('num11转化后:', num11); // 13,498,345

使用方法总结:

 

方法名返回值入参
formatNumberWithCommas带有逗号的数字字符串

第一个参数必填,表示需要转换的数值,可以是数值类型,可以是数值字符串类型,

第二个参数非必填,表示小数点后需要带有几位小数,不填则没有小数

 

 

3 判断是否大于0

这个方法只判断数字是否是大于0的,不管是不是整数,示例代码如下:

const num2 = numberBox.isGreater0('-33.23');
    console.log('-33.23是大于0的数字吗?', num2); // false
    const num3 = numberBox.isGreater0('33.23s'); 
    console.log('33.23s是大于0的数字吗?', num3); // false
    const num33 = numberBox.isGreater0(2024); 
    console.log('2024是大于0的数字吗?', num33); // true

使用方法总结:

方法名返回值入参
isGreater0true或者false第一个参数必填,表示需要判断的数值,可以是数值型,可以是数值字符串型

 

 4 判断是否大于0的整数

这个方法不仅需要判断是否大于0,也需要判断是否是大于0且是一个整数,示例代码如下:

const num4 = numberBox.isGreater0Integer('33.23');
    console.log('33.23是大于0的整数吗?', num4);  // false
    const num5 = numberBox.isGreater0Integer(99);
    console.log('99是大于0的整数吗?', num5);  // true

 

使用方法总结:

方法名返回值入参
isGreater0Integertrue或者false第一个参数必填,表示需要判断的数值,可以是数值型,可以是数值字符串型

5  生成指定范围内的随机数

用户可以指定范围内,生成一个随机数,示例代码如下:

// 生成80到100的随机整数
    const num6 = numberBox.getRandomNumber(80, 100);
    console.log('80到100的随机整数::', num6);
    // 生成50到56并带有2位小数的随机数
    const num7 = numberBox.getRandomNumber(50, 56, 2);
    console.log('50到56并带有2位小数的随机数::', num7);

使用方法总结:

方法名返回值入参
getRandomNumber指定范围内的随机的数值

第一个参数必填,表示起始范围的数字;

第二个参数必填,表示结束范围的数字;

第三个参数非必填,表示如果需要保留小数位的话,那个小数位的位数

6 生成指定位数的随机数字 

上面是指定了范围,这个是指定位数,比如我要生成 5 位或者 6 位的一个随机数字,示例代码如下:

// 生成一个4位的随机数字
    const num66 = numberBox.generateUniqueRandomNumber(4);
    console.log('生成的4位的随机数字:', num66);
    // 生成一个6位的随机数字
    const num77 = numberBox.generateUniqueRandomNumber(6);
    console.log('生成的6位的随机数字:', num77);

使用方法总结:

方法名返回值入参
generateUniqueRandomNumber指定位数的数字第一个参数必填,表示需要生成随机数的位数

7 数字转中文

很多时候,数字需要转成中文,同时也区分 大写中文 和 小写中文

7.1 小写中文

也就是说 123 转成 一百二十三 这样,示例代码如下:

const num8 = numberBox.numberToChinese('456788.12');
    console.log('看一下456788.12的中文小写展示:', num8);
    const num9 = numberBox.numberToChinese(122456788.5);
    console.log('看一下122456788.5的中文小写展示:', num9);

 

7.2  大写中文

也就是说 123 转成 壹佰贰拾叁 这样,示例代码如下:

const num10 = numberBox.numberToChinese(22456788.5, 'upper');
    console.log('看一下22456788.5的中文大写展示:', num10);

7.3 使用方法总结 

数字转中文,大写或者小写的方法是同一个,通过入参来管理返回

方法名返回值入参
numberToChinese转换后的大小中文数字,或者小写中文数字

第一个参数必填,表示需要被转换的数值,可以是数值型,也可以是数值字符串型;

第二个参数非必填,表示需要转小写中文还是大写中文,如果不传,默认转小写,如果需要转大写,需要特定传入字符串“upper

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1630542.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Allegro画PCB时如何只删除走线的一部分

如何只删除走线的一部分 1、第一步: 2、第二步: 3、第三步,点击相应的走线段就能删除了。 说明:上面的Cline和Line只的是电线和线,您按下删除后,就可以删除这两种东西,但删除的是一整条折线.把这两个取消掉,换成Cline Segs和Ot…

计算机服务器中了helper勒索病毒怎么办,helper勒索病毒解密流程工具

在网络技术飞速发展的今天,越来越多的企业离不开网络,网络可以为企业带来更高的生产效率,提供更多的便捷服务,但网络是一把双刃剑,在为人们提供便利的同时,也为企业的数据安全带来严重威胁。近日&#xff0…

通过 API从 0 到 1 构建 本地 GPTs——1.构建Builder‘s Prompt

目的:帮助小白用户生成结构化 prompt 功能清单 搭建本地 gpts 能力,构建本地企业知识库助手Builder’s Prompt -对话引导构建 prompt 示例,生成助手信息function_call的用法prompt 示例 GPTs 的 Create 能力 用于引导用户构建结构化的 pr…

【数据分析面试】33.计算加权平均值 (Python: enumerate())

题目 假设你在分析薪资数据。经理让你使用最近加权平均值来计算平均薪资,并为提供了过去’n’年的数据。 最近加权应确保最近几年的薪资权重大于时间较久几年的薪资。 编写函数实现下面计算功能:输入previous_salaries是最近n年的薪资列表&#xff0c…

使用Canal实现MySQL主从同步

说明:本文介绍如何使用Canal实现MySQL主从同步的效果,关于Canal入门使用参考:Canal入门使用 启动Canal 首先,设置Canal服务器里,目标节点(即监测的MySQL节点)的配置,启动Canal服务…

心理学上有个概念叫:习惯性反驳(附上解决办法)

在心理学上,有一个词,叫做习惯性反驳。 什么意思呢? 就是不管你说什么,他都要反驳你,最后把你带入负面的情绪黑洞,搞得你非常崩溃。 一个总是习惯性反驳的人,其实是非常可怕的。 习惯性反驳的3个…

通过java代码,将jar或class反编译为java文件的四种方式

目录 目标方式一:cfrpom引用java实现 方式二:jd-corepom引用java实现 方式三:procyon.jarjar下载java实现 方式四:procyonpom引用java实现 目标 在spring boot项目中,通过给定的文件地址,将*.jar或*.class…

通义千问(Qwen)AI大模型-系列_2

算力平台AutoDL pip install -r requirements.txt -i https://pypi.mirrors.ustc.edu.cn/simple -i https://pypi.mirrors.ustc.edu.cn/simple 一、通义千问系列模型 1、CodeQwen1.5-7B-Chat CodeQwen1.5是Qwen1.5的代码特定版本。它是一种基于变换器的纯解码器语言模型&…

【Unity学习笔记】第十四 Prefab 概念解惑

目录 1 prefab、prefab变体、prefab覆盖和prefab 嵌套2 connect 与unpack3 prefab到底是什么,它和gameobject又有什么区别?4 为什么要用prefab?5 代码动态加载prefab6 为什么我unity PrefabUtility.InstantiatePrefab() 得到的是null7 Prefab…

【LeetCode刷题记录】简单篇-70-爬楼梯

【题目描述】 假设你正在爬楼梯。需要 n 阶你才能到达楼顶。 每次你可以爬 1 或 2 个台阶。你有多少种不同的方法可以爬到楼顶呢? 【测试用例】 示例1: 输入:n 2 输出:2 解释:有两种方法可以爬到楼顶。 1.1阶 1阶…

EI会议、投稿优惠2024年计算机科学与神经网络国际会议(ICCSNN 2024)开始征稿啦!!

2024 International Conference on Computer Science and Neural Networks 一、大会信息 会议名称:2024年计算机科学与神经网络国际会议会议简称:ICCSNN 2024收录检索:提交Ei Compendex,CPCI,CNKI,Google Scholar等会议官网:http…

蓦然回首,追忆那些备战OCM的日子

蓦然回首 前段时间偶然在墨天轮群看到一位在墨天轮轮社区非常活跃的老兄发的《那些年,我们一起追过的OCP》的文章,获悉墨天轮在举办【我的备考经验】的有奖征文活动,打开那篇文章,一下子又把我的思绪拉回到了好几年前,…

ruoyi实现大文件上传

前端: 安装依赖 1.在package.json文件中添加"vue-simple-uploader": "^0.7.4","spark-md5": "^3.0.1"到dependencies中;devDependencies中"node-sass": "^4.9.0", "sass-loader&quo…

Redis面试题三(集群)

目录 1.Redis 集群搭建有几种模式 2.Redis 主从复制的实现 全量同步 增量同步 3.Redis 的主从同步策略 1. 全量同步(Full Resynchronization) 2. 增量同步(Incremental Replication) 4.Redis一致性hash 基本原理 节点动态…

BAPI_ACC_DOCUMENT_POST 凭证过账及增强

METHOD document_post.DATA ls_documentheader TYPE bapiache09. "表头DATA ls_accountgl TYPE bapiacgl09.DATA lt_accountgl TYPE STANDARD TABLE OF bapiacgl09. "总账项目DATA ls_accountreceivable TYPE bapiacar09.DATA lt_accountreceivable TYPE STANDARD TA…

LVS/NAT工作模式介绍及配置

1.1 LVS/NAT模式工作原理 LVS(Linux Virtual Server)的网络地址转换(NAT)模式是一种在网络层(第四层)实现负载均衡的方法。在NAT模式中,Director Server(DS)充当所有服务…

[Diffusion Model笔记] DDPM数学推导版 2024.04.23

本文是观看以下视频的笔记: https://www.bilibili.com/video/BV1CU4y1i7jn/?p4&spm_id_frompageDriver 其他参考 https://zhuanlan.zhihu.com/p/614147698 https://zhuanlan.zhihu.com/p/563661713 这个写的非常详细: https://www.zhihu.com/ques…

【新手必读】Airtest测试Android手机常见的设置问题

经常有新手同学在使用Airtest测试Android手机的时候,遇到各式各样的问题,其中很大一部分,都是因为Android手机的设置不当,比如: 因为没有登录华为/荣耀/小米账号,而无法开启USB调试功能 因为没有关闭防止恶…

06_Scala流程控制

文章目录 [toc] 1.流程控制**小结:** **2. Scala中流程控制没有三元运算符****2.1 Scala中如果逻辑代码只有一行可以省略花括号****小结:** **3. 循环控制****3.1 for控制****3.2循环守卫 --> 循环表达式添加逻辑判断****3.3 循环步长 --> 表示循环…

IntelliJ IDEA 如何启用 JDK 预览特性

IntelliJ IDEA 也可以启用 JDK 的预览特性。 针对项目,选择项目结构。 配置是在语言结构上。 单击语言结构上的 SDK 默认,往下拉,就可以看到针对新版本的选项。 同时还可以看到那些版本是支持新特性预览的,那些版本是不支持新特…