分享好友 编程语言首页 频道列表

TypeScript中处理大数字(会丢失后面部分数字)

typescript文章/教程  2023-02-09 06:510

为啥要弄这玩意?

最近做数值游戏,需要用到很大的数字,在前端大数字会自动变成e的科学计数法。

例如123456789123456789123456789保存到localStorage时,会变成  1.2345678912345679e+26

 

有啥问题?

问题:

1. 在传递给服务端时,服务端因为不能处理大数字(怎么就处理不了?!),就想要我传字符串给他,

    但是大数字会变成科学计数法的字符串"4e+23"之类给服务端,而不是"400000000000000..."理想的数字字符串。

 

2. 在保存本地localStorage时,因为key-value的值只能是字符串,所以把num.toString()后也会变成科学计数法保存。

    例如123456789123456789123456789保存到localStorage时,会变成  1.2345678912345679e+26

 

3. 尝试去github、csdn找BigDecimal之类的处理大数字的Javascript或Typescript版本,但是用不了。

在常规H5里还好, 但是放到微信小游戏里就不行,会Decimal is not defined之类, 增加了window和修改wx.config配置文件也不行。急死个人哎。

 

解决方案:

1. 因为调试第三方库死活调不通,反正数值游戏在大数值以后,小数就非常微乎其微了,损失一些小数字也无所谓。而且项目急着上线,卧槽加班到很晚。

2. 于是写了下面的一个很搓的方法。判断e的数量,来手动给数字字符串+"0"  = =!

 

一个很搓的转换函数

    /**
     * 将数字转成字符串,可以转换超过16位的大数字,但是会丢失精度
     * @param value 数字
     */
    public getNumberToString(value: number) {
        let str = value.toString();
        //大于16位,用e表示的大数字,需要转换
        if (str.indexOf("e") != -1) {
            //e位置
            let eIndex = str.indexOf("e");
            //小数点位置
            let pIndex = str.indexOf(".");
            //是否有小数点, 400000000...这样的数是没有小数点的
            let bHavePoint = pIndex;
            //小数点位置
            pIndex = (pIndex == -1) ? 0 : pIndex;
            //小数点后的数字位数
            let small = eIndex - pIndex - 1;
            //e前面的数字
            let result = str.substr(0, eIndex);
            //如果e前面数字有小数点,则去掉小数点
            if (bHavePoint != -1) {
                result = result.replace(".", "");
            }
            //e后面的数字
            let eNum = str.substr(eIndex + 2, str.length);
            //需要添加的0数量
            let len = parseInt(eNum) - small;
            for (let i = 0; i < len; i++) {
                result += "0";
            }
            //返回最终结果
            return result;
        }else{
            //不是大数字,则直接返回
            return value.toString();
        }

    }

  

 

实际应用

  protected createGameScene(): void {
        //小型数字,正确返回
        let a: number = 3000000;
        console.log(a.toString());               //3000000
        console.log(this.getNumberToString(a));  //3000000

        //大数字,后面数字有损
        let b:number = 123456789123456789123456789;   
        console.log(b.toString());               //1.2345678912345679e+26
        console.log(this.getNumberToString(b));  //123456789123456790000000000

        //大数字,无小数点,正确返回
        let c:number = 90000000000000000000000000000; 
        console.log(c.toString());               //9e+28
        console.log(this.getNumberToString(c));  //90000000000000000000000000000
        
        //大数字字符串 parseInt还原成 数字
        let d:number = parseInt(this.getNumberToString(c));
        console.log(d);  //9e+28

        //大数字字符串 parseFloat还原成 数字
        let e:number = parseFloat(this.getNumberToString(c));
        console.log(e);  //9e+28

        //科学计数法字符串  parseInt还原成数字  这里不能使用parseInt来还原科学计数法的字符串,会错误
        let f:number = parseInt(c.toString());
        console.log(f);  //9     

        //科学计数法字符串 parseFloat还原成数字 正确
        let g:number = parseFloat(c.toString());
        console.log(g);  //9e+28
    }

  

查看更多关于【typescript文章/教程】的文章

展开全文
相关推荐
反对 0
举报 0
评论 0
图文资讯
热门推荐
优选好物
更多热点专题
更多推荐文章
electron教程(番外篇二): 使用TypeScript版本的electron, VSCode调试TypeScript, TS版本的ESLint
electron教程(一): electron的安装和项目的创建electron教程(番外篇一): 开发环境及插件, VSCode调试, ESLint + Google JavaScript Style Guide代码规范electron教程(番外篇二): 使用TypeScript版本的electron, VSCode调试TypeScript, TS版本的ESLintelectron

0评论2023-03-08610

使用TypeScript,AngularJs和Web API构建基本的CRUD Web 应用
原文地址:using typescript with angularjs and web api 版权归其作者所有.在这篇文章中我将向大家展示如何使用TypeScript,Angular Js 和Asp.net Web API 来构建一个基本的实现CRUD功能的Web应用程序. Typescript提供了一系列的功能来方便程序员构造和组织更

0评论2023-02-10391

Typescript 中类的继承
Typescript中类的定义与继承与后端开发语言java/C#等非常像,实现起来非常方便,而且代码便于阅读。用Typescript写较大项目时是非常有优势的。/** * BaseClass */class BaseClass {constructor(name:string,age:number) {this.name=name;this.age=age;}name:s

0评论2023-02-09350

TypeScript实现设计模式——工厂模式
上回用typescript实现了单例模式,这回来实现工厂模式。工厂模式又分为简单工厂模式、工厂方法模式以及抽象工厂模式。简单工厂模式简单工厂模式通常在业务比较简单的情况下使用,它有三个部分组成:工厂类、抽象产品类、具体产品类。抽象产品类abstract class

0评论2023-02-09907

使用Visual Studio Code和typescript 开发调试React Native项目
关于React Native的详细介绍我就不叙述了,他是使用js构建原生app的开发框架。一次变编码多平台运行,非常强大。但是个人不喜欢js的过于灵活(弱类型)的语法。强大的强类型语言Typescript(简称TS)是我的首选,他可以编译成JavaScript,编译成的JavaScript代

0评论2023-02-09391

TypeScript的安装、使用及配置
JS是一种弱类型语言,对于代码的维护和重构是非常困难的。TypeScript是一个编译到纯JS的有类型定义的JS超集,可以极大的提升代码的健壮性。使用TS后,能够方便的查看函数定义、默认参数及类型、变量结构体等,同时对于IDE的参数类型提示也是非常友好的。优点

0评论2023-02-09713

vue-type-check: Vue 模板中的 Typescript 类型检查
越来越多人开始尝试使用 Typescript 编写他们的 vue 项目,vue 本身也在不断加强对 Typescript 的支持(官方提供 vue-class-component 库、使用 Typescript 编写 Vue 3.0 等),但是对于组件中模板部分的类型检查仍然有很大的局限性。为此我们开源了一个易

0评论2023-02-09756

JavaScript面向对象轻松入门之抽象(demo by ES5、ES6、TypeScript)
抽象的概念  狭义的抽象,也就是代码里的抽象,就是把一些相关联的业务逻辑分离成属性和方法(行为),这些属性和方法就可以构成一个对象。  这种抽象是为了把难以理解的代码归纳成与现实世界关联的概念,比如小狗这样一个对象:属性可以归纳出“毛色”、

0评论2023-02-09777

Angular2+typescript+webpack2(支持aot, tree shaking, lazy loading)
Angular2官方推荐的应该是使用systemjs加载, 但是当我使用到它的tree shaking的时候,发现如果使用systemjs+rollup,只能打包成一个文件,然后lazy loading就没法搞了。因此我使用了webpack2,webpack2自带tree shaking,只要将tsconfig中的module设置成es201

0评论2023-02-09811

Typescript学习笔记 TYPESCRIPT
TypeScript 是 JavaScript 的类型的超集,它可以编译成纯 JavaScript。 安装 TypeScript命令行工具安装:npm install -g typescript编译一个 TypeScript 文件:tsc hello.ts  原始数据类型/ 任意值为每一个变量提前申明该类型,则该变量取值只能为申明的

0评论2023-02-09688

更多推荐