前言

在编写JavaScript代码的时候存在一些对于数组的方法,可能涉及的页面会很多,然后每次去写一堆代码。长期下去代码会特别的繁多,是时候进行一波封装了,话不多说开始书写优美的代码

代码已上传github,需要的欢迎star(https://github.com/Xieguoiang...)。


关于数组一些方法的封装

1.数组去重


`上文提到的Set的封装`
//ES6新增的Set数据结构,类似于数组,但是里面的元素都是唯一的 ,其构造函数可以接受一个数组作为参数
//ES6中Array新增了一个静态方法from,可以把类似数组的对象转换为数组
//方法二 new
function removeRepeatArray(arr){
return Array.from(new Set(arr))
}

2. 数组顺序打乱


function upsetArr(arr){
return arr.sort(function(){ return Math.random() - 0.5});
}

3. 数组最值最

//这一块的封装,主要是针对数字类型的数组


function maxArr(arr){
return Math.max.apply(null,arr);
}
function minArr(arr){
return Math.min.apply(null,arr);
}

4 数组求和平均值
这一块的封装,主要是针对数字类型的数组 求商品总价了 求总数了 很常用
求和


function sumArr(arr){
var sumText=0;
for(var i=0,len=arr.length;i<len;i++){
sumText+=arr[i];
}
return sumText
}

平均值,小数点可能会有很多位,这里不做处理 可能你需要保留多少位 自己处理一下吧 ~~


function covArr(arr){
var sumText=sumArr(arr);
var covText=sumText/length;
return covText
}

5从数组中随机获取元素


//类似抽奖了什么的 适应场合很多
function randomOne(arr) {
return arr[Math.floor(Math.random() * arr.length)];
}
//randomOne([1,2,3,6,8,5,4,2,6])
//2
//randomOne([1,2,3,6,8,5,4,2,6])
//1

6返回数组(字符串)一个元素出现的次数


function getEleCount (obj, ele) {
var num = 0;
for (var i = 0, len = obj.length; i < len; i++) {
if (ele == obj[i]) {
num++;
}
}
return num;
}
//getEleCount('asd56+asdasdwqe','a')
//3
//getEleCount([1,2,3,4,5,66,77,22,55,22],22)
//2

... 就不一一列举 如有需要详情 请移步我的github~~

字符串以及date日期的封装

列举3-4个//
1 去除字符串空格 四种情况
去除空格 type 1-所有空格 2-前后空格 3-前空格 4-后空格


function trim(str,type){
switch (type){
case 1:return str.replace(/\s+/g,"");
case 2:return str.replace(/(^\s*)|(\s*$)/g, "");
case 3:return str.replace(/(^\s*)/g, "");
case 4:return str.replace(/(\s*$)/g, "");
default:return str;
}
}

2 查找字符串 字段所出现的次数 ~


function countStr (str,strSplit){
return str.split(strSplit).length-1
}

3. 日期的5-7日期日期时间部分到某一个时间的倒计时


function getEndTime(endTime){
var startDate=new Date(); //开始时间,当前时间
var endDate=new Date(endTime); //结束时间,需传入时间参数
var t=endDate.getTime()-startDate.getTime(); //时间差的毫秒数
var d=0,h=0,m=0,s=0;
if(t>=0){
d=Math.floor(t/1000/3600/24);
h=Math.floor(t/1000/60/60%24);
m=Math.floor(t/1000/60%60);
s=Math.floor(t/1000%60);
}
return "剩余时间"+d+"天 "+h+"小时 "+m+" 分钟"+s+" 秒";
} 如需更多觉得`用的多的功能的封装` 欢迎留言/ 大家一起`进步`

结语

本文列举了一些常用JS方法的封装,代码拢杂是前端一大弊端,希望大家也可以学习思路,一起封装,一起进步

goTo--

欢迎加群Q 614569041 前端方向

原文地址:https://segmentfault.com/a/1190000017002969

最新文章

  1. Scala:没有continue,break怎么办?
  2. 项目在build machine中失败,本地Build成功的程序集版本问题
  3. WPF 让子元素动起来!
  4. 传智播客JavaWeb day03
  5. (一)u-boot-nand.bin的下载
  6. 模式匹配KMP算法
  7. java多线程之生存者与消费者(Java编程思想)
  8. Terrain & Light & Camera
  9. 终于明白公测的beta 源自何处了
  10. 原生Js获取某个节点后面的第一个标签
  11. 准备开发一个基于canvas的图表库,记录一些东西(一)
  12. NSOperation 的使用(下载相关) 图片和文件都是能够的 断点续传 图片逐渐显示
  13. spring boot — InputStream
  14. AJAX编程实践
  15. 08 Django REST Framework 解决前后端分离项目中的跨域问题
  16. Navicat Premium 12.1.12.0安装与激活
  17. 数据库工具类 JdbcUtils
  18. java调用Linux执行Python爬虫,并将数据存储到elasticsearch中--(java后台代码)
  19. [0day]微软VS全版本DLL却持漏洞(VS2015 VS2013 VS2012 VS2010 VS2008)
  20. [Android] 对自定义图片浏览器经常内存溢出的一些优化

热门文章

  1. WPF学习(二) - 绑定
  2. js小知识 双叹号(!!)
  3. MyBatis数据持久化(六)resultMap使用
  4. 找出 alter system kill session ‘sid,serial#’ kill 掉的数据库会话对应进程
  5. 简洁的MVC思想框架——Nancy(Post操作与外部引用css和JS)
  6. pycharm修改提示
  7. [arc082e]ConvexScore
  8. tinymce原装插件源码分析(三)-code
  9. Docker学习总结(9)——Docker常用命令
  10. 洛谷 P3924 康娜的线段树