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

news2024/11/14 18:28:58

目录

前言

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.coloradmin.cn/o/1944850.html

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

相关文章

开局一个启动器:从零开始入坑ComfyUI

前几天刷某乎的时候看到了一位大佬写的好文&#xff0c;可图 IP-Adapter 模型已开源&#xff0c;更多玩法&#xff0c;更强生态&#xff01; - 知乎 (zhihu.com) 久闻ComfyUI大名&#xff0c;决定试一下。这次打算不走寻常路&#xff0c;不下载现成的一键包了&#xff0c;而是…

矩估计与最大似然估计的通俗理解

点估计与区间估计 矩估计与最大似然估计都属于点估计&#xff0c;也就是估计出来的结果是一个具体的值。对比区间估计&#xff0c;通过样本得出的估计值是一个范围区间。例如估计一个人的年龄&#xff0c;点估计就是最终直接估计年龄为50岁&#xff0c;而区间估计是最终估计的…

Qt源码交叉编译带openssl的Qt版本

一.背景 近期项目由于对接的后台服务是https的&#xff0c;之前交叉编译的Qt是不带openssl的&#xff0c;为了能支持https&#xff0c;必须要重新编译Qt。 二.环境 环境准备&#xff1a; Ubuntu版本 &#xff1a;18.04&#xff1b; openssl 版本&#xff1a;1.1.1.g&#xff1b…

go-kratos 学习笔记(5) 删除hellword从新生成服务

go-kratos 删除hellword模版里的服务&#xff0c;从新生成服务users 直接删除api/helloword 目录&#xff0c;在api目录下新建 users目录&#xff1b;使用命令生成新的proto #项目根目录执行 kratos proto add api/users/user.protobuf generate生成的user.proto需要根据自己…

CCS光源的高输出TH2系列平面光源

光源在机器视觉系统中起着重要作用&#xff0c;不同环境、场景及应用合适光源都不一样&#xff0c;今天我们来看看高输出TH2系列平面光源。它可以对应高速化的生产线&#xff0c;为提高生产效率做出贡献。 TH2系列光源的特点&#xff1a; 1、实现了更高一级的高亮度 实现了更…

Ubuntu22.04系统安装nodejs 14 保姆级教程

下载软件包 从NodeSource 的官方源下载并安装 Node.js 14.x 版本的软件包&#xff0c;适用于 Debian 和 Ubuntu 系统&#xff1a; curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash - 更新软件源 更新软件源 sudo apt-get update 下载bodejs14 下载nodejs14 sud…

Doris全方位教程+应用实例

Impala性能稍领先于presto,但是presto在数据源支持上非常丰富&#xff0c;包括hive、图数据库、传统关系型数据库、Redis等 缺点&#xff1a;这两种对hbase支持的都不好&#xff0c;presto 不支持&#xff0c;但是对hdfs、hive兼容性很好&#xff0c;其实这也是顺理成章的&…

单片机学习(18)--红外遥控器

红外遥控器 17.1红外遥控的基础知识1.红外遥控简介2.硬件电路3.基本发送和接收4.NEC编码5.遥控器键码6.51单片机的外部中断7.外部中断寄存器 17.2红外遥控的程序代码1.红外遥控&#xff08;1&#xff09;工程目录&#xff08;2&#xff09;main.c函数&#xff08;3&#xff09;…

ubuntu在命令行输出里查找内容,dmesg

直接执行查看日志指令会出来很多页。dmesg为开机日志信息。记录了开机时硬件的过程 sudo dmesg 执行结果&#xff1a; 可以用竖号“|”&#xff0c;在前一条命令返回的内容进行查找。下图为查找bluetooth sudo dmesg |grep -i bluetooth

ufw命令简介

正文共&#xff1a;3999 字 41 图&#xff0c;预估阅读时间&#xff1a;4 分钟 我们之前在CentOS系统中研究了iptables命令的使用方法&#xff08;iptables命令简介&#xff09;&#xff0c;还做了简单的应用实验&#xff08;如何通过iptables配置URL过滤黑名单&#xff1f;、如…

DevExpress WinForms自动表单布局,创建高度可定制用户体验(二)

使用DevExpress WinForms的表单布局组件可以创建高度可定制的应用程序用户体验&#xff0c;从自动安排UI控件到按比例调整大小&#xff0c;DevExpress布局和数据布局控件都可以让您消除与基于像素表单设计相关的麻烦。 P.S&#xff1a;DevExpress WinForms拥有180组件和UI库&a…

LeetCode:删除排序链表中的重复元素(C语言)

1、问题概述&#xff1a;给定一个已排序链表的头&#xff0c;删除重复元素&#xff0c;返回已排序的链表 2、示例 示例 1&#xff1a; 输入&#xff1a;head [1,1,2] 输出&#xff1a;[1,2] 示例 2&#xff1a; 输入&#xff1a;head [1,1,2,3,3] 输出&#xff1a;[1,2,3] 3…

【Python】一文向您详细介绍 K-means 算法

【Python】一文向您详细介绍 K-means 算法 下滑即可查看博客内容 &#x1f308; 欢迎莅临我的个人主页 &#x1f448;这里是我静心耕耘深度学习领域、真诚分享知识与智慧的小天地&#xff01;&#x1f387; &#x1f393; 博主简介&#xff1a;985高校的普通本硕&#xff…

set 与 map底层实现

目录 set与map底层基本介绍​ 红黑树的迭代器 operator 情况一&#xff1a;右不为空 情况二&#xff1a;右为空 operator-- 情况一&#xff1a;end()-- 情况二&#xff1a;左子树不为空 情况三&#xff1a;右子树不为空 项目代码 RBTree.h myMap.h mySet.h set与m…

TCP的socket的API

关键的两个类 1)ServerSocket 该类专门给服务器用的,这个构造方法传入端口进行连接 accept相当于是接听操作,进行连接 close关闭当前套接字,当socket对象与进程的生命周期不一致时需要提前释放资源,就需要调用close 为什么UDP的客户端服务器中没有这个close方法,因为这个sock…

Manticore Search(es轻量级替代)

概念&#xff1a; Manticore Search 是一个使用 C 开发的高性能搜索引擎&#xff0c;创建于 2017 年&#xff0c;其前身是 Sphinx Search 。Manticore Search 充分利用了 Sphinx&#xff0c;显着改进了它的功能&#xff0c;修复了数百个错误&#xff0c;几乎完全重写了代码并保…

服务器数据恢复—Isilon存储集群节点误删除的数据恢复案例

Isilon存储结构&#xff1a; Isilon存储使用的是分布式文件系统OneFS。在Isilon存储集群里面每个节点均为单一的OneFS文件系统&#xff0c;所以Isilon存储在进行横向扩展的同时不会影响数据的正常使用。Isilon存储集群所有节点提供相同的功能&#xff0c;节点与节点之间没有主备…

国产大模型之光-Kimi AI

又是一年年中&#xff0c;各种工作总结、报告数不胜数&#xff0c;打工人们又面临年中绩效的考核&#xff0c;还恰逢毕业季&#xff0c;又有很多校招朋友初入职场&#xff0c;成为打工人&#xff0c;老板PUA&#xff0c;Mentor不带教&#xff0c;加班熬夜掉头发。 现在各大互联…

TCP系列(一)-介绍TCP

服务 TCP和UDP同样使用IP提供的服务&#xff0c;但是TCP提供的是面向连接&#xff0c;可靠的字节流服务 面向连接 使用TCP进行通信双方&#xff0c;必须先建立连接&#xff0c;然后进行数据交换 可靠服务 将应用数据分割成固定大小的报文段每次发出报文&#xff0c;会启动定时…

嵌入式单片机软件与硬件的结合方法分析

不知道大家有没有疑惑,为什么软件能控制硬件?关于这个问题,给出直观解释的文章:本文分析STM32单片机到底是如何软硬件结合的,分析单片机程序如何编译,运行。 软硬件结合 初学者,通常有一个困惑,就是为什么软件能控制硬件?就像当年的51,为什么只要写P1=0X55,就可以…