- 博客(31)
- 收藏
- 关注
RSS订阅原创 JavaScript正则表达式
什么是正则表达式？由以下两种字符组成的文字模式 1、普通字符（例如26个英文字母、数字等） 2、特殊字符（有特殊含义的，例如.\等）该模式描述在查找文字主体时待匹配的一个或多个字符串。正则表达式作为一个模板，将某个字符串模式与所搜索的字符串进行匹配。为什么使用正则表达式？ 查找、替换、数据有效性验证。
2025-11-07 18:03:29
851
原创 grid布局
效果：当缩小屏幕宽度时，列的数量会减少，最小是200px，最大时1fr。justify-content 是控制列轨道在容器内水平分布。自动填充：适用于响应式布局中“列数随容器宽度变化”的场景。auto-fit：尽可能拉伸列填满容器，当只有一行的时候。/*自动填充列，最小宽度200px，最大宽度1fr*//*自动填充列，最小宽度200px，最大宽度1fr*/place-items：水平+垂直对齐方式。justify-items：水平对齐方式。auto-fill：尽可能多的创建列。注意：是给父容器添加的。
2025-11-05 13:18:24
656
原创 自动监测更新
分析：打了生产包后，JS文件的文件名称（文件指纹）就会发生变化，我们每隔一段时间，获取服务器上的index.html文件后，分析里面的script标签上src的值是否发生了变化，如果发生了变化，就代表生产包更新了，就提示用户刷新浏览器。需求：我们如果打了最新的生产包，并发布到服务器上了，提示用户需要刷新浏览器，获取最新的页面。
2025-09-12 10:00:00
173
原创 响应式布局
响应式布局是一种网页设计方法，使网页能够根据用户设备的屏幕尺寸、分辨率、方向（横屏/竖屏）等特性自动调整布局和内容，提供一致且优化的用户体验。其核心目标是“一次设计，多端适配”。
2025-09-11 23:20:59
202
原创 前端性能优化
缓存对于前端性能优化来说是个很重要的点，良好的缓存策略可以降低资源的重复加载提高网页的整体加载速度。通常浏览器缓存策略分为两种：强缓存和协商缓存。
2025-09-04 10:27:03
920
原创 TypeScript
any 的含义是：任意类型，一旦将变量类型限制为 any ，那就意味着放弃了对该变量的类型检查注意点： any 类型的变量，可以赋值给任意类型的变量。
2025-08-28 00:30:16
757
原创 Vuex的基本使用
vuex是一个状态管理工具，可以用于组件通信安装vuex在src下创建一个目录store，store下创建一个文件index.js，其代码如下之后，在main.js文件中，写上如下代码，我们就可以在别的组件里使用这个vuex了。
2024-12-03 19:54:18
609
1
原创 单点登录的三种模式
单点登录存在的意义在于，比如公司里有多个系统，我只想登录一次，便可以在访问多个系统单点登录有很多模式，目前已知三种模式1、cookie + session模式2、token模式3、token + refresh_token模式。
2023-12-30 16:56:57
1081
原创 工作实战：Vue关于ElementUI二次封装的问题
解决方法：用批量属性传值的方法，学过react的都知道，类似于{…props}批量传值。有的属性可能需要二次处理，可以使用props接收，props过来的属性，不会出现在$attrs里了。你可以单独处理后再放回elementui的原生组件里了。
2023-04-07 00:25:35
1662
原创 过渡&2D变换&动画
过渡/*默认值：*/transition-delay: 0stransition-duration: 0stransition-property: alltransition-timing-function: ease/*简写，推荐书写顺序如下*/ transition:transition-duration transition-property transition-timing-function transition-delay transition-duration属性:以秒或
2021-04-11 14:28:43
190
原创 Promise的学习总结
回调地狱的产生无法保证顺序的代码：var fs = require('fs')fs.readFile('./data/a.txt', 'utf8', function (err, data) { if (err) { // return console.log('读取失败') // 抛出异常 // 1. 阻止程序的执行 // 2. 把错误消息打印到控制台 throw err } console.log(data)})fs.re
2020-09-15 10:39:15
282
1
原创 闭包
闭包（closure）1.如何产生闭包？ 当一个嵌套的内部（子）函数引用了嵌套的外部（父）函数的变量（函数），内部函数被定义时（即外部函数被执行时），就产生了闭包。 外部函数执行几次就产生了几个闭包2.闭包到底是什么？ * 使用chrome查看 * 理解一：闭包是嵌套的内部函数（绝大多数人） * 理解二：包含被引用变量（函数）的对象（极少数人） * 注意：闭包存在于嵌套的内部函数中 3.产生闭包的条件？函数嵌套内部函数引用了外部函数的数据（变量/函数）如下代码
2020-08-17 11:12:51
302
原创 ES6的必备知识
let和const的使用let和var的区别？let声明的变量只在当前（块级）作用域内有效let声明的变量不能被重复声明（包括普通变量和函数参数）不存在变量提升（注意考虑暂时性死区）不能当成window的属性（用var声明的全局变量是window的属性）1、只在块级作用域内有效{ let a = 10;//局部变量}console.log(a);//访问报错2、不能被重复声明let a = 10;let a = 20; //报错3 、不存在变量提升console.
2020-07-30 21:34:01
416
原创 数组排序
这里先介绍两种常见的，后续会补充冒泡排序function bubbleSort(arr) { //外层控制轮数，轮数是元素的个数减1 for (var i = 0; i < arr.length - 1; i++) { //内层控制每轮比较的次数，随着轮数每增加1轮，次数减少1 for (var j = 0; j < arr.length - 1 - i; j++) { if (arr[j] > arr[j + 1
2020-07-23 10:23:53
157
原创 数组去重的方法
第一种function norepeat(arr) { for (var i = 0; i < arr.length - 1; i++) { for (var j = i + 1; j < arr.length; j++) { if (arr[i] == arr[j]) { arr.splice(j, 1);//删除一个元素之后，原数组发生改变，后边的元素会往前进一步，但是j是正常累加 j--
2020-07-22 21:10:36
235
原创 字符串的常用方法
字符串的基本操作var str = "abcde";console.log(str[0]); //获取对应索引的字符console.log(str.length); //获取字符串的长度for (var i = 0; i < str.length; i++) { //遍历字符串 console.log(str[i]);}charAt(index)取到index这个索引对应的字符var str = "abcd";var s = str.charAt(1);console.l
2020-07-22 14:48:37
475
原创 JS数组的方法
1、concat合并数组，可以合并一个或者多个数组，会返回合并数组之后的数据，不会改变原来的数组var str1 = [12, 2, "hello"];var str2 = ["world"];console.log(str1.concat(str2)); //[12,2,"hello","world"]console.log(str1); //[12,2,"hello"]2、join将数组转为字符串并返回转化的字符串数据，不会改变原来的数组注意：()中用双引号包括自己想用的分隔符，默认为逗号
2020-07-18 15:13:57
411
原创 CSS垂直水平居中
1、position:absolute;left:50%;top:50%;margin-left:-(width/2)px;margin-top:-(height/2)px;2、position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;3、position:absolute;left:50%;top:50%;tranform:translate(-50%,-50%);4、position:absolute;left:50%;top:50%;
2020-07-08 09:14:03
165
原创 伪类选择器和伪元素
伪类选择器伪类选择器有以下6种：动态伪类：锚点伪类用户行为伪类目标伪类UI元素状态伪类否定伪类选择器语言伪类选择器CSS3结构伪类动态伪类这些伪类并不存在于HTML中，只有当用户和网站交互的时候才能体现出来锚点伪类 link visited hover active（一定要按照这个顺序写）用户行为伪类 hover active focus目标伪类用于命名锚记<!DOCTYPE html><html lang="en">
2020-07-02 17:13:35
270
原创 JavaScript正则表达式
正则表达式（ Regular Expressions）介绍什么是正则表达式？由以下两种字符组成的文字模式 1、普通字符（例如26个英文字母、数字等） 2、特殊字符（有特殊含义的，例如.\等）该模式描述在查找文字主体时待匹配的一个或多个字符串。正则表达式作为一个模板，将某个字符串模式与所搜索的字符串进行匹配。为什么使用正则表达式？ 查找、替换、数据有效性验证初始正则表达式正...
2020-06-03 17:56:59
289
1
原创 CSS选择器和CSS3选择器
文章目录CSS导入方式css导入方式优先级CSS选择的艺术标签选择器类选择器ID选择器群组选择器全局选择器后代选择器伪类选择器CSS继承和层叠CSS权重CSS命名规范CSS3选择器基本选择器子元素选择器相邻兄弟元素选择器通用兄弟选择器群组选择器属性选择器Element[attribute]Element[attribute=“value”]Element[attribute~=“value”]El...
2020-01-09 16:52:48
310
原创 原型与原型链的基本知识
原型和原型链（prototype）介绍1、函数的prototype属性 每个函数都有一个prototype属性，它默认指向一个Object空对象（除了Object函数）即称为：原型对象，并不是真是空的，只是没有我们添加的属性和方法而已 原型对象中有一个属性constructor，它指向函数对象，还有一个__proto_属性2、给原型对象添加属性（一般都是方法） 作用：函数的所有实...
2019-11-28 18:19:38
233
原创 flex布局
Flex 是 Flexible Box缩写，意为“灵活的盒子”或“弹性的盒子”，所以flex布局一般也叫弹性布局采用flex布局的元素，称为flex容器，容器的属性如下：flex 容器的所有子元素自动成为容器成员，称为flex项目（注意：孙子元素不会成为容器成员）
2019-11-25 17:21:19
2117
3
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人