【前端新手小白】学习Javascript的【开源好项目】推荐

目录

前言

1 项目介绍

1.1 时间日期类

1.2 网页store类

1.3 事件类

1.4 Number类

1.5 String类

1.6 正则验证类

1.7  ajax类

1.8 data数据类

1.9 browser浏览器类

2 学习js-tool-big-box开源项目时有哪些收获

2.1 你可以这样做

2.2 如果你需要使用本项目 

2.3 你也可以为本git项目点个赞 

3 开源项目的发展趋势


前言

如果你是一位前端新手小白,如果你觉得自己的JS功底还有所欠缺,如果你觉得自己平时做的项目还不够丰富,如果你觉得自己遇到的场景还不够丰富

如果你想要一个练手的好项目,如果你想学习更多的场景,如果你想学习更多的公共方法,如果你想从新手小白中挣脱出来。

那么我推荐的这个开源项目,你一定会需要的

1 项目介绍

我说的这个开源项目呢,是一个前端JS的公共方法库。无论是Vue项目,还是React项目,他都可以胜任。他是一个更多更丰富的公共方法集合。

首先,我们来个github的链接地址,点我:js-tool-big-box的github地址

然后,我们来个他的学习文档:js-tool-big-box的学习地址

他目前包含的功能有

1.1 时间日期类

  1. 时间日期的转换;
  2. 更灵活的时间格式;
  3. 更个性化的时间获取;
  4. 某个时间点距离现在的时间段(更加详细的返回信息)
  5. 判断平年还是闰年;
  6. 某个月有多少天;
  7. 属相;
  8. 一年中的法定节假日;
  9. 获取全球重点城市时间;

1.2 网页store类

  1. 获取url中的参数值
  2. 设置cookie;
  3. 获取cookie;
  4. 删除cookie;
  5. 设置localStorage;
  6. 获取localStorage

1.3 事件类

  1. 防抖
  2. 节流

1.4 Number类

  1.  千分位逗号分割;
  2. 判断是否大于0;
  3. 判断是否大于0的整数;
  4. 生成指定范围内的随机数;
  5. 生成指定位数的随机数;
  6. 数字转小写中文;
  7. 数字转大写中文;

1.5 String类

  1. 字符串反转;
  2. 横岗转小驼峰
  3. 横岗转大驼峰;
  4. 版本号比较;
  5. 获取一个字符串的字节长度;
  6. 生成uuid;
  7. 根据身份证号获取性别、年龄和出生日期;
  8. 字符串中间加特殊符号,隐藏关键信息;
  9. 字符串大小写字母转换;

1.6 正则验证类

  1.  邮箱格式验证;
  2. 手机号格式验证;
  3. url格式验证;
  4. 身份证号格式验证;
  5. IP地址格式验证;
  6. 邮政编码格式验证;
  7. 判断是否是Unicode字符;

  8. 检测密码强度值;

1.7  ajax类

  1. 发送jsonp请求;
  2. 下载文件纯功能版本;
  3. 下载文件,fetch + 下载功能版本;

1.8 data数据类

  1. 数组中获取随机个数的值;
  2. 复制文字到剪贴板;
  3. 数组去重;
  4. 获取更详细的数据类型;
  5. 数值型数组排序(正序和倒序);
  6. 对象型数组排序(正序和倒序)

1.9 browser浏览器类

  1. 判断当前是否手机端浏览器;
  2. 判断元素是否处于可视范围内;
  3. 获取当前浏览器向上滚动还是向下滚动,获取当前距离顶部和底部的距离;

  4. 打开全屏 和 关闭全屏;

  5. 获取浏览器userAgent以及详细信息;

2 学习js-tool-big-box开源项目时有哪些收获

2.1 你可以这样做

如果你想要学习里面的方法如何书写的,如果你不想使用本项目,你可以fock一个属于自己的库:

然后你就可以将自己fock下来的项目,通过git clone <代码库> 的方式,将代码下载下来,然后开始将自己需要学习的,或者自己需要使用的公共方法,拷贝到自己的项目中。

2.2 如果你需要使用本项目 

如果你只是想使用这个npm包里的一些公共方法,那么你就可以参照文档说明,不管是Vue项目,或者Vue3项目,又或者是React项目,这些方法都可以帮助你高效,快捷的完成一些工作。

安装js-tool-big-box

执行安装命令:

npm install js-tool-big-box

刚才我们说了9种大的方法类,如果需要使用哪个方法,你就需要单独的去引用某个大的方法类,比如,你要使用时间类,可以这样引入:

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

 比如你需要使用浏览器相关的方法类,你可以这样引入:

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

2.3 你也可以为本git项目点个赞 

最直接的参与项目方式,当然是,先为项目点赞,再开始fock项目,然后再开始学习,不过最终还是希望大家可以在vue或者React项目中使用这个npm库

3 开源项目的发展趋势

可能某一天呢,你也会动手,自己打造一个属于自己的开源项目。那么开源项目的发展趋势又如何呢?又或者说,你未来可以着手朝着哪些方向打造一个属于自己的开源项目呢?

开源项目的发展趋势呈现出以下几个重要方向

  1. 社区和协作:开源项目越来越依赖于社区的力量,社区贡献者的多样性和积极性是项目成功的关键。大型开源项目如Linux、Apache、Kubernetes等,社区活跃度非常高。

  2. 企业参与:越来越多的企业参与到开源项目中,贡献代码、资金和资源。这不仅帮助推动项目的发展,也有助于企业自身的技术创新和生态系统建设。

  3. 开源治理和合规:随着开源项目的增多,如何有效地治理和管理这些项目变得更加重要。很多项目开始采用明确的治理结构和合规策略,以确保项目的健康发展和法律合规。

  4. 多元化技术栈:开源项目不仅仅局限于软件代码,还包括硬件设计、数据集、模型等。比如,RISC-V作为开源硬件指令集架构,获得了广泛关注和支持。

  5. 安全性和稳定性:随着开源项目在商业应用中的广泛使用,安全性和稳定性变得尤为重要。项目维护者和社区对安全漏洞的响应和修复速度也越来越快。

  6. 自动化和工具:许多开源项目开始利用自动化工具和CI/CD管道来提高开发效率和质量控制。例如,GitHub Actions 和 GitLab CI/CD广泛应用于开源项目的自动化测试和部署。

  7. 新兴领域:人工智能、区块链和物联网等新兴领域的开源项目也在快速发展。这些项目不仅推动了技术进步,还促进了跨领域的合作和创新。

  8. 教育和培训:越来越多的教育机构和培训项目采用开源工具和资源进行教学,培养更多的开源人才,进一步推动开源生态的发展。

这些趋势表明,开源不仅是技术发展的重要推动力,也是企业创新和协作的重要平台。未来,开源项目在技术创新、产业应用和社会影响力方面将继续发挥重要作用。

读完本文后,我们投个票吧,互动一下

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

内网穿透的应用-Windows系统如何ssh连接群晖nas使用docker安装内网穿透软件

文章目录 前言1. 检查安装Container Manager2. 检查开启群晖SSH连接3. Windows SSH 连接群晖4. 下载Cpolar 镜像5. 群晖Docker安装Cpolar 前言 在某些群晖NAS型号版本&#xff0c;无法使用套件安装的时候&#xff0c;我们可以采用Docker的方式进行安装cpolar内网穿透工具&…

MySQL:Prepared Statement 预处理语句

预处理语句&#xff08;Prepared Statement&#xff09; 是一种在数据库管理系统中使用的编程概念&#xff0c;用于执行对数据库进行操作的 SQL 语句。 使用预处理语句的具体方式和语法依赖于所用的编程语言和数据库管理系统。常见的编程语言如 Java、PHP、Python 和 C# 都提供…

CNN卷积网络实现MNIST数据集手写数字识别

步骤一&#xff1a;加载MNIST数据集 train_data MNIST(root./data,trainTrue,downloadFalse,transformtransforms.ToTensor()) train_loader DataLoader(train_data,shuffleTrue,batch_size64) # 测试数据集 test_data MNIST(root./data,trainFalse,downloadFalse,transfor…

GBase8c psycopg2安装(centos6)

GBase8c psycopg2安装(centos6) 安装步骤&#xff1a; [rootcentos6 ~]# cd /opt/python/ [rootcentos6 python]# ls psycopg2-2.7.7.tar.gz [rootcentos6 python]# tar -zxf psycopg2-2.7.7.tar.gz [rootcentos6 python]# cd psycopg2-2.7.7 # 安装命令 [rootcentos6 psycop…

B站安全开发流程落地实践

一. 什么是安全开发生命周期&#xff08;SDL&#xff09; 1.1 SDL诞生背景 随着互联网技术的快速发展&#xff0c;网络系统及应用在给人们的生活带来巨大便利的同时&#xff0c;信息安全问题也逐渐成为用户和企业关注的焦点。然而&#xff0c;安全问题的管理和解决需要一个系统…

武汉流星汇聚:亚马逊Prime会员日后,确保持续稳定出单的五大策略

随着亚马逊Prime会员日的圆满落幕&#xff0c;无数商家沉浸在销售高峰的喜悦之中&#xff0c;但狂欢之后的冷静思考同样重要。对于所有卖家而言&#xff0c;如何在会员日热潮退去后&#xff0c;依然保持稳定的订单量&#xff0c;成为关乎长远发展的关键。以下&#xff0c;武汉流…

MySQL数据库入门基础知识 【1】推荐

数据库就是储存和管理数据的仓库&#xff0c;对数据进行增删改查操作&#xff0c;其本质是一个软件。 首先数据有两种&#xff0c;一种是关系型数据库&#xff0c;另一种是非关系型数据库。 关系型数据库是以表的形式来存储数据&#xff0c;表和表之间可以有很多复杂的关系&a…

nova7(华为)相机关闭画质优化

模板 文章目录 模板 如果对你有帮助&#xff0c;就点赞收藏把&#xff01;(&#xff61;&#xff65;ω&#xff65;&#xff61;)&#xff89;♡ 不知道大家有没有遇到这种苦恼 想拍一张&#xff0c;夜景照片 明明按下快门的时候还是如上图所示 但是到图库就只能看到下图的照片…

多路径 bbr mpbbr 公平性推演

mptcp 推出很久了&#xff0c;先看 rfc6356 三原则&#xff1a; 对自己&#xff0c;mptcp 的吞吐不能比用 sp(single path)tcp 时更差&#xff1b;对它者&#xff0c;mptcp 子流对资源的占用不能侵害其它 sptcp 流量&#xff1b;负载分担&#xff0c;要将孬 subflow 流量分担到…

SX_初识GitLab_1

1、对GitLab的理解&#xff1a; 目前对GitLab的理解是其本质是一个远程代码托管平台&#xff0c;上面托管多个项目&#xff0c;每个项目都有一个master主分支和若干其他分支&#xff0c;远程代码能下载到本机&#xff0c;本机代码也能上传到远程平台 1.分支的作用&#xff1a…

20.rabbitmq插件实现延迟队列

问题 前面谈到基于死信的延迟队列&#xff0c;存在的问题&#xff1a;如果第一个消息延时时间很长&#xff0c;而第二个消息延时时间很短&#xff0c;第二个消息并不会优先得到执行。 下载插件 地址&#xff1a;https://github.com/rabbitmq/rabbitmq-delayed-message-excha…

JAVA基础 - 反射

目录 一. 简介 二. java.lang.Class类 三. java.lang.reflect包 四. 创建对象 五. 调用方法 六. 调用成员变量 一. 简介 反射是 Java 语言中的一种强大机制&#xff0c;允许程序在运行时动态地获取类的信息、访问类的成员&#xff08;包括字段、方法和构造函数&#xff…

Tomato靶机攻略

1、启动靶机 2、通过nmap -sA 192.168.168.0/24得到靶机IP 3、扫描目录 用dirb http://192.168.49.128扫描敏感目录 4、访问敏感目录 5、通过查看源码&#xff0c;发现其存在文件包含漏洞&#xff0c;利用该漏洞查看日志文件 http://192.168.168.131/antibot_image/antibots/…

gitee的fork

通过fork操作&#xff0c;可以复制小组队长的库。通过复制出一模一样的库&#xff0c;先在自己的库修改&#xff0c;最后提交给队长&#xff0c;队长审核通过就可以把你做的那一份也添加入库 在这fork复制一份到你自己的仓库&#xff0c;一般和这个项目同名 现在你有了自己的库…

vue2以及vue3基于el-table实现表格正则校验功能

常见需求&#xff1a; 在项目中&#xff0c;通常会在表格中添加多条数据&#xff0c;并需要对添加的数据进行校验功能&#xff0c;这时候就是很头疼的事了&#xff0c;下面酱酱仔给你们写个示例&#xff0c;你们无脑粘贴复制即可。 注意事项&#xff1a; 1、校验里面用到了正…

【Unity】3D功能开发入门系列(一)

Unity3D功能开发入门系列&#xff08;一&#xff09; 一、开发环境&#xff08;一&#xff09;安装 Unity&#xff08;二&#xff09;创建项目&#xff08;三&#xff09;Unity 窗口布局 二、场景与视图&#xff08;一&#xff09;场景&#xff08;二&#xff09;游戏物体&…

前端日历插件VCalendar

官网地址 API | VCalendar 1.安装 yarn add v-calendarnext popperjs/core 2.全局引入 mian.js //日历插件 import VCalendar from v-calendar; import v-calendar/style.css;app.use(VCalendar); 3.使用 <div><VCalendar reservationTime expanded borderless…

java各种锁有什么区别

Java 虚拟机&#xff08;JVM&#xff09;中有几种不同类型的锁&#xff0c;每种锁都有其特定的用途和性能特点。下面我将为你介绍几种常见的锁&#xff1a; 1.独占锁&#xff08;也称为悲观锁&#xff09;&#xff1a; 1.synchronized&#xff1a;这是 Java 提供的一种内置的独…

股指期货的套利策略存在哪些风险?

股指期货套利的交易策略。它能够纠正市场上不合理的价格偏差&#xff0c;将价格拉回到正常的轨道。套利交易以其稳健的收益吸引着投资者&#xff0c;但同时也容易让人陷入一个误区——认为套利是无风险的。实际上&#xff0c;套利同样存在风险&#xff0c;只是相对于纯粹的投机…