JavaScript前端开发时数值运算的小技巧


Posted in Javascript onJuly 28, 2020

1.格式化金钱值

const ThousandNum = num => num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
const money = ThousandNum(20190214);
// money => "20,190,214"

2.取整代替正数的Math.floor(),代替负数的Math.ceil()

const num1 = ~~ 1.69;
const num2 = 1.69 | 0;
const num3 = 1.69 >> 0;
// num1 num2 num3 => 1 1 1

3.转数值只对null、""、false、数值字符串有效

const num1 = +null;
const num2 = +"";
const num3 = +false;
const num4 = +"169";
// num1 num2 num3 num4 => 0 0 0 169

4.精确小数

const RoundNum = (num, decimal) => Math.round(num * 10 ** decimal) / 10 ** decimal;
const num = RoundNum(1.69, 1);
// num => 1.7

5.取最小最大值

const arr = [0, 1, 2];
const min = Math.min(...arr);
const max = Math.max(...arr);
// min max => 0 2

6.是否为空对象

const obj = {};
const flag = DataType(obj, "object") && !Object.keys(obj).length;
// flag => true

7.判断数据类型

function DataType(tgt, type) {
 const dataType = Object.prototype.toString.call(tgt).replace(/\[object (\w+)\]/, "$1").toLowerCase();
 return type ? dataType === type : dataType;
}
DataType("liner"); // "string"
DataType(2020630); // "number"
DataType(true); // "boolean"
DataType([], "array"); // true
DataType({}, "array"); // false

8.克隆数组

const _arr = [0, 1, 2];
const arr = [..._arr];
// arr => [0, 1, 2]

9.合并数组

const arr1 = [0, 1, 2];
const arr2 = [3, 4, 5];
const arr = [...arr1, ...arr2];
// arr => [0, 1, 2, 3, 4, 5];

10.去重数组

const arr = [...new Set([0, 1, 1, null, null])];
// arr => [0, 1, null]

11.截断数组

const arr = [...new Set([0, 1, 1, null, null])];
// arr => [0, 1, null]

12.交换赋值

let a = 0;
let b = 1;
[a, b] = [b, a];
// a b => 1 0

13.克隆对象

const _obj = { a: 0, b: 1, c: 2 }; // 以下方法任选一种(本人偏爱第一种,简单明了,与克隆数组几乎一样)
const obj = { ..._obj };
const obj = JSON.parse(JSON.stringify(_obj));
// obj => { a: 0, b: 1, c: 2 }

14.合并对象

const obj1 = { a: 0, b: 1, c: 2 };
const obj2 = { c: 3, d: 4, e: 5 };
const obj = { ...obj1, ...obj2 };
// obj => { a: 0, b: 1, c: 3, d: 4, e: 5 }

JavaScript前端开发时数值运算的小技巧

为什么 obj 不是 {a:0,b:1,c:2,d:4,e:5}而是上面结果 下面相同的例子就可以说明

JavaScript前端开发时数值运算的小技巧

到此这篇关于JavaScript前端开发时数值运算的小技巧的文章就介绍到这了,更多相关JavaScript前端开发时数值运算内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
JavaScript 脚本将当地时间转换成其它时区
Mar 19 Javascript
javascript下利用arguments实现string.format函数
Aug 24 Javascript
js实现TAB切换对应不同颜色的代码
Aug 31 Javascript
基于jQuery实现点击列表加载更多效果
May 31 Javascript
浅析jQuery Ajax通用js封装
Jun 22 Javascript
微信小程序  自定义创建详细介绍
Oct 27 Javascript
快速实现jQuery多级菜单效果
Feb 01 Javascript
Web前端框架Angular4.0.0 正式版发布
Mar 28 Javascript
详解javascript中的babel到底是什么
Jun 21 Javascript
TypeScript基础入门教程之三重斜线指令详解
Oct 22 Javascript
微信小程序日历弹窗选择器代码实例
May 09 Javascript
生产制造追溯系统之在线打印功能
Jun 03 Javascript
js实现全选和全不选
Jul 28 #Javascript
浅谈vue中$bus的使用和涉及到的问题
Jul 28 #Javascript
js实现全选和全不选功能
Jul 28 #Javascript
JavaScript React如何修改默认端口号方法详解
Jul 28 #Javascript
vue内置组件component--通过is属性动态渲染组件操作
Jul 28 #Javascript
Postman如何实现参数化执行及断言处理
Jul 28 #Javascript
微信小程序实现电子签名功能
Jul 29 #Javascript
You might like
PHP判断文章里是否有图片的简单方法
2014/07/26 PHP
php实现的SESSION类
2014/12/02 PHP
php通过array_shift()函数移除数组第一个元素的方法
2015/03/18 PHP
PHP实现从上往下打印二叉树的方法
2018/01/18 PHP
php输出反斜杠的实例方法
2019/09/19 PHP
使用Rancher在K8S上部署高性能PHP应用程序的教程
2020/07/10 PHP
jQuery实现简单的间隔向上滚动效果
2015/03/09 Javascript
jquery 插件实现瀑布流图片展示实例
2015/04/03 Javascript
原生js实现无缝轮播图效果
2017/01/11 Javascript
js实现PC端根据IP定位当前城市地理位置
2017/02/22 Javascript
基于daterangepicker日历插件使用参数注意的问题
2017/08/10 Javascript
微信小程序radio组件使用详解
2018/01/31 Javascript
Vue实现点击后文字变色切换方法
2018/02/11 Javascript
echarts实现地图定时切换散点与多图表级联联动详解
2018/08/07 Javascript
Nuxt.js开启SSR渲染的教程详解
2018/11/30 Javascript
JavaScript中的回调函数实例讲解
2019/01/27 Javascript
vue设置一开始进入的页面教程
2019/10/28 Javascript
[02:21]DOTA2英雄基础教程 蝙蝠骑士
2013/12/16 DOTA
[01:31:02]TNC vs VG 2019国际邀请赛淘汰赛 胜者组赛BO3 第一场
2019/08/22 DOTA
用python实现的去除win下文本文件头部BOM的代码
2013/02/10 Python
利用Python学习RabbitMQ消息队列
2015/11/30 Python
Python冲顶大会 快来答题!
2018/01/17 Python
python 控制Asterisk AMI接口外呼电话的例子
2019/08/08 Python
python中 _、__、__xx__()区别及使用场景
2020/06/30 Python
Python如何使用ElementTree解析xml
2020/10/12 Python
用css3写出气球样式的示例代码
2017/09/11 HTML / CSS
Skyscanner台湾:全球知名的旅行比价引擎
2018/07/01 全球购物
BNKR中国官网:带你感受澳洲领先潮流时尚
2018/08/21 全球购物
遗体告别仪式主持词
2014/03/20 职场文书
母校寄语大全
2014/04/10 职场文书
马丁路德金演讲稿
2014/05/19 职场文书
出国签证在职证明范本
2014/11/24 职场文书
员工辞职信范文
2015/03/02 职场文书
css常用字体属性与背景属性介绍
2022/02/28 HTML / CSS
tomcat正常启动但网页却无法访问的几种解决方法
2022/05/06 Servers
html网页引入svg图片的4种方式
2022/08/05 HTML / CSS