- 博客(72)
- 收藏
- 关注
原创 VScode网页版的使用
可连接git-hub的账号使用,实现随时随地编程;可通过该地址进行连接git-hub仓库的连接,但不适应于编写与提交代码,可用于阅读他人的代码;VScode网页版的使用。在原本项目的地址前加入。
2022-12-18 12:30:58
7511
原创 canvas绘制时钟
canvas绘制时钟的展示;canvas是HTML5新增的元素,通过javascript脚本绘制图形;那么canvas可以用来干啥呢?制作web网页游戏数据可视化;即:echarts就是基于canvas进行绘制广告banner的动态效果,视频的弹幕效果canvas还可以用来内嵌一些网页手写签名等…点击进入查看canvas的系列学习在这里我添加了一个时钟的绘制,呈现的效果如下:这里采用的是俩个canvas的形式进行圆刻度表与指针分开的绘制;} h1 {
2022-11-17 12:45:58
949
原创 前端实现大文件/图片的上传 -采用分片上传的形式
需求:当需要上传的文件或图片的较大时,采用分片截取分段的形式上传;要想实现文件的上传与下载,先得了解下new Blob()对象;文件上传的对象是blob对象,即二进制大对象;可用于实现文件流的下载。
2022-10-28 13:38:45
1161
原创 自定义弹窗组件
在项目中经常会使用到的弹窗提示框,这里将弹窗的提示框的内容,书写成pageTool.js形式,将弹窗的方法使用export导出,类似的组件的引用方法使用;
2022-08-15 20:03:28
764
原创 digital-keyboard - 数字与id输入的键盘
web的前端应用,在input的输入中,可不使用自身的软键盘,而引用数字与身份证键盘;
2022-08-15 18:39:25
328
原创 事件轮询有关Promise与async/await的原理
js的运行程序是单线程,所有的队列再一个线程中完成;为了防止主线程的阻塞,使用异步的promise来解决,异步event loop,async与await的语法糖,宏任务与微任务的关系,其中还写入有关原理的题目;了解其原理就好解题...
2022-08-05 01:18:14
923
原创 vue前端项目第三方库集成
vue项目第三方库的集成使用:vue.config.js配置; vue-router集成; vuex集成;element-plus集成;axios集成;vscode的配置
2022-07-25 17:13:25
1112
原创 vue中的axios的封装使用(二)
基于vue3.0与typescript创建下,封装axios的接口请问的方法,方便的代码的维护与接口请求引用的统一管理;
2022-07-17 16:21:18
2221
3
原创 前端项目搭建规范的协同的配置
多组员协同项目开发时,需要配置的开发规范,统一代码的书写风格与格式;并且gitHub地址commit的内容也可进行规范化描述提交;针对代码缩进大小,空白符的配置,换行类型等问题,这里介绍EditorConfig,Prettier,eslint,git Husky与git commit的规范;...
2022-07-07 14:23:46
727
2
原创 TypeScript接口与泛型的使用
typescript的接口与泛型的使用;在书写typescript的代码中,声明一个变量及对象的类型,使用到的type与instance,包括字面量的类型的使用。也有typescript的枚举enum与泛型的使用;并且涉及到类型的查找与定义的方式...
2022-07-05 19:09:43
1517
2
原创 TypeScript类的使用
本编typescript类的使用,有关成员修饰符(public,private和protected), readonly只读属性, getters/setters,静态成员,抽象类abstract,与类的类型的定义使用;
2022-06-30 23:18:09
348
4
原创 TypeScript函数详解
在typescript中使用函数,进行函数类型的定义使用;包括参数类型的定义,可选参数,参数的默认值,this的推倒与函数的重载的问题;
2022-06-30 21:42:26
321
原创 typeScript的介绍与变量定义的基本类型
TypeScript是拥有类型的超集,它可以编译成普通、干净、完整的代码;最终会被编译成js的代码来运行,并拥有js的所有特性;它紧随ECMAScript的标准,所以ES6、ES7、ES8等新语法标准,它都是支持的;不仅仅增加了类型约束,而且包括一些语法的扩展等;........................
2022-06-21 18:42:46
643
4
原创 web前端项目 - cypress自动化测试运行构建
cypress是指控制测试流程,并比较实际结果与预期结果之间的差异。可替代大量的手工测试操作,使得测试可以快速,反复的进行;cypress的语法类似于JQuery,比较好理解
2022-06-17 17:02:48
1273
原创 typeScript的定义类型:不能将类型“Timeout”分配给类型“number”;
Typescript 给setTimeout 的返回值定义为 number并给于赋值时,会报如下错误:错误信息:`不能将类型“Timeout”分配给类型“number”`;其解决思路是查看当前环境下,对此方法的所定义的类型与引用;
2022-05-27 12:06:01
10748
3
原创 font-size有关rem的适配 -无需使用JavaScript代码进行多设备的适配
面对不同设备的适配与响应;这里介绍不同的是@media规则进行匹配不同的设备;不同的设备宽度不尽相同,尺寸有320px,360px,375px,414px…等常见的宽度,面对在不同的尺寸环境下,文字的阅读体验问题,我们常常使用的是CSS单位 - rem;*其中“r“代表的是root的意思,在HTML网页中,root指的就是<html>元素
2022-03-31 19:12:50
2043
原创 js的设计模式 - 【观察者模式】
当对象间存在一对多关系时,则使用观察者模式(Observer Pattern)。比如,当一个对象被修改时,则会自动通知它的依赖对象。一对多的关系。
2022-03-21 15:26:45
1413
原创 css变量在静态饼图与进度条上的使用
使用css变量实现圆形静态饼图的百分比与进度条的进程;结合css的样式来展示进度,使用opacity与counter来展示进度的百分比值;
2022-03-21 12:48:48
1196
原创 使用background多背景与border-radius圆形 - 绘制icon的图标与特别样式的应用
使用css的属性制作一些小众的样式,减少使用对icon图片导入;使用background多背景实现icon的加减效果这里应用多背景的属性,书写加减后的图标;代码示例如下:<style>.btn-add,.btn-sub { width: 1.5rem; height: 1.5rem; border: 1px solid gray; background: linear-gradient(currentColor, currentColor) no-repeat
2022-03-19 23:31:03
285
原创 css渐变色边框的实现的方法
常见的渐变色边框的实现;可以实现对布局没有影响的轮廓扩展,分别是:outline轮廓,box-shadow盒阴影,border-image边框图片;
2022-03-18 20:21:06
2918
原创 基于javascripts的语法特性使用设计原则
从javacript的角度来使用与学习设计模式;现有“设计”后有“模式”,因此应该“从设计到模式”,不能将“设计模式”作为一个词来称呼。根据这种设计到形成固有模式的思想来学习设计模式,代入到学习设计模式中,帮助更好的理解
2022-03-10 15:49:01
957
原创 UML类图的辅助构建的逻辑代码
UML - Unified Modeling Language - 统一建模语言,用类图来描述class类之间的继承与实例的关系;工作中,每次新项目或者新功能开发之前,都可先画好 UML 图,和同事一起确认评审。理清类之间的关系,接下来就是劳动工作中微调思路;UML类图也可帮助快速的了解当前实现的代码结构;推荐使用!
2022-03-09 09:54:02
736
原创 javaScript的面向对象
面向对象,Object Oritented(简称 OO)是一种目前主流的编程思想,也是学习设计模式的前提,因为设计模式就是基于面向对象思想的。面向对象的三要素及其使用,基本的应用场景及思想,都值得去深刻的思考
2022-03-09 07:47:45
203
原创 js设计模式的讲解与应用 - 【单例模式】
单例模式的定义是:保证一个类仅有一个实例,并提供一个访问它的全局访问点;按照面向对象的编程思想,任何东西都可以抽象为一个类,然后可以`new`出若干个对象。但是针对某些场景,只能存在唯一的对象;例如:`jQuery`中的$; 登录;购物车等;
2022-02-18 18:29:41
972
原创 MutationObserver监听DOM树变化来异步的执行异步的回调
使用MutationObserver实现监听并观察DOM树的一部分或某个元素的变化;主要应用于该元素的属性或显示状态发生改变时,执行异步回调(如埋点或者添加属性行为);
2022-02-14 10:19:53
674
原创 arguments的类数组让递归函数解耦
arguments是包含调用函数时传入的所有参数的类数组,arguments`对象其实有个callee属性,是指向arguments对象所在函数的指针;可以解决递归函数的函数名紧密耦合的问题
2022-02-13 08:53:59
251
原创 js中垃圾回收机制与内存管理/泄漏之间的联系
javascript垃圾回收机制原理,通过自动内存管理实现内存分配和闲置资源回收;垃圾回收程序的主要的标记策略:标记清理和引用计数;其中存在的内存管理已内存泄漏之间的联系;
2022-01-25 16:36:53
860
原创 css子元素选择父元素的实现
css元素不能往前选择,即不能选择父元素或前兄弟元素;这都受制于DOM渲染规则;而这里我们使用别的方法来实现前元素或父元素选择的效果;有改变dom的排版位置,:focus-within伪类的选择;
2022-01-24 10:36:48
24495
2
原创 css选择器的逻辑组合伪类 -not()/ is()/where()
css选择器的逻辑组合伪类 -not()/ is()/where()在项目中的使用;可使代码更加简洁,更好理解,保护了类名的优先级,扩展性更强,更利于维护!
2022-01-21 21:00:40
1202
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人