- 博客(47)
- 收藏
- 关注
RSS订阅原创 ReactHooks(完结)
我们希望如果 flag 没有发生变化，则避免 tips 函数的重新计算，从而优化性能。当父组件被重新渲染的时候，也会触发子组件的重新渲染，这样就多出了无意义的性能开销。使用 React.memo() 可以将组件进行缓存。如果点击 +1 按钮，发现count自增，flag值没有发生变化，但是tips函数也会重新执行。useDeferredValue 的返回值为一个延迟版的状态。
2024-07-30 22:18:48
989
3
原创 基于Java+SpringBoot+LayUI仓库管理系统
本项目是使用Java+SpringBoot开发，可以实现仓库的注册、登录，登录后可进入系统，进行客户管理、供应商管理、商品管理、商品退货查询管理、登录日志及退出等几大模块。系统界面采用传统的后台管理界面，界面简单、直观。
2023-11-07 20:44:39
524
原创 进程、程序、线程之间的异同
进程、程序、线程之间的异同一.进程1.1定义1.2三种状态1.3特征二.程序2.1定义进程与程序的区别三.线程3.1定义进程与线程的区别进程、线程与程序之间的关系搞得晕头转向啊。。。一.进程1.1定义在内存中运行的程序，每个进程都存在一块自己独立的空间，一个进程可以有多个线程。进程是能够独立运行并作为资源分配的基本单位，它是由一组机器指令、数据和堆栈等组成的，是一个独立运行的活动实体。进程是程序的一次执行过程，或是正在运行的程序。1.2三种状态就绪状态执行状态等待状态（阻塞状态）
2021-09-17 15:17:34
1298
原创 垃圾回收与内存泄漏
垃圾回收机制与内存泄漏一.垃圾回收1.1方法1.1.1标记清除1.1.2引用计数二.内存泄漏2.1定义2.2分类2.2.1 Vue中的内存泄漏2.2.2 JS中的内存泄漏一.垃圾回收清早起来先给小粉来一波福利~垃圾回收机制浏览器的JavaScript具有自动垃圾回收机制，执行环境会负责管理代码执行过程中使用的内存；原理：垃圾收集器会定期（周期性）找出那些不在继续使用的变量，释放其内存。但是这个过程不是实时的，因为其开销比较大并且GC时停止响应其他操作，所以垃圾回收器会按照固定的时间间隔周期性的执
2021-09-17 10:50:47
271
原创 React(五)
被nvm折磨的两天，戳这里体验博主的心路历程现在终于解决了，快让我记录一下，今日分心情。3）．context 状态树传参 在平时使用react的过程中，数据都是自顶而下的传递方式，例如，如果在顶层组件（如：App）的state存储了theme主题相关的数据作为整个App的主题管理。那么在不借助任何第三方的状态管理框架的情况下，想要在子组件里获取theme数据，就必须的一层层传递下去，即使两者之间的组件根本不需要该数据。 Context 旨在共享一个组件树，可被视为 “
2021-09-16 17:48:57
120
原创 React(四)
快来领取今日份精神食粮刚信心满满开始准备写代码时，却是满屏的爆红整的我一下午的心情都不好了脚手架搭建出错卸载yarn之后，又出现node版本低~node升级后，npm又出现bug一.性能优化 react组件更新的时机：只要setState()被调用了，就会引起组件更新。不论数据改前改后是否一样，或者修改的数据是否在页面上呈现，都会进行更新组件。 但是vue中，数据必须在模板使用，并且数据发生变化才能引起组件的重新渲染。所以，在React里，如果要做
2021-09-03 14:18:55
251
原创 React(三)
React一.受控元素(组件)1.1双向绑定1.2 处理多个输入元素（双向绑定的封装）二. 非受控元素(组件)2.1默认值2.2可选案例：增删改查三.生命周期及其钩子函数3 .1 初始化阶段 （挂载）:3.2运行中阶段（更新）3.2 销毁阶段（卸载）一.受控元素(组件)一个标签（组件）受react中控制，受数据，受函数，等等（其实，就是一个标签（组件）里用了react里的东西）表单的value受控，受数据控制，<input type="text" value={this.state.数据名}
2021-09-01 20:32:03
96
原创 React入门(二)
♥React一.无状态组件二.有状态组件三. 事件处理3.1事件特点：3.2 事件语法3.2.1格式3.2.2事件处理函数里的this3.2.3事件对象3.2.4阻止浏览器的默认行为：四.组件的内容 ：children五.refs5.1获取DOM5.2用法上期戳这里~一.无状态组件 顾名思义就是组件内部没有（不需要）state，无状态组件也可以理解为展示组件，仅做展示用，可以根据外部传来的props来渲染模板的内容，内部没有数据。 //无状态组件：组件内部没有state，可以使用函数式组件
2021-08-31 17:21:31
279
原创 React入门(一)
React一.React简介1.1介绍1.2特点1.3框架对比二.环境搭建2.1引入文件的方式2.2官方脚手架（模块化）三.HelloWorld四.JSX4.1介绍4.2特点4.3语法4.1.1元素类型4.1.2元素属性4.1.3JavaScript表达式五.条件渲染六.列表渲染七.组件7.1单个组件7.2组件嵌套八.Props8.1外部传值：8.2组件内部使用8.3默认值8.4类型检查：九.state状态机9.1定义并赋初始值9.2读取状态9.3修改状态一.React简介1.1介绍1.React是一
2021-08-30 20:21:29
784
2
原创 WebSocket
WebSocket聊天室一.Socket1.1应用1.2介绍1.2.1socket的通讯流程1.2.2示例二.webSocket2.1webSocket对象介绍2.1.1 属性2.1.2事件2.1.3方法2.2使用步骤:三.socket.io3.1介绍：3.2思路：3.3步骤：一.Socketsocket在哪里呢？1.1应用 Web领域的实时推送技术，也被称作Realtime技术。这种技术要达到的目的是用户不用刷新浏览器就可以获得实时更新。它有着广泛的应用场景。eg：WebIM
2021-08-28 11:46:21
1808
原创 揭开原型的面纱
原型一.原型1.1定义1.2 new关键字执行过程1.3名词解释一.原型1.1定义任何对象都有一个原型对象，这个原型对象由对象的内置属性__proto__指向它的构造函数的prototyoe指向的对象，即任何对象都是由一个构造函数创建的，被创建的对象都可以获得构造函数的prototype属性，这个构造函数就是原型。 var str = new String("a"); console.log("str", str);好奇的宝宝有么有发现这个小箭头，是不是想动手点击一下呢？这个小
2021-08-28 09:50:56
484
3
原创 NodeJS（二）
NodeJs扩展一.bcrypt模块1.1介绍：1.2安装：1.3加密代码：二. 身份验证2.1session（会话）2.1.1思想2.1.2业务场景：2.1.3express-session2.2token2.2.1思想2.2.2实现2.2.3生成签名（token）2.2.4校验token2.2.5token删除三.session vs token四.如何保存信息给浏览器（cookie）1、前端保存：2、后端操作cookie:2.1、添加cookie2.2、删除cookie2.3、获取cookie五.文件
2021-08-26 19:10:53
709
原创 Mongodb
分享一下昨天晚上找bug的心路历程数据库已经连接成功，并且数据可以打印出来，为何数据库中查不到呢？为什么会多出一个集合呢？很是懊恼呀！据说MongoDB数据库的集合要以数字/s结尾，我的就是s结尾呀~最终解决方案：在引用的地方，第三个参数进行复用集合名称，问题就可以解决啦折腾了一个晚自习，终于解决啦~小编也可以睡个美美的觉咯...
2021-08-26 16:27:22
140
原创 项目架构
项目架构一.MVC二.web开发中的架构：1.耦合架构2.半分离架构3.分离架构三.restful规范1.概念：2.优点：3.规范一.MVC项目架构，项目分层，不同的层的职责不同。M：model，模型（只是数据处理）业务逻辑处理，更多体现的是数据库的增删改查V：view：视图（显示）views文件夹下的文件。完成显示的格式。使用ejs模板，jade模板C：controller，控制器。（控制的就是某个功能的业务流程）routers文件夹下的文件。根据业务流程，调用不同的模块完成对应的功能。
2021-08-25 19:24:17
4076
原创 NodeJs(一）
目录一.服务器1.定义：2.web服务端保存的资源3.web服务器（软件）的作用二.nodeJS1.定义：2.目标：3.优势：4.劣势：5.特点：三.环境安装1.官网：2.测试环境：3.运行：四.web服务器的开发（一）搭建服务器（http模块）2.步骤（二）静态资源托管（fs模块）1.fs：2.fs模块(path模块）3.path模块3.2.1磁盘路径解析parse3.2.2片段合并join3....
2021-08-24 21:04:16
560
原创 状态(数据)管理vuex
每个组件内部的数据存放在data中，供组件内部使用。如果，vue组件之间数据共享怎么办？即A组件使用B组件里的数据？传统的处理方案：父子组件传值、平行（兄弟）组件跳转、利用url、路由传值等。以上这些方式存在很多缺点：数据传递复杂，容易出错； 浪费内存一.作用能够保存全局数据，供整个应用使用； 保存的数据是响应式的； 保存的数据可以跟踪状态的变化。二.核心对象（vueX.store）核心对象中的配置项：state：数据仓库，存储所有的共享数据，...
2021-08-17 19:35:30
129
原创 动态路由
一个早上被组件与页面组件之间跳晕了，快让我写篇blog静静，屡屡思路。目录一.路由传参二.路由传参和props三.捕获所有路由/404 Not Found路由四.命名路由五.重定向（redirect）六.嵌套路由七.路由模式八.路由守卫九.组件内部守卫一.路由传参1.路由配置const router = new VueRouter({ routes: [ // 动态路径参数 以冒号开头，相当于在path里声明了一个变量 id...
2021-08-13 16:31:06
1342
原创 路由和第三方UI组件
目录一.路由二.第三方UI组件一.路由1.作用： 实现SPA（单页面）应用中的组件跳转，相当于页面中啊标签。2.基本使用非模块化开发①引入vue-router.js文件<script src="js/vue.js"></script><script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>②定义若干个组件（为了跳转用）let..
2021-08-12 20:13:13
199
原创 对象的深拷贝和浅拷贝
目录一.浅拷贝二.深拷贝一.浅拷贝1.定义： 只拷贝了对象（引用类型）的地址。 var obj = { name: "张三疯", sex: "男" } var obj2 = obj; obj2.sex = "女"; console.log("obj", obj); console.log("obj2", obj2);二.深拷贝1.定义将对象（引用类型 ）数据...
2021-08-11 20:30:19
178
原创 vue模拟数据，数据交互
一.定义mock serve工具，通俗来说，就是模拟服务端接口数据，一般用在前后端分离后，前端人员可以依赖API开发，在本地搭建一个JSON服务，自己产生测试数据。即json-server就是个存储json数据的serve。注：json-server支持CORS和JSONP跨域请求。二.json-server使用步骤：初始化项目：npm init -y 安装json-server npm i json-server -D 打开...
2021-08-11 17:48:10
1018
原创 虚拟DOM,diff算法
一.虚拟DOM（virtual DOM）1.定义 也是我们常说的虚拟节点，它是通过JS的Object对象模拟DOM的节点，然后通过特定的render（渲染）方法，将其渲染成真实的DOM节点。2.为什么使用虚拟DOM？ 使用js操作DOM时（增删改查），那么DOM元素的变化自然会引起页面的回流（重拍）或者重绘，页面的DOM重绘自然会导致页面性能下降，因此尽可能减少DOM的操作。vue中，使用虚拟DOM来提高性能。3.真实DOM和虚拟DOM的区别：虚拟DOM不...
2021-08-09 19:28:38
105
原创 Vue组件间的通信(组件传值)
一.定义 vue组件之间的通信（传递数据）是必然的，依据vue组件之间的关系（父子、兄弟以及无关组件）会有不同的做法。二.分类父子组件：父--->子:props，refs 子--->父：事件（tips：上个blog有说到）注：父组件给子组件传值也叫正向传值，反之则为逆向传值。1）父给子组件：refs（tips：props上个blog有说到）用标签的方式使用组件（eg：<my-com/>），实际就...
2021-08-08 19:04:16
204
原创 Vue组件
一.概念（vue的两大核心：数据驱动和组件化）组件是自定义标签，vueJs提供的组件可以让程序员自己定义标签，对页面进行模块化。每个标签里面包含html、css、js。标签： <标签名 属性名=“属性值" 事件=”函数“>内容</标签名>vue的组件就是一个vue对象。vue对象的配置项，在vue组件里也可以使用。注：1.组件的配置项中没有el属性，只有根实例存在el，组件中使用template定义模板，且只能有...
2021-08-07 09:57:31
337
原创 [前端]项目环境搭建——前后端分离
目录一.gitee(码云)准备二.工具的搭建一.gitee(码云)准备新建一个空仓库将仓库克隆到本地二.工具的搭建生成package.json文件给项目安装gulp npm -i gulp -D 安装监听sass的工具 npm -i gulp-sass node-sass -D 在项目下新建gulpfile.js文件引入第三方包拷贝除sass文件以外的文件到www（服务器）下终端执行...
2021-07-27 14:38:05
466
原创 [css案列]手风琴
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> * { .
2021-07-21 20:58:01
62
原创 [案例] 放大镜，评分
一.放大镜<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> * { margin: 0; padding: 0; } li {
2021-07-20 20:36:29
65
原创 Node初体验
目录一.了解node二.命令行常用操作三.node运行js文件四.node开发一.了解node1.官方：基于chrome v8引擎的，是javascript的运行环境。v8引擎：专用解析javascript 解析引擎。2.私人：一个“软件”，能运行js代码。3.node与其他常用软件的区别：图标node没有图标顺序①其他如那件可以预先打开软件，然后在选择文件；②node不可以...
2021-07-20 16:41:48
200
原创 HTML+CSS+JavaScript试题总结（一）
一.px，em，rempx：定义：px是像素，绝对长度单位。px是相对于浏览器窗口的分辨率而言。特点：IE浏览器无法调整使用px作为单位的字体大小； Firefox可以调整px、em和rem。em：定义：em是相对长度单位。em是相对于当前对象内文本的字体尺寸。如果未被定义文本尺寸，则相em对于浏览器默认字体尺寸。特点：em的值不固定； em会继承父级元素的字体大小。注：默认浏览器的字体大小为16px，未经调整的浏览器都符合1em=16px。为了简化font-size的
2021-07-19 20:03:19
321
原创 设计模式
一.概念设计模式(Designpattern）是一套被反复使用、思想成熟、经过分类和无数实战设计经验的总结的。使用设计模式是为了让系统代码可重用、可扩展、可解耦、更容易被人理解且能保证代码可靠性。二.特点设计模式使代码开发真正工程化; 设计模式是软件工程的基石脉络，如同大厦的结构一样。设计模式并不是一种固定的公式，而是一种思想，是一种解决问题的思路；恰当的使用设计模式，可以实现代码的复用和提高可维护性；三.设计原则高内聚、低耦合。总体原则：开闭原...
2021-07-16 15:54:25
146
原创 [案列]Tab选项卡、购物车[简易版]、全选与反选
一.Tab选项卡<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> * {
2021-07-15 17:26:03
253
原创 Node节点、NodeList节点列表
一.NOde节点属性 className 设置/返回元素的class属性的属性值 innerHTML设置/返回元素的开始标签与结束标签之间的内容 value设置/返回文本框与文本域的内容 nextElementSibling 返回下一个紧邻的兄弟节点 previousElementSibling 返回上一个紧邻的兄弟节点 parentNode 返回父级节点 children找子级元素 style设置/获取一个...
2021-07-14 18:49:10
2584
原创 事件
帮助用户触发某个元素的事件:Node.去掉on的事件名。一.组成事件类型、事件源、事件处理函数。二.事件对象定义：当触发事件以后，对该事件的一些描述信息。三.事件类型鼠标事件 click：点击事件 dblclick：双击事件 contextmenu：右键点击事件 onmousedown：鼠标按下（左键） onmouseup：鼠标弹起（左键） onmousemove：鼠标移动 onmouseenter：鼠标移上 .
2021-07-13 16:27:54
101
原创 函数，箭头函数和构造函数
A.函数一.定义一段可以被高度复用的代码段。二.定义方式声明式——有提升（整个声明都会提升） fn1("先调用——我是乖哦bug");function fn1(str) { console.log("hi,我是声明的方式定义的 " + str);}fn1("后调用——我是乖哦bug");表达式/赋值式——没有提升（变量名提升，赋值没有提升）fn2("先调用——我是乖哦bug");var fn2 = function(str) { console.lo.
2021-07-12 16:48:17
484
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人