- 博客(45)
- 收藏
- 关注
RSS订阅原创 js中隐式类型转换与toPrimitive
我们知道Js的隐式类型转换主要出现在有运算符的情况下【逻辑运算符、关系运算符、算术运算符】。那么在接触toPrimitive之前，我们需要先知道其他值到某个类型值的转换规则。
2023-10-18 16:00:01
328
原创 像素、视口、网页计量单位与移动端适配方案
设备独立像素（又称设备无关像素 Device Independent Pixels 、密度独立性 Density Independent或设备独立像素，简称DIP或DP）是一种物理测量单位，基于计算机控制的坐标系统和抽象像素（虚拟像素），由底层系统的程序使用，转换为物理像素的应用。一般移动设备的浏览器都默认设置了一个 viewport 元标签，定义一个虚拟的布局视口，以解决早期的页面在手机上显示的问题。PC端中，视口就是指浏览器的可视区域，宽度由浏览器的窗口的宽决定的，用户可以手动缩放窗口来改变视口大小。
2023-09-15 02:45:24
295
原创 解决Github打开后排版紊乱问题
然后就可以复制该资源的baseurl，打开https://www.ipaddress.com/，在输入框内搜索这个Baseurl，来获得它的ip地址。打开控制台查看输出的错误信息，应该会有某个资源因为跨域问题被拦截而没有加载成功。问题复现：可以打开github页面，但是排版紊乱。
2023-09-14 17:34:48
849
原创 js正则表达式连续调用多次test方法的问题
但是test的时候得不到预想的结果，控制台打印的时候也有意想不到的结果：我发现在s[l]完全没有变化的情况下，连续调用test方法得到的结果是不同的，eg.第一次结果为true，第二次再调用就为false。如果 lastIndex 大于字符串的长度，则 regexp.test 和 regexp.exec 将会匹配失败，然后 lastIndex 被设置为 0。如果 regexp.test 和 regexp.exec 匹配成功，lastIndex 会被设置为紧随最近一次成功匹配的下一个位置。
2023-09-01 15:35:46
202
原创 采用animate.css的多页面应用在ios设备回退页面时动画播放两次的解决方案
在实际真机测试时发现，在ios设备中，当用户点击浏览器回退/前进按钮时，或者location.href跳转到此前已经访问过的页面时，动画会重复播放两次。考虑到这次的问题和上次开发遇到的ios页面缓存问题很像，因此当即考虑是否是因为bfcache的缘故。在将点击【返回】按钮的a标签url中加上了时间戳参数后，页面正常显示，动画只播放了一次，因此可以确定为出现bug的原因就是bfcache。不同的浏览器在对当前窗口打开历史记录中的前一个页面的表现上并不统一，这和浏览器的实现以及页面本身的设置有关系。
2023-08-16 10:21:53
130
原创 input框禁止输入空格与macOS系统自带输入法兼容性问题
之后交付代码的时候，发现使用macOS自带的中文输入法输入的时候会有问题。具体表现为，连续打中文的时候，前面的文字会直接变成拼音，这是因为macOS自带的中文输入法是通过空格去分隔拼音，而在键入过程中去空格就会导致无法正常分隔。之前有一个需求是要求用户不能键入空格，于是我写了如下代码。
2023-08-16 09:30:44
169
原创 关于H5禁用window.open以及解决方法
又因为产品要求是统一打开新窗口，因此我在pc和移动端都直接使用了window.open()。我在js里写的逻辑就是拦截了a标签的默认行为，判断登陆状态和浏览器所处环境，根据条件进而跳转到不同的页面。之前做了一个需求，要求判断用户在点击职位列表的时候，判断用户是否登录，若未登录则直接跳转到登录页，登陆完成后自动跳转到对应的职位详情页；若已登录则直接跳转到相应职位详情页。
2023-08-15 14:49:34
584
原创 elementui form组件出现英文提示
经查看，代码采用的是elementui的form组件，在el-form-item中使用了required属性，同时又用rules自定义了表单验证规则。所以，把el-form-item中的required属性去掉，提示词用自定义验证规则中的message字段实现即可。今天让解决一个bug，是表单组件提示词会出现英文。有时会出现中文，有时会出现英文。
2023-08-15 13:00:43
1838
原创 解决ios设备浏览器页面回退但内容不刷新导致的问题
项目是一个php前后端不分离项目，分为移动端和pc端，但用的基本是一套代码，在每个页面中调用判断当前是否为移动端的函数去动态的加载pc或移动端所需的css、js和dom结构代码。：今天碰到的提测的一个bug是：设备在操作部分页面后点击浏览器后退按钮，会直接显示pc端的样式，需手动刷新页面才显示移动端样式，用户交互体验差。：经过排查后发现，只有ios设备在用浏览器浏览的时候会出现以上问题，用微信内置浏览器查看没有上述问题，安卓设备也没有上述问题。
2023-08-01 00:22:01
649
原创 电脑重启后VScode快捷方式失效，找不到Code.exe
下班回家关了部分程序就直接关机了，回家后重启电脑发现vscode的快捷方式就失效了，提示Code.exe已被移动或删除。
2023-07-29 18:09:47
2338
1
原创 Swiper横向循环焦点图实现与解析
另外，之所以要给每个轮播项slide自定义过渡效果，这是因为默认情况下，Swiper 的轮播项切换是通过 CSS 过渡属性实现的，它们没有指定过渡时间，因此切换是即时的。假如有6个slide，当活动的是第三个时swiper的progress属性是0.4，当活动的是第五个时swiper的progress属性是0.8。（为了方便查看效果，我在监听progress变化的函数中让它遍历slide时输出了当前的slide序列号及其对应的progress值，且我实际上插入dom结构的slide数量只有三个）
2023-07-27 22:49:51
1320
1
原创 wkhtmltopdf踩坑记录
看了配置参数可以设置page-zise或者page-width/page-height，我没有尝试，只是把整个container的大小设置成A4大小，a4转成px是794px*1123px，因此要设置成对应的大小。场景描述：我一开始用的命令行是直接将本地的html转pdf，然后就报了访问不到的错误，转出的pdf是没有本地html引入的图片的。，由于我们只是用了点技巧迫使它纵向排列，而不是书写顺序真的是从上到下，因此这些符号还是会横向显示。解决方法1： 加上配置参数，允许本地文件加载其他的本地文件。
2023-06-09 12:29:19
1910
1
原创 layUI关于table组件如何设置分页跳转后的页面锚点
今天接到的需求是让所有分页器分页跳转时，页面锚点定位到指定位置。项目是用layui写的前端，然后在看项目代码时发现，代码中的分页器有些是直接用table组件，设置page:true开启分页；对于后者的情况很简单，就是在jump配置项里去写回调函数的逻辑即可，但是前者就有点麻烦，这是因为虽然table的page配置项支持传入一些laypage组件的属性，但并不支持传入jump。但是这种方法太麻烦，代码量多的情况下涉及的改动也就特别多，加上前端很多页面都用到了带分页的table，这样要重新写的地方很多。
2023-06-07 22:08:09
645
原创 子元素设置高度百分比无效+如何让浮动子元素高度等于父元素高度
一开始我直接按照设计图用了浮动布局，左栏设置向左浮动，右栏用margin-left:左栏宽度+间距撑开两个盒子间的距离，两栏设置了宽高（其实不应该设置高度的，因为高度不定，后面会说。在外部盒子等待内部元素计算出高度时并不知道自己的高度，内部盒子高度相对外部盒子设置高度时也未知外部高度，所以按照自己的内容的情况渲染了，最终的效果就是内部盒子高度与外部无关。min-height表示盒子的最小高度，并不表示盒子的最终高度，站在外部盒子的角度理解是外部最终高度是由盒子的内部元素的高度与当前盒子的最小高度共同决定。
2023-06-01 17:09:56
404
原创 定参与不定参的函数柯里化实现
首先函数柯里化作为闭包的一种使用场景，指的是一种将使用多个参数的一个函数转换成一系列使用一个参数的函数的技术，其主要的目的在于避免频繁调用具有相同参数的函数，实现参数的复用。例如将fn(1,2,3)的形式变换成fn(1)(2)(3)。这里就不再赘述它的作用，下文将直接给出定参与不定参的两种实现方式，以及阐述它的实现过程。
2023-05-17 01:26:03
120
原创 Javascript继承的实现方式
如上代码，修改子类的原型对象是为了继承超类上的原型属性和方法，而实例属性和方法则可以直接通过在子类构造函数内部调用超类构造函数即可。但从控制台输出结果可以看到，子类的原型对象上也拥有超类的实例属性和方法，也就是说通过原型链的继承，导致重复继承超类的属性和方法。这种方式是相对最优的继承方式，利用Object.create方法解决了组合继承中导致子类原型对象上属性冗余的问题，而实际上为了继承超类的原型属性和方法，我们只需要超类的原型的一个副本即可。组合继承是前两种继承方式的结合，它解决了前两种继承方式的弊端。
2023-05-12 23:01:27
47
原创 Koa和Express有关洋葱模型对比及源码解析
express和koa都是基于nodejs的比较主流的两种web框架，express内置了很多中间件，而相对来说koa则更加轻量。但对于异步处理，express用的是回调函数，koa1采用generator+yield，koa2采用异步终极解决方案async/await；通常我们说的koa就是指Koa2。
2023-04-26 20:55:12
485
原创 [详细]vuepress-theme-hope搭建博客
市面上的博客框架有很多，鉴于vuepress是静态博客框架，可以部署到GitHub Pages而不用自己提供服务器，并且对前端也非常友好，因此我选择了vuepress，主题选用了vuepress-theme-hope。笔者运行自己的博客时感觉打开速度还是比较慢，之后可能会考虑增加CDN优化gh-pages的说明。
2023-04-25 21:48:23
1719
原创 Js（V8/Node）处理输入输出流+在vscode调试js编程题
昨晚第一次写带编程题的笔试，之前用c++刷题的时候也知道面试是acm模式，所以也有练；但后来用js刷题，由于刷牛客和力扣这两边都是核心代码模式，就以为js没有acm模式（什么逻辑啊——）。而且昨晚笔试只支持js，所以总之就是大惨败，只写得出核心代码模式的题目。这个链接可以专门去练习一下输入输出的处理。
2023-04-20 22:58:09
776
原创 vue+node项目打包优化并部署上线+nginx配置
最后npm run build打包得到dist文件夹，再在本地浏览器中打开index.html，如果页面正常显示则说明成功了。
2023-04-20 11:00:11
1491
1
原创 java选修结课作业：ssm项目-人事管理系统-经验记录
前端框架：Layui，jquery数据库：MySQL数据库连接池：c3p0J2EE：Tomcat, Servlet, JSP, Filter视图框架：Spring MVCORM框架：MyBatis日志：SLF4J 1.7、Log4j这是笔者（有一点javaSE的基础）第一次接触javaweb和三大框架，并在一周时间内粗略速通以上知识点并独立完成一个MVC+ORM框架的java项目。所以接下来记录的很多操作仅作为第一次经验的总结。05/22 新建springmvc项目并配置好相关xml文件、java项目部署到
2022-06-17 20:07:07
569
原创 贪心与动规test
一 货物搬运二 拉不拉部落俺の代码dp[i]表示从1到村庄i所需的最短时间。#include <iostream>#include <algorithm>#include <vector>using namespace std;int main(){ vector<int> dp(1010,1e8); int n,m; cin >> n >> m; dp[1] = .
2022-04-17 00:54:36
70
原创 LeetCode-二叉树遍历-94中序+144前序+145后序-(递归/迭代/Morris)
中序遍历：递归：class Solution {public: void midOrder(TreeNode* root,vector<int>&ans){ if(!root) return; midOrder(root->left,ans); ans.push_back(root->val); midOrder(root->right,ans); } vector<
2022-03-25 10:20:31
1306
原创 递归与分治test-涉及递归/分治/哈希/归并/离散化
一 金字塔题解：1.算出金字塔有多少行后，输出空格是：总行数-当前行；输出字符是：2*当前行-1我的代码↓ 缺点就是——这是分治test!!!!但是却没有分治的思想！！！QWQ#include <iostream>using namespace std;void pyramid(int i, char c){ for(int j = 1; j <= i; j++){ for(int k = 1; k <= i-j; k++)
2022-03-21 08:41:54
145
原创 洛谷-P1226-【模板】快速幂||取余运算-普及-分治
一 题目二 示例及提示三 题解快速幂算法的核心思想就是每一步都把指数分成两半，而相应的底数做平方运算。这样不仅能把非常大的指数给不断变小，所需要执行的循环次数也变小，而最后表示的结果却一直不会变。例如：此外， 关于取余运算的性质有：(A + B) mod b=(A mod b + B mod b) mod b(A × B) mod b=((A mod b)×(B mod b)) mod b代码：#include <iostream>usi
2022-03-18 09:03:44
668
原创 洛谷-P3612-Secret Cow Code S-普及- -分治
一 题目二 示例及提示三 题解一开始卡了很久，后来想明白的时候觉得自己思路都对，结果还是有超时和WA，我狠狠震惊。纠结了很久最后发现竟然是在在一些很基本的地方犯蠢了。先po一下自己的代码，这是已经AC的：#include <iostream>#include <vector>using namespace std;int main(){ string s; long long N; cin >>...
2022-03-17 14:31:33
930
原创 洛谷-P1885-Moo-普及--分治
一 题目二 示例及提示三 题解思路：代码：#include <iostream>#include <vector>using namespace std;void partition(vector<int>f, int N, int k){ if(k==0 || (f[k-1]<N && N<=f[k-1]+k+3)){ if(N==1 || N==f[k-1]+1){ .
2022-03-17 09:58:59
779
原创 洛谷-P1228-地毯填补问题-普及/提高--分治+递归
一 题目二 示例及提示三 题解思路：当k=1时，我们可以非常容易得到毯子填补的方案。当k=2甚至更大时，我们可以将其划分为四大块，但是公主位只有一个，而对于其他没有公主位的四方格，似乎和原问题形式不一样。但是我们可以对其加以处理，使其四个子问题都具有相同形式——即，我们可以手动为其他三个没有公主位的四方格增加新的“公主位”。例如，当公主位在左上角时，我们可以将剩余三个四方格的交界处用毯子1来补上，这样每个四方格都会被分配到一个公主位，称为特殊的方阵，问题便迎刃而解。因此我们就可以
2022-03-16 16:11:48
1337
原创 洛谷-P1024-一元三次方程求解-普及-暴力/盛金公式/分治
一 题目与示例二 题解1.暴力求解骗分法:D#include <iostream>#include <cmath>#include <iomanip> using namespace std;int main(){ double a,b,c,d; int cnt = 0; cin >> a >> b >> c >> d; for(double i = -100;
2022-03-15 23:55:31
972
原创 洛谷-P1010-幂次方-普及(摁写+递归/二进制+递归）
一 题目描述二 示例及提示输入格式一行一个正整数 n。输出格式符合约定的 n的 0,2 表示（在表示中不能有空格）。输入输出样例输入 #11315输出 #12(2(2+2(0))+2)+2(2(2+2(0)))+2(2(2)+2(0))+2+2(0)三 题解1.直接按题意递归处理思路：代码：#include <iostream>#include <cmath>using namespace std.
2022-03-15 16:11:02
1718
原创 LeetCode-169-多数元素-简单(排序/摩尔投票法/哈希表/随机数/位运算）
一 题目给定一个大小为 n 的数组，找到其中的多数元素。多数元素是指在数组中出现次数 大于 ⌊ n/2 ⌋ 的元素。你可以假设数组是非空的，并且给定的数组总是存在多数元素。二 示例及提示示例 1：输入：[3,2,3]输出：3示例 2：输入：[2,2,1,1,1,2,2]输出：2进阶： 尝试设计时间复杂度为 O(n)、空间复杂度为 O(1) 的算法解决此问题。三 题解1 排序思路：既然要过半就说明数组排序后，位于最中间的数一定是符合要求的数。很直接...
2022-03-14 11:58:25
7855
原创 LeetCode-347-前k个高频元素-中等(红黑树/堆/快排)
一 题目给你一个整数数组 nums 和一个整数 k ，请你返回其中出现频率前 k 高的元素。你可以按 任意顺序 返回答案。二 前言像这种topK问题（前k小/前k大/第k大/第k小）的题解都是套路，基本就是堆排序O(nlogk)、快速选择O(n)【最快】、二叉搜索树O(nlogk)。本题只是在这基础上的变形而已，要处理值和频率对应的问题，所以考虑以哈希表为底层的unordered_map来处理，然后在后面排序的过程中需要注意数据结构的变化。三 题解1.两个红黑树反着赋值。思路：考虑到
2022-03-11 23:23:43
1241
原创 LeetCode-654-最大二叉树-中等(递归/单调栈）
一 题目给定一个不重复的整数数组 nums 。 最大二叉树 可以用下面的算法从 nums 递归地构建: 创建一个根节点，其值为 nums 中的最大值。 递归地在最大值 左边 的 子数组前缀上 构建左子树。 递归地在最大值 右边 的 子数组后缀上 构建右子树。返回 nums 构建的 最大二叉树 。二 示例及提示示例 1：输入：nums = [3,2,1,6,0,5]输出：[6,3,5,null,2,0,null,null,1]解释：递归调用如下所示：-...
2022-03-10 15:40:52
1011
原创 LeetCode-1-Two Sum-简单-暴力/哈希
暴力写法自己写的↓： 也可以直接return {i,j};class Solution {public: vector<int> twoSum(vector<int>& nums, int target) { vector<int>ans; for(int i = 0; i < nums.size(); i++){ for(int j = i+1; j < nums.size();
2022-03-10 10:07:06
361
原创 算法设计与分析-分治实验-第四题
大概是整个实验里最简单的题了:(题目描述从前，有一对感情破裂的兄弟。为了拯救他们之间的感情，兄弟两人每个人都准备了一些对于他们来说可以拯救他们之间感情的数字，这些数字可以拯救他们的感情吗？(若在两个列表中的分别存在一个数，它们的和为10000，则我们认为这些数字可以拯救他们之间的感情)。你的程序应该决定，是否有可能从两个整数列表选择这样两个数字，来拯救他们的感情。输入每堆数（共2堆）的输入格式如下：每堆数的第一行，包含一个整数N ( 1 <= N <= 50,000 )，表示当前
2022-03-09 21:29:10
1279
原创 算法设计与分析-分治实验-第二题
题目循环赛日程表的设计：设计一个满足以下要求的比赛日程表（n=2k）：(1)每个选手必须与其他n-1个选手各赛一次；(2)每个选手一天只能赛一次；(3)循环赛一共进行n-1天。要求：输入选手的数量，需要有效性检查，满足n=2k条件，以矩阵形式输出循环赛日程表。输出： 1 2 3 4 5 6 7 8
2022-03-09 17:34:07
526
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人