- 博客(487)
- 收藏
- 关注
RSS订阅原创 前端算法 === 计数排序
计数排序是一种简单而高效的排序算法，特别适合于处理一定范围内的整数排序问题。它的核心思想是利用额外的存储空间来记录数组中每个元素出现的次数，然后根据这些计数来重新构建一个有序的数组。以下是对计数排序算法的详细介绍。
2024-08-24 16:42:09
166
原创 JavaScript 数据结构 ==== 二叉树
二叉树中的节点最多只能有2个子节点，一个是左侧子节点，一个是右侧子节点，这样定义的好处是有利于我们写出更高效的插入，查找，删除节点的算法。二叉搜索树是二叉树的一种，但是它只允许你在左侧子节点存储比父节点小的值，但在右侧节点存储比父节点大的值。接下来我们将按照这个思路去实现一个二叉搜索树。
2024-08-24 12:53:14
586
原创 用 JavaScript 实现归并排序
在本文中，我们了解了Merge Sort算法背后的逻辑，并用 JavaScript 实现。它是基本排序算法之一，可以帮助我们更好的了解分治法策略。
2024-08-21 18:07:10
589
原创 前端算法 | LeetCode第 70 题爬楼梯问题
第一步：如果你现在只有1个台阶（n=1），你只有一种方法，那就是直接走上去。所以，f(1)=1。第二步：如果你有2个台阶（n=2），你有两种方法：先走1个台阶再走1个台阶，或者直接走2个台阶。所以，f(2)=2。
2024-08-21 11:49:37
747
原创 TypeScript 快速上⼿ （2）
/ PersonInterface接口，用与限制Person类的格式// 定义一个类 Person，实现 PersonInterface 接口// 实现接口中的 speak 方法i < n;i++) {// 打印出包含名字和年龄的问候语句console.log(`你好，我叫${this.name}，我的年龄是${this.age}`);// 创建一个 Person 类的实例 p1，传入名字 'tom' 和年龄 18// 只读属性age?: number;// 可选属性。
2024-08-17 22:49:37
1436
原创 TypeScript 快速上⼿ （1）
⼀、TypeScript 简介1.TypeScript由微软开发，是基于JavaScript的⼀个扩展语⾔。2.TypeScript包含了JavaScript的所有内容，即：TypeScript是JavaScript 的超集。3.TypeScript增加了：静态类型检查、接⼝、 泛型等很多现代开发特性，更适合⼤型项⽬的开发。4.TypeScript需要编译为JavaScript，然后交给浏览器或其他JavaScript运⾏环 境执⾏。
2024-08-15 15:24:57
793
原创 微信小程序 ==== 半屏打开小程序
当小程序需要打开另一个小程序让用户进行快捷操作时，可将要打开的小程序以半屏的形态跳转。只有在当前小程序是被其他小程序打开时可以调用成功。获取本次小程序启动时的参数。：当前是插件页面时，宿主小程序不能调用该接口，反之亦然。：当前是插件页面时，宿主小程序不能调用该接口，反之亦然。基础库 2.20.1 开始支持，低版本需做。基础库 1.3.0 开始支持，低版本需做。：支持，需要小程序基础库版本不低于。：支持，需要小程序基础库版本不低于。时，可以判断此时小程序被半屏打开。被半屏打开的小程序可以以通过调用。
2024-08-14 18:24:21
1013
原创 深入理解IP地址、子网掩码、网关的概念
即“网络之间能相互连通的协议”，即计算机与计算机之间借助网络的相互通信都得遵循IP协议。IP地址是用来标识每台计算机的身份，它为互联网上的每台计算机分配一个逻辑地址，标识这台计算机的唯一。即计算机的网络身份证。打个比方，你开车允许你上高速公路，那么你的车辆就必须得上牌照，别人的车辆也上了牌照，那么大家都可以上高速公路，车辆没上牌照的就不能上公路了。而在这里这个IP协议，就相当于车辆需要安装的牌照。即用来判断两台计算机的IP地址是否属于同一个网络段的判断。
2024-08-13 09:22:35
965
原创 程序员 Homebrew 使用指南
对于习惯了使用命令来完成一切的程序员来说，安装软件这种小事，自然是能够用命令解决，就不用图形界面选择。但是在 Linux 中，我们有yumaptdnfpkg等命令来完成软件的安装，macOS 却并未为我们提供一个好用的包管理器，帮助我们更好的使用 macOS。好在，虽然官方没有提供，我们却可以使用这一神器，来完成类似的工作，就如同 Homebrew 的 Slogan ：“The missing package manager for macOS (or Linux)”
2024-08-12 16:27:09
951
原创 ping和telnet测试连通性小结
ping和telnet是测试网络连通时最常用的两个命令， 一般用ping命令测试网络是否通畅或网络连接速度(Ping域名可以得出解析IP) ，用telnet命令则用于测试目标主机是否打开了某端口（默认是23）。常见的使用场景是，不管三七二十一，先ping一下域名或IP，确认能连通到目标主机，然后再根据需要用telnet IP port测试目标主机上的某个端口是打开的。要理解这些情况，就需要弄清楚ping和telnet到底做了什么。
2024-08-12 11:26:24
545
原创 微信小程序如何实现页面传参
只要你的小程序超过一个页面那么可能会需要涉及到页面参数的传递，下面我总结了 n 种页面方法。全局变量大家可以针对具体业务场景来进行选择合适自己的传参方式。
2024-08-12 10:20:55
795
原创 小程序中的WXS脚本
WXS（WeiXin Script）是小程序的一套脚本语言，结合WXML，可以构建出页面的结构。【注意】<wxs>模块只能在定义模块的 WXML 文件中被访问到。使用<include>或<import>时，<wxs>模块不会被引入到对应的 WXML 文件中。<template>标签中，只能使用定义该<template>的 WXML 文件中定义的<wxs>模块。
2024-08-08 18:25:35
635
原创 微信小程序之behaviors
behaviors是用于组件间代码共享的特性，类似于一些编程语言中的 “mixins” 或 “traits”。每个behavior可以包含一组属性、数据、生命周期函数和方法。组件引用它时，它的属性、数据和方法会被合并到组件中，生命周期函数也会在对应时机被调用。每个组件可以引用多个behaviorbehavior也可以引用其它behavior。
2024-08-04 19:01:28
1364
1
原创 速通JS模块化规范
●将程序文件依据一定规则拆分成多个文件，这种编码方式就是模块化的编码方式。●拆分出来每个文件就是一个模块，模块中的数据都是私有的，模块之间互相隔离。●同时也能通过一些手段，可以把模块内的指定数据“交出去”，供其他模块使用。
2024-07-30 16:29:42
1576
原创 使用 URLSearchParams 读取和更新查询参数
前端中常见的任务之一是获取url上的参数。但是似乎很少有人知道，现在有一个 API 用于处理直接嵌入到浏览器中的查询参数，它称为。在这篇文章中，我们将快速体验一下 API，看看使用查询参数有多么容易。
2024-07-29 09:37:11
316
原创 fetchApi === 入门篇
原生fetch虽然已经支持 promise 了，相比 XMLHttpRequest 已然好用了很多，但是参数还是需要自己处理，比较麻烦。通过数据流（Stream对象）处理数据，可以分块读取，有利于提高网站性能，对于大文件或者网速慢的场景极为有用。采用了模块化设计，API分散于多个对象中（如：Response对象、Request对象、Header对象）Response 对象根据服务器返回的不同类型的数据，提供了不同的读取方法。，此外还可以接收第二个参数，作为配置对象，可以自定义发出的HTTP请求。
2024-07-27 11:32:49
826
原创 JavaScript中 FileReader 对象详解
FileReader 对象允许 Web 应用程序异步读取存储在用户计算机上的文件（或原始数据缓冲区）的内容，使用 File 或 Blob 对象指定要读取的文件或数据。其中 File 对象可以是来自用户在一个 < input > 元素上选择文件后返回的 FileList 对象，也可以来自拖放操作生成的 DataTransfer 对象，还可以是来自在一个 HTMLCanvasElement 上执行 mozGetAsFile() 方法后返回结果。
2024-07-24 11:31:03
1718
原创 彻底理解前端 ==== 表单，FormData 对象
<label for="name">用户名：</label></div><div><label for="passwd">密码：</label>
2024-07-23 11:04:27
756
原创 解决错误：Do not access Object.prototype method ‘hasOwnProperty‘ from target object no-prototype-builtins
Object.create(null) 创建的对象是一个空对象，在该对象上没有继承 Object.prototype 原型链上的属性或者方法,例如：toString(), hasOwnProperty()等方法。Object.create(null)是一种常见的模式，用于创建将用作映射的对象。可以通过使用call()函数来调用不属于本身this对象的方法：Object.hasOwnProperty.call()调用 hasOwnProperty 报错：不要使用对象原型上的方法，因为原型的方法可能会被重写。
2024-07-23 10:02:37
251
原创 如何在 JavaScript 中检查函数是否异步
检查非异步函数是否返回 Promise 的唯一方法是调用它。请注意，如果函数状态发生变化，则调用该函数可能不安全，例如写入数据库。检查该函数是否是异步的 – 然后它会返回 100% 的承诺 时间。检查函数的返回值是否是具有属性的对象 类型函数。
2024-07-23 09:09:42
934
原创 详细讲解vue3 watch回调的触发时机
然而在有些情况下，我们需要在状态变化时执行一些“副作用”：例如更改 DOM，或是根据异步操作的结果去修改另一处的状态。同一个“tick”的意思是，Vue的内部机制会以最科学的计算规则将视图刷新请求合并成一个一个的"tick"，每个“tick”刷新一次视图，比如。Vue 的响应性系统会缓存副作用函数，并异步地刷新它们，这样可以避免同一个“tick”中多个状态改变导致的不必要的重复调用。这意味着如果你尝试在侦听器回调中访问所属组件的 DOM，那么 DOM 将处于更新前的状态。的所属组件的 DOM，你需要指明。
2024-07-22 18:53:41
1170
原创 vue3大事件管理系统 === 文章管理页面 - [element-plus 强化]
chatGPT prompt：封装一个函数，基于 axios， 网络图片地址，转 file 对象， 请注意：写中文注释。组件对外暴露一个方法 open, 基于 open 的参数，初始化表单数据，并判断区分是添加 还是 编辑。默认是英文的，由于这里不涉及切换， 所以在 App.vue 中直接导入设置成中文即可，为了便于维护，直接拆分成一个小组件 ChannelSelect.vue。添加 和 编辑，可以共用一个抽屉，所以可以将抽屉封装成一个组件。如果是编辑操作，一打开抽屉，就需要发送请求，获取数据进行回显。
2024-07-21 21:32:54
670
原创 重新安装依赖后，sass报警告Sass‘s behavior for declarations that appear after nested rules will be changing
今天拉取代码，重新执行pnpm i安装依赖后。发现终端出来了一堆的警告，& {}│。
2024-07-20 10:14:03
2503
原创 vue3大事件管理系统 === 首页 layout & 文章分类页面 -
组件对外暴露一个方法 open, 基于 open 的参数，初始化表单数据，并判断区分是添加 还是 编辑。需求：只有登录页，可以未授权的时候访问，其他所有页面，都需要先登录再访问。添加 和 编辑，可以共用一个弹层，所以可以将弹层封装成一个组件。el-container 右侧。el-aside 左侧。
2024-07-19 14:37:43
853
原创 vue开启eslint后一些⚠️警告处理记录
注意：在 JavaScript 中对象和数组是通过引用传入的，所以对于一个数组或对象类型的 prop 来说，在子组件中改变变更这个对象或数组本身将会影响到父组件的状态。出现这个问题可能是在给组件命名的时候没有使用大驼峰和横线拼接单词，编译的时候会一直报错，而实际上是语法检测问题，每个人或者每个公司团队对语法标准设置不同，这个子组件接下来希望将其作为一个本地的 prop 数据来使用。②：如果这个 prop 以一种原始的值传入且需要进行转换。意外变更父级组件的状态内容，这样会导致你应用的数据流向杂乱无章。
2024-07-17 18:13:50
638
原创 vue中props传值，父组件向子组件传递对象可以直接修改的问题
3.上面简要分析了一下vue组件通信中，父组件传一个对象给子组件，子组件可以直接修改这个数据，并且可以影响父组件的问题，里面涉及到堆空间、栈空间等JavaScript数据类型以及浏览器底层原理的东西，感兴趣的话可以阅读一下相关知识点。从上图可以看到，对象类型是存放在堆空间的，在栈空间中只是保留了对象的引用地址，当 JavaScript 需要访问该数据的时候，是通过栈中的引用地址来访问的，所以，，其中的代码空间主要是存储可执行代码的，栈空间就是调用栈，是用来存储执行上下文的，堆空间是用来储存引用数据类型的。
2024-07-17 17:45:55
872
原创 vue3大事件管理系统 === 登陆页面
PS: 每天账号会重置，如果被重置了，可以去注册页，注册一个新号。【进阶】再次输入密码需要自定义校验规则，和密码框值一致（可选）需求：封装注册api，进行注册，注册成功切换到登录。明确了路由规则，可以全部配完，也可以边写边配。需求：点击注册按钮，注册之前，需要先校验。登录的测试账号: shuaipeng。【需求说明】给输入框添加表单校验。【需求说明1】登录之前的预校验。登录测试密码: 123456。【需求】注册页面基本校验。
2024-07-16 15:02:16
859
原创 element ui中el-form-item的属性rules的用法
在使用Element UI的el-form组件进行表单验证时，如果同时在el-form上绑定了rules，并且在单独的上也绑定了rules，那么Element UI会将两者的规则合并使用。具体来说，对于同一个字段，如果el-form和都有对应的验证规则，那么上的规则会覆盖el-form上的规则。el-form的rules：这是表单级别的验证规则，适用于表单内所有字段。如果表单中的某个字段没有在el-form的rules中明确指定规则，那么它将不会进行验证。el-form-item的rules。
2024-07-16 11:10:04
1867
原创 vue3大事件管理系统 === 初始化项目
优化：由 stores 统一维护，在 stores/index.js 中完成 pinia 初始化，交付 main.js 使用。官方文档：https://prazdevs.github.io/pinia-plugin-persistedstate/zh/- 现在：初始化代码在 main.js 中，仓库代码在 stores 中，代码分散职能不单一。一般项目开发中, 都会对 axios 进行基本的二次封装, 单独封装到一个模块中, 便于使用。**问题：**默认进行的是全量检查，耗时问题，历史问题。
2024-07-15 11:13:08
944
原创 husky 和 lint-staged 构建代码项目规范
Husky 是一个用于管理 Git 钩子的工具，它可以让你在提交代码前自动运行脚本，比如代码格式化、代码检查等。它通过在 Git 仓库的.husky目录下创建钩子脚本来实现这个功能。Husky使 Git hooks 变得简单是一个运行在 Git 钩子上的 Node.js 脚本，它允许你使用 npm 脚本对暂存区的文件进行 lint 检查。它通常与 Husky 结合使用，以确保每次提交的代码都符合代码质量标准。
2024-07-14 22:55:05
1071
原创 前端文件导出设置responseType为blob时遇到的问题及解决
这时我们打印一下接口返回的数据类型，发现接口会返回一个blob类型的数据，并且blob中属性type是application/vnd.ms-excel，这就说明我们导出的文件类型是excel格式的。这篇文章主要给大家介绍了关于前端文件导出设置responseType为blob时遇到的问题及解决方法,文中通过图文介绍的非常详细,对大家的学习或者工作具有一定的参考借鉴价值,需要的朋友可以参考下。是一个 Web API，它允许网页读取用户选择的文件或Blob对象中的数据。它提供了几种读取文件的方法，例如。
2024-07-12 16:37:25
1110
原创 彻底搞懂前端跨域&解决方案
同源策略是浏览器为确保资源安全，而遵循的一种策略，该策略对访问资源进行了一些限制。。1源的组成部分2下面表格中，只有最后一行的两个源是同源。源 1源 2是否同源⛔非同源️⛔非同源⛔非同源✅同 源︎3同源请求4非同源请求5总结:『所处源』与『目标源』不一致，就是『非同源』，又称『异源』或『跨域』
2024-07-12 11:03:09
1762
原创 快速掌握 ==== js 正则表达式
正则表达式是用于匹配字符串中字符组合的模式。许多语言都支持正则表达式，在 JavaScript 中，正则表达式也是对象。就是用来匹配字符串的规则判断一个字符串中是否包含有某个字符或者某个字符串找出字符串’000000O0000000’中是否有大写字母 O判断用户输入的手机号是否合法。
2024-07-09 17:54:14
928
原创 从0-1实现一个前端脚手架
脚手架本质就是一个工具，作用是能够让使用者专注于写代码，它可以让我们只用一个命令就生成一个已经配置好的项目，而不用我们再花时间去配置和安装相关依赖，可以在很大程度上提升我们的开发效率。比如我们常用的create-vue和就是脚手架，很多大厂也都有自己的脚手架。
2024-07-07 13:28:04
775
原创 一文讲懂npm link
掌握npm link的两步流程是对任何Node.js开发者的工具集的一个有益补充。这个过程包括在依赖关系中运行npm link，以及在应用中运行npm link。在本地开发npm模块的时候，我们可以使用npm link命令，将npm 模块链接到对应的运行项目中去，方便地对模块进行调试和测试。但请注意，npm unlink是npm uninstall的别名 ❞。1.为依赖项创建全局软链npm link。一个符号链接，简称软链，是一个快捷方式，软链是指向本地的，并不会提交到git，这非常有利于我们的调试。
2024-07-01 11:20:51
551
原创 基于Vue3 + Typescript 封装 Element-Plus 组件
了解最新的 Vue3 及相关技术 & 优势具备经典组件的设计与开发，提升架构思维和代码设计能力。
2024-06-28 09:42:32
783
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人