- 博客(244)
- 收藏
- 关注
RSS订阅原创 CSRF攻击及防范
CSRF攻击及防范1 什么是CSRF2 CSRF攻击过程3 CSRF类型3.1 按照请求类型分类3.1.1 GET型3.1.2 POST型3.2 按照攻击方式分类3.2.1 HTML CSRF攻击3.2.2 JSON Hijacking攻击3.2.3 Flash CSRF攻击4 CSRF危害5 如何防御CSRF5.1 阻止不明外域的访问5.2 token
2023-02-12 23:50:22
80
原创 XSS攻击及防范
XSS攻击及防范1 什么是XSS2 XSS类型2.1 反射型XSS2.2 存储型XSS2.3 DOM型XSS3 怎么预防XSS3.1 纯前端渲染3.2 转义HTML3.3 关注高危API3.4 其他措施
2023-02-06 00:03:19
222
原创 React实现移动端输入短信验证码页面
React实现移动端输入验证码页面，包括实现效果与实现代码，主要功能：进入页面自动发送验证码，验证码输入完成后，触发验证码校验，可以手动输入或者删除验证码
2023-01-16 21:45:00
158
1
原创 Vue自定义指令
在Vue中可以自定义指令，通过自定义指令，我们可以对DOM进行更多的底层操作，这样不仅可以在某些场景下为我们提供快速解决问题的思路，而且让我们对Vue的底层有了进一步的了解。
2022-12-05 22:17:47
235
原创 Vue Class与Style绑定
Vue Class与Style绑定1 Class绑定1.1 字符串写法1.2 数组写法1.3 对象写法2 Style绑定2.1 对象写法2.2 数组写法
2022-12-03 22:56:49
551
原创 CSS3响应式布局（媒体查询@media）
CSS3响应式布局（媒体查询@media）1 响应式布局2 媒体查询2.1 媒体类型2.2 逻辑运算符2.3 媒体特性3 案例：根据页面宽度改变背景色
2022-11-28 22:40:19
457
原创 Javascript方法call、apply、bind的解析与实现
Javascript方法call、apply、bind的解析与实现1 this的指向2 如何改变this的指向3 call3.1 使用方式3.2 call的实现4 apply4.1 使用方式4.2 apply的实现5 bind5.1 使用方式5.2 bind的实现6 call、apply、bind的区别
2022-11-21 00:25:18
258
原创 CSS :has伪类
CSS :has伪类1 概述2 实例说明2.1 表单元素前面加*2.2 拖拽列表2.3 多层级hover2.4 评星组件3 兼容性
2022-11-13 22:36:30
1291
原创 display属性详解及用法
display属性详解1 block、inline、inline-block2 flow-root3 table、inline-table4 flex、inline-flex5 none6 list-item7 contents8 grid、inline-grid
2022-11-06 11:53:08
1415
原创 CSS控制文本超出打点显示
CSS控制文本超出打点显示1 单行文本过长打点2 多行文本打点显示3 涉及的属性3.1 white-space3.2 text-overflow
2022-10-27 22:33:37
1754
原创 React.lazy与Suspence实现延迟加载
React.lazy与Suspence实现延迟加载1 代码分割2 React.Lazy3 Suspense4 备注
2022-10-18 22:36:12
629
1
原创 JavaScript数据结构之链表
JavaScript数据结构之链表1 数组与链表的优缺点2 什么是链表3 封装链表结构4 向链表尾部添加一个新的项5 向链表某个位置插入一个新的项6 获取对应位置的元素7 获取元素在链表中的索引8 修改某个位置的元素9 从链表中删除某位置节点10 全部代码......
2022-08-13 12:13:42
109
原创 Promise原理及实现
Promise原理及实现1 Promise核心逻辑实现2 加入异步逻辑3 then方法添加多次调用逻辑4 链式调用then方法5 Promise错误捕获6 then方法参数设置为可选7 实现Promise.all8 实现Promise.resolve9 实现Promise.race10 实现finally方法11 实现catch方法12 全部代码展示...
2022-08-09 20:53:23
222
原创 Vue事件修饰符
Vue事件修饰符1 .prevent：阻止默认事件2 .stop阻止事件冒泡3 .once事件只触发一次4 .capture使用事件捕获模式5 .self当e.target是当前操作的元素才触发事件6 .passive：事件的默认行为立即执行7 键盘事件...
2022-07-26 23:29:56
326
原创 JavaScript中继承的实现方式
JavaScript中继承的实现方式1 构造函数式继承2 类式继承（原型式继承）3 组合式继承4 寄生式继承5 寄生组合式继承1 构造函数式继承构造函数式继承就是在子类中执行父类的构造函数，并为其传递参数，这个过程可以使用call()函数来实现。示例代码：定义Person类（父类），它有自己的属性name和age，还有自己的方法getName()和getAge()function Person(name, age) { this.name = name; // 初始化姓名和年龄 th
2022-05-15 17:00:08
215
原创 Git本地库与远程库交互
Git本地库与远程库交互1 初始化本地库2 创建Github远程库3 在本地创建远程库地址的别名4 将本地库中内容推送到远程库5 将远程库的内容克隆到本地
2022-05-14 16:57:10
206
原创 Git分支概述
Git分支概述1 什么是分支2 操作分支2.1 查看分支2.2 创建分支2.3 切换分支3 分支冲突3.1 分支合并3.2 解决冲突1 什么是分支在版本控制的过程中，使用多条线同时推进多个任务。其中，多条线就是多个分支。下面以图来说明。在本地库被初始化之后，有一个主分支（也叫主干）master，主干上有一些版本，正常情况下我们可以根据上一个版本去开发下一个版本：但是如果我们要开辟新的功能，那么就不能在主分支上面继续开发，因为新的功能可能对主干有影响，或者说开发之后并不知道它的好坏，那么我们就可以开
2022-05-13 23:11:59
124
原创 Git基本操作
1 Git初步操作1.1 查看当前版本1.2 清屏1.3 设置签名2 创建版本库（仓库）3 添加文件到版本库4 检查是否有未提交的文件5 检查文件被修改的内容6 查看历史变更记录7 版本回退8 删除文件
2022-05-13 20:33:33
169
原创 TypeScript泛型
TypeScript泛型1 什么是泛型2 泛型方法3 泛型类4 泛型接口1 什么是泛型泛型的本质是参数化类型，也就是说所操作的数据类型被指定为一个参数。这种参数类型可以用在类、接口和方法的创建中，分别称为泛型类、泛型接口、泛型方法。泛型使用<T>来定义类型，<T>中的T可以是U也可以是其他合法的字母，建议大写。泛型可以理解为不确定单独类型，函数中使用泛型，可以约束函数的参数和返回值类型相同。2 泛型方法当定义identity函数时，这个函数会返回任何传入它的值，不用泛型的
2022-05-09 12:11:10
122
原创 TypeScript接口
TypeScript接口1 概述2 接口类别2.1 属性接口2.2 可选接口2.3 函数类型接口2.4 可索引接口2.5 类类型接口3 接口继承1 概述接口是一种规范的定义，它定义了行为和动作的规范；在程序设计里面，接口起到一种限制和规范的作用。接口定义了某一批类所需要遵守的规范，接口不关心这些类的内部状态数据，也不关心这些类里方法的实现细节，它只规定这批类里必须提供某些方法，提供这些方法的类就可以满足实际需要。接口使用interface关键字来进行定义。2 接口类别2.1 属性接口属性接口对传
2022-05-08 23:32:23
290
原创 TypeScript面向对象
TypeScript面向对象1 面向对象原则2 TypeScript类2.1 类的定义2.2 创建实例对象3 类的继承4 static关键字5 抽象类和抽象方法6 类属性权限修饰符6.1 public（公有的）6.2 protected（受保护的）6.3 private（受保护的）6.4 readonly（只读）7 存取器1 面向对象原则单一原则：一个类只负责一个职责。里氏替换原则：子类可以在任何地方替换它的父类。依赖倒置原则：代码要依赖于抽象的类，而不要依赖于具体的类；要针对接口或抽象类编程，而
2022-05-08 22:00:50
505
原创 JavaScript防抖与节流
JavaScript防抖与节流1 为什么需要防抖和节流2 防抖与节流原理3 实现一个防抖函数3.1 初步实现3.2 this问题3.3 event问题3.4 立即执行3.5 返回值问题3.6 取消防抖3.7 总结4 实现节流函数4.1 通过时间戳实现节流4.2 使用定时器实现节流4.3 时间戳和定时器组合实现4.4 节流优化5 应用场景1 为什么需要防抖和节流在前端开发当中，有些交互事件，会被频繁触发，这样会导致我们的页面渲染性能下降，如果频繁触发接口调用的话，会直接导致服务器性能的浪费。举个例子，在
2022-05-07 21:34:38
542
原创 JavaScript垃圾回收机制
JavaScript垃圾回收机制1 垃圾为何要产生并回收2 垃圾回收机制2.1 标记清除法2.2 引用计数法3 V8对垃圾回收机制的优化——分代式垃圾回收机制3.1 新生代与老生代3.2 新生代的垃圾回收3.3 老生代的垃圾回收1 垃圾为何要产生并回收当我们写代码时创建一个基本类型、对象、函数等，都是需要占用内存的，JavaScript基本数据类型存储在栈内存中，引用数据类型存储在堆内存中，但是引用数据类型会在栈内存中存储一个实际对象的引用。比如说我们创建了一个person对象，然后将person对象
2022-05-05 17:11:53
3822
2
原创 JavaScript快速排序
JavaScript快速排序1 思想2 代码1 思想快速排序是最慢的冒泡排序，它可以在一次循环中找出某个元素的正确的位置，并且该元素之后不需要任何移动，最重要的思想是分而治之。例如，对数组 [13,81,92,43,65,31,57,26,75,0] 进行排序第一步：我们在这个数组中选出了65（随便选的）第二步：将所有小于65的放在65的左边，将所有大于65的放在65的右边第三步：递归处理左边的数据，递归处理右边的数据第四步：排序完成在上面的步骤中，对于随机选出的65就叫做枢纽（也有人叫
2022-04-21 10:29:28
95
原创 JavaScript希尔排序
JavaScript希尔排序1 思路2 代码实现1 思路希尔排序是一种基于插入排序的快速排序算法，也成为缩小增量排序。简单插入排序对于大规模乱序数组很慢，因为元素只能一点一点地从数组的一端移动到另一端。希尔排序为了加快速度简单地改进了插入排序，同时该算法是冲破O(n2)的第一批算法之一。希尔排序是把数组按照一定的增量分组，对每组使用直接插入排序算法排序；然后缩小增量继续分组排序；随着增量逐渐减少，每组包含的关键词越来越多，当增量减至1时，整个数组被分成一组，再次排序，就可以完成整个数组的排序。增量的
2022-04-21 09:47:34
353
原创 JavaScript滑动窗口算法
JavaScript滑动窗口算法1 思想2 代码1 思想在力扣上刷题时经常可以看到这样的题，求XXX的子串、子数组、子序列等等，这类题一般使用滑动窗口来解决。本篇文章的思路学习了bilibili的up主红桃A士。情况一：寻找最长的①初始化左右指针left和right，左右指针之间的内容就是窗口，定义一个变量result记录当前的滑动窗口的结果，定义一个变量bestResult记录当前滑动窗口下的最优结果②right要向右逐位滑动循环③每次滑动后，记录当前滑动的结果。如果当前的结果符合条件，则更
2022-04-09 22:41:22
2105
原创 用git将项目代码上传到github
用git将项目代码上传到github1 注册账户以及创建仓库2 将本地项目上传到Github上3 进行页面展示1 注册账户以及创建仓库注册地址：https://github.com/安装git工具：https://git-for-windows.github.io/进入Github首页，点击New repository新建一个项目接下来填写响应的信息后点击Create repository即可。Repository name：仓库名称Description（可选）：仓库描述介绍Publi
2022-04-05 10:23:22
408
原创 Git版本控制介绍与安装
Git版本控制介绍与安装1 Git是什么2 集中化与分布式的版本控制系统3 Git结构介绍3 Git工作流程5 Git 安装配置（Windows 平台上安装）1 Git是什么Git 是一个免费的、开源的分布式版本控制系统，用于敏捷高效地处理任何或小或大的项目。Git 是 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。Git 与常用的版本控制工具 CVS，Subversion 等不同，它采用了分布式版本库的方式，不必服务器端软件支持。什么是版
2022-04-04 18:25:02
198
原创 TypeScript函数（方法）
TypeScript函数（方法）1 函数的定义2 函数中的参数3 函数的返回值4 函数的调用5 函数的重载1 函数的定义1、声明式function getInfo(name: string, age: number): string { return `I am ${name} and I am ${age} years old`;}ts在传参时都会规定参数的类型，还有它返回值的类型也会在函数执行之前都已经规定好，如果传参的类型和返回值的类型不符合，ts编译会报错。2、匿名函数con
2022-04-02 20:57:28
811
原创 TypeScript语法基础
TypeScript语法基础1 TypeScript 是什么2 获取TypeScript3 变量声明4 数据类型4.1 Boolean、Number、String、字面量4.2 any与unknown4.3 void与never4.4 Object、Array、Enum5 Map 对象6 TypeScript 元组7 TypeScript 联合类型8 循环结构1 TypeScript 是什么TypeScript 是一种由微软开发的自由和开源的编程语言。它是 JavaScript 的一个超集，而且本质上向
2022-04-02 19:16:04
969
原创 JavaScript选择排序
JavaScript选择排序1 思想2 代码1 思想选择排序思想如下：找到数组中最大（最小）的元素；将该元素与数组中第一个元素交换位置（如果第一个元素就是最大或者最小的元素那么就和自己交换位置）在剩下的元素中找到最大（小）的元素，将它与数组的第二个元素交换位置。如此往复，直到将整个数组排序。从上面的过程可以看出，选择排序在不断地选择剩余元素中的最大（小）者。例如，当前有数组 [4, 7, 2, 8, 0, 3] 从小到大排序，它的选择排序过程如下：步骤数组说明1[
2022-04-02 13:42:49
2158
2
原创 Vue的内置指令
Vue内置指令1 v-show：根据表达式的真假值来显示和隐藏元素2 v-html：插入标签3 v-text：在元素当中插入值4 v-if和v-else：根据表达式的真假值来动态插入和移除元素5 v-for：根据变量的值来循环渲染元素6 v-bind：单向绑定绑定元素的属性7 v-on：监听元素事件，并执行相应的操作8 v-model：实现了数据和视图的双向绑定9 v-once：让元素或组件只渲染一次10 v-pre：跳过这个元素和它的子元素的编译过程11 v-cloak：解决初始化慢
2022-03-22 14:15:22
1151
原创 Vue中v-if和v-show的比较
Vue中v-if和v-show的比较v-if和v-show都可以控制元素是否在页面上显示，下面两个例子说明v-if和v-show的用法。示例代码：v-if <!-- 下面的代码可以显示p标签，因为v-if的参数值表达式判断是true --> <div id="app"> <!-- v-if可以通过判断表达式的真假动态的插入和移除元素 --> <p v-if="key == 1">橘猫吃不胖</p>
2022-03-22 13:16:38
1065
原创 Vue实例的属性及模板渲染
Vue实例的属性及模板渲染1 概述2 el：与DOM元素绑定3 data：定义双向绑定的数据4 computed：计算属性5 methods：定义Vue实例的方法6 Vue中的三种模板6.1 html模板6.2 字符串模板6.3 render函数模板7 watch属性8 模板渲染8.1 条件渲染8.2 列表渲染
2022-03-19 11:29:11
2008
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人