- 博客(53)
- 收藏
- 关注
RSS订阅原创 用React实现百度搜索框（简易版）
1. DOM结构如下2. state里面需要存储的数据：3. 函数处理4. 细节处理：控制列表的可见性如果说输入框没有值就不可见在CSS中设置display
2021-09-07 21:49:53
929
原创 力扣股票问题大合集
因为最近笔试做了一道股票问题，之前其实做过，但是笔试的时候还是想了很久。所以决定来总结一下这类股票问题。level 1剑指offer 63.股票的最大利润特点：只买卖一次，求最大利润。思路：遍历数组的每一位，找到下标为 i 的元素之前最小的元素。比较是当前卖出更高，还是不卖更高。var maxProfit = function(prices) { if(prices.length < 2) return 0; let min = prices[0]; const d
2021-08-24 19:42:34
252
1
原创 树莓派安装Ubuntu20.04.2并配置node.js,mysql
安装UbuntuStep 1: 下载两个软件及Ubuntu Server的镜像文件SDCardFormatterv5win32diskimagerUbuntu Server 20.04.2 LTS for raspberry pi Step 2: 使用SDCardFormatterv5 格式化SD卡Step 3: 使用win32diskimager把操作系统烧录到SD卡上。烧录完成后，将SD卡安装到树莓派上即可启动。注意映像文件应该是压缩后的文件，以.img结尾的配置nodejsS
2021-07-28 09:28:58
367
原创 小白式部署前端页面
1. 安装Nginx为什么要安装Nginx?解决跨域问题。那什么又是跨域？跨域的起源是浏览器同源策略的限制。浏览器为了安全，会限制不同源（两个协议名，域名，端口号都相同的url才是同源）之间的DOM，数据，网络操作。Nginx是怎么解决跨域问题的？Nginx相当于一个跳板机，客户端的域名也是Nginx的域名。所以客户端首先访问Nginx服务器，然后Nginx又把请求转发给服务器。当响应返回的时候又返回给客户端。那我们就开始安装吧！等等…先安装依赖1.1 安装gcc g++的依赖库su
2021-07-24 15:56:17
1596
3
原创 微信小程序自定义返回页面遇到的问题
需求：TabBar中点击发起比赛跳转到一个空页面，根据用户状态，通过路由跳转到不同的页面，问题在于返回的时候。需要返回用户点击发起比赛之前的TabBar页面。问题：一、无法获取用户点击发起比赛之前的界面原因：TabBar页面之间切换的时候，旧的TanBar页面会出栈，新的TabBar页面会入栈。所以无法获取上一个TabBar页面。验证：分别在两个TabBar页面，首页Index，发起比赛createMatch，以及根据状态跳转的填写比赛的fillMatchInfo的界面通过getCurrentP
2021-07-08 19:22:53
1346
原创 CSS居中总结
分行内元素和块级元素讨论<div class="container"> <div class="box1">1</div> <span class="box2">2</span></div>水平居中对于行内元素：text-align: center.container { text-align: center;}对于块级元素：margin: auto;.box1 { width:
2021-06-27 21:23:36
80
1
原创 前端模块化总结
前言以模块化的方式来开发可以提高代码复用率，并且可以更好地拆分组件，降低耦合度，提高可维护性。目前流行的js模块化规范有CommonJS、AMD、CMD以及ES6的模块系统。模块化规范1. CommonJS模块的加载：用同步的形式加载文件。对于服务器端，模块文件都在本地磁盘，所以读取非常快，比较适合。对于浏览器端，要从服务器加载模块，但是限于网络原因，更适合异步的形式。module.exports = value //暴露模块exports.xxx = value //暴露模块requ
2021-06-15 22:19:04
86
原创 map遍历数组时正确使用 async 与 await
问题背景在处理数据的时候，经常需要拿到一个iXXXd再去XXX表里面查询，但是查询是异步操作。返回的数据中，newMatchInfo一直是空的let newMatchInfo = matchInfo.map(async item => { item.competionName = await acceptableMatchModel.query(`select competitionName from tb_competition where competitionId = '${it
2021-06-03 21:30:55
3046
2
原创 Taro3.2.8 + dva 搭建配置过程
创建项目的步骤我就不赘述了，官网有详细的步骤Taro使用文档提前下载微信开发者工具前提初始化好了一个Taro项目步骤1. 编译运行npm run dev:weapp在模拟器中预览2. 配置dva2.1 安装 react-reduxnpm i --save react-redux2.2 安装 dva-core dva-loadingdva-core 封装了redux和redux-sage的一个插件dva-loading 管理页面的loading状态npm insta
2021-05-22 21:31:55
371
2
原创 JS深浅拷贝
浅拷贝只能拷贝一层对象常用的浅拷贝方法：1. concat数组const arr = [1,2,3];let newArr = arr.concat();newArr[0] = 5;console.log(arr);console.log(newArr);2.slice数组const arr = [1,2,3];let newArr = arr.slice();newArr[0] = 5;console.log(arr);console.log(newArr);3.
2021-05-19 16:11:55
67
原创 Javascript多叉树的递归遍历
背景遍历树形结构的菜单，实现子菜单的添加与删除。要实现的功能：添加子菜单获取到的数据有：整个菜单树形结构的数据以及目前选中的父菜单的key。逻辑：遍历这棵多叉树，找到父结点，拼接好子结点的信息，再push到父结点的children中。删除子菜单获取到的数据有：整个菜单树形结构的数据以及目前选中的菜单的key。逻辑：遍历这棵多叉树，找到选中菜单的父结点，再遍历父结点的子结点找到选中的结点，利用splice删除选中结点。实现方法这两种功能都需要遍历多叉树。这就涉及到大家不愿去触
2021-05-13 20:11:48
585
原创 Github创建仓库并上传本地代码
每次都要忘记…所以做个笔记 git init git add . git commit -m "first commit"git remote add origin （添加远程仓库路径） git push -u origin master 如果遇到反复让你输入账号密码，就升级一下 git update-git-for-windows...
2021-03-31 16:50:54
136
原创 React中子组件什么时候会触发render
问题的起因是我写一个demo的时候，子组件中没有使用this.setState,父组件传给子组件的props也没有变，但是我的子组件还是render了。（除了挂载阶段的render）让我百思不得其解，于是重新回去梳理了一下React的生命周期，究竟什么可以引发我子组件的render？子组件的更新分为两种情况第一种: 父组件render，导致重传props如果我们在子组件中是直接使用this.props.xxx 那么可以在shouldcomponentUpdata判断props是否变化如果我们是将父
2021-03-30 21:28:24
1036
原创 Failed to connect to github.com port 443: Timed out
在git push 的时候报错Failed to connect to github.com port 443: Timed out解决办法：git config --global --unset http.proxy
2021-03-25 10:42:04
513
原创 从输入URL到页面展示中间发生了什么
其实这就是前端面试最常见的一道题，从输入URL到页面展示，这中间发生了什么？在开始之前，我们先了解一下HTTP请求流程，下面是一个大体的流程：构建请求构建请求行信息查找缓存如果有请求的资源则拦截请求，返回资源，如果没有则继续请求。准备IP地址和端口号在网络请求之前，我们要建立TCP连接。因为HTTP其实就是把请求的文本信息封装起来，依靠TCP/IP传输。建立TCP连接之前还需要IP地址和端口号。那这些又怎么来呢，就需要DNS域名解析。通常DNS域名解析也会被浏览器缓存。等待TCP队列当
2021-03-14 16:35:29
162
原创 LeetCode两数之和JS
一般思路是双层循环，但是这样时间复杂度太高了，所以我们一般都要反思可不可以改成一层循环。用空间换时间，采用Map。而且一般求和问题我们都转化为求差问题。所以我们遍历数组，把值当做key，把索引当做value，每次比较看target - nums[i]是否已经存在，存在则返回答案var twoSum = function(nums, target) {const map = new Map(); const len = nums.length; for (let i = 0; i &l.
2021-01-11 14:55:44
115
原创 项目总结
这次项目是一个H5移动端开发。做一个本地的公交卡充值APP。采用的是MUI框架。对于这次遇到的问题我想从几个方面做一个总结。规范方面：1.文件夹里面不要有中文不要有中文！因为当时下载切图的时候没有注意，有一个图片的命名有中文字符，我在用Hbuider真机调试的时候界面一直运行不出来。2.对于重复利用的代码写成一个函数。提高可用性。3.全局变量用g开头写在前面，局部变量用_开头4.写在mui.plusready()里面的东西需要真机调试才能起作用，浏览器不行。html :1.问题：我有页面A，
2021-01-09 15:04:14
79
1
原创 XAMPP中Error: Apache shutdown unexpectedly.
解决方法：修改端口号步骤1点击config 修改里面的httpd.conf默认是80，可以修改成81步骤2：修改httpd-ssl.conf里面的端口号默认是443，可以自定义修改。然后再重新start Apache就好啦！
2020-12-13 21:16:38
195
原创 Error:Cannot find module XXX 解决方法
一般这种情况都是node_modules出了问题把node_modules文件夹删掉npm clean cache然后重新下载npm install然后就好啦
2020-12-06 20:22:22
58386
11
原创 关于splice和slice
在写归并排序的时候用到了splice方法截取数组，但是一直得不到想要的效果。数据老是不全，后来才知道是因为我用的splice方法会修改原数组，所以我的原始数据就越截越少==那用什么呢？还有一个slice方法。它也可以截取数组，还可以截取字符串，值得注意的是，这个方法不会改变原数组和原字符串。这让我想起了在JS中字符串作为基本数据类型是存储在栈内存中的，栈内存存储的值大小固定，所以基本数据类型都具有不可变性，这些方法都不能改变原来的值。而是返回一个新的值。所以同理splice不可以操作字符串，会报错，因
2020-11-20 16:00:17
128
原创 JS中函数参数的传递
在探究函数参数传递之前，我们需要了解一下JS中的数据类型与内存。JS中分为基本数据类型和引用数据类型。对于基本数据类型，他们的变量名和值是直接存在栈空间中国的。而对于引用数据类型，他们的值存在堆空间，栈空间存变量名，和指向堆空间内存的地址。红宝书中有一句话，JS函数都是按值传参的。对于基本数据类型，很好理解。对于引用类型，我开始一直没绕出来，直到把这么数据类型的存储方式给结合起来之后，才体会到。这里有一个例子： let obj = {}; function changeValue(
2020-10-10 10:29:44
725
原创 判断this绑定对象的方法
this的指向问题是JS中比较经典的问题，也很重要。在看了《你不知道的JavaScript》之后，想来总结一下。关于this先要知道几个点this指向是在函数调用时才绑定它的上下文取决于函数调用时的各种条件this的指向取决于函数的调用方式通过函数的调用位置找到对应的绑定规则，确定this的指向（箭头函数单独说）四条绑定规则默认绑定主要像一些独立函数的调用。非严格模式指向全局对象，严格模式指向undefined隐式绑定当函数引用有上下文对象时，隐式绑定规则会把函数调用中的this绑
2020-10-07 16:14:15
234
原创 JS中的变量提升背后的机制
当我执行下面的代码时，你觉得会打印什么？ <script> a = 2; console.log(a); var a; </script>刚开始很多人会觉得是undefined，因为a的声明是在赋值之后，但实际上打印的是2。之前只知道这是JS的变量提升，但是不知道背后的机制。我们习惯将var a = 2;看作是一个声明，但是JS引擎其实并不是这样认为。JS引擎把它看作是两个声明。var a 定义声明 ，a =
2020-10-06 21:44:33
129
原创 使用节流函数实现图片懒加载
在开始之前，我们有必要知道什么是图片懒加载，什么又是节流函数？图片懒加载当我们访问一个图片很多的页面的时候，如果一次性加载完所有的图片，那响应速度可想而知。用户体验非常不好。并且一次性向服务器发送大量请求，可能会导致页面卡顿崩溃等。所以我们需要“懒”一点。怎么懒呢？就是监听页面滚动事件，根据页面滚动，我们再加载图片。主要思路如下：img标签的src属性指向一同一张小图片或者空白设置一个新的属性new-src指向真正的图片路径载入页面时将可视区的图片的src换成new-src监听滚动事件/
2020-09-24 16:31:01
253
原创 js中的事件委托
要想了解事件委托，就要先了解事件冒泡。那么事件冒泡是什么？事件冒泡是指JS中当触发某些具有冒泡性质的事件时，首先在触发元素寻找是否有相应的注册事件，如果没有再继续向上级父元素寻找是否有相应的注册事件作出相应，这就是事件冒泡那事件委托是什么？事件委托利用事件冒泡，给父节点设置事件监听，然后点击子节点，通过冒泡原理冒泡到父节点，父节点上又绑定了事件，所以事件就被触发了好处是什么？减少DOM操作，提高页面的整体运行性能例子：我们先通过文字来理解。假如说一个公司有10个人（相当于
2020-08-02 23:10:39
67
原创 用innerHTML修改input标签的文本信息无效
Input标签是单标签，没有结束符，它所显示的文本信息放在value里面，如果我们直接改input标签的innerHTML/innerText就没有效果。所以我们通过修改value值来修改显示的文本信息
2020-07-21 17:01:12
892
原创 demo2-CSS日历模仿
这是模仿视频做的一个CSS日历，先上效果图整体思路是：一个大盒子分为左右两个子盒子，他们的display属性都设置为inline-block，但是因为设置为inline-block后两个盒子之间会有空隙，这里有个巧法就是把他们的父盒子的font-size设为0。HTML部分：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="vie
2020-07-13 16:45:19
167
原创 LeetCode实现 strStr()JavaScript
解法一：双重循环，当第一位匹配时，利用循环检查后面是否匹配。这种解法速度的确很慢…var strStr = function(haystack, needle) { var arr1 = haystack.split(''); var arr2 = needle.split(''); if(arr2.length==0) return 0; for(var i=0;i<arr1.length;i++) { if.
2020-07-12 17:56:00
86
原创 LeetCode字符串转化整数(atoi)JavaScript
根据题意，主要要求如下：忽略开头的空格判断符号忽略整数后的字符注意范围其他情况返回0使用parseInt方法，可以满足前三个要求，剩下的要求就分情况讨论就可以了var myAtoi = function (str) { var numb = parseInt(str, 10); if (isNaN(numb)) { return 0; } else if (numb < Math.pow(-2, 31) || numb > ...
2020-07-09 18:26:44
118
原创 LeetCode整数反转JavaScript
解题思路：首先注意X本来就是一位数的特殊情况，这种情况就返回它本身。然后把整数转换成数组后反转，然后分正数和负数讨论，最后还要注意一个数值范围。var reverse = function(x) { if(x>=0&&x<=9) { return x; } var arr = x.toString().split('').reverse(); if(arr[arr.length-1]==='-').
2020-07-07 16:41:13
212
原创 HTML简单计算器实现
这款计算器的主要功能有加减乘除，平方开方，清零，回退，连续加减乘除等功能。成品图如下：功能模块图如下：整体用一个table标签创建一个五行六列的表格，这里上HTML代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1
2020-07-02 10:19:02
4482
原创 LeetCode移动零JavaScript
思路：从后往前循环（因为从前往后循环当我使用splice方法时会改变原数组前面的下标，会对接下来的操作有影响），如果有元素为0，通过splice()方法和push方法（）删除元素，并在末尾添加0var moveZeroes = function(nums) { for(let i=nums.length-1;i>=0;i--) { if(nums[i]==0) { .
2020-06-28 16:28:11
134
原创 LeetCode加一JavaScript实现
解题思路：加一有两种情况，第一种情况是数组的最后一个元素不是9，那么就直接给最后一个元素加1，第二种情况是最后一个元素是9，则将当前位置的数字置0，再检查倒数第二个元素…以此类推。当所有元素都置0后，检查第一个元素是不是0，如果是，通过数组的unshift()方法，给数组添加一个数值为1的首元素。var plusOne = function(digits) { var i; for(i=digits.length-1;i>=0;i--) { .
2020-06-28 15:49:06
608
原创 LeetCode只出现一次的数字JavaScript
解法一：由于受到“存在重复元素”的启发，我的解题思路就是先对数组排序，再通过第i个数与它的前一个数以及后一个数是否相等来判断。var singleNumber = function(nums) { nums.sort(); for(let i=0;i<nums.length;i++) { if((nums[i-1]!=nums[i])&&(nums[i]!=nums[i+1])) return .
2020-06-28 01:03:44
145
原创 LeetCode存在重复元素JavaScript
解题思路：先排序再比较相邻两个数是否相等。sort() 方法用于对数组的元素进行排序。var containsDuplicate = function(nums) { nums.sort();//数组排序 for(let i=1;i<nums.length;i++) { if(nums[i]===nums[i-1]) { return true; .
2020-06-28 00:41:10
94
原创 LeetCode旋转数组C语言和JS解法
解决思路：先逆置前半段，再逆置后半段，最后整个逆置void rotate(int* nums, int numsSize, int k){ int i = 0; int tmp = 0; int j = 0; k %= numsSize;//只需要旋转小于numsSize的长度 for (i = 0, j = numsSize - 1 - k; i<j; i++, j--)//对前半部分逆置 { tmp = nums[i]; nums[i] = nums[j]; .
2020-06-26 00:13:29
184
原创 LeetCode买卖股票的最佳时机 II JavaScript
解题思路：从第一天开始买入，只要有收益就可以直接卖出，接下来再买入，同样一旦有收益就可以卖出，这是一种典型的贪心思想，局部最优达到全局最优。下面上代码：var maxProfit = function(prices) { var i,profit=0; for(i=1;i<prices.length;i++) { if(prices[i]>prices[i-1]) { .
2020-06-25 11:40:52
76
原创 LeetCode删除排序数组中的重复项JavaScript
用C语言解决这个问题，因为不能使用额外的数组空间，所以只能在原有的数组中通过数组下标来进行赋值操作int removeDuplicates(int* nums, int numsSize){ int i,s=0; if(numsSize<2) return numsSize; else { for(i=1;i<numsSize;i++) { if(nums[s]!=nums[i]) .
2020-06-22 14:44:43
121
原创 简单动画函数的封装 -逐步优化
封装好一个简单的动画函数后就可以直接调用，非常方便，在制作轮播图中也会应用。实现原理通过定时器不断的移动盒子位置具体步骤获取元素当前位置，用offsetLeft让盒子在当前位置移动一个距离用定时器不断重复这个操作加一个结束定时器的条件注意此元素需要添加定位才可以使用element.style.left一个简单的动画函数封装 //简单动画函数封装obj目标对象 target目标位置 function animate(obj, target) {
2020-06-03 16:33:24
217
原创 JavaScript中的函数传参问题
访问变量的时候可以按值和按引用，而ECMAScript中的所有函数的参数只能按值传递。当向参数传递基本类型的值时function addTen(num){ num += 10; return num;}var number = 20;var result = addTen(number);alert(number);//20alert(result);//30被传递的number的值会被复制给函数的局部变量num，函数内部num + 10,但是这一变化并不会影响函数外部的numbe
2020-05-26 09:58:42
230
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人