- 博客(246)
- 资源 (4)
- 收藏
- 关注

原创 Python知识体系概录
1.入门1.1变量和简单数据类型1.2列表1.3if 语句1.4字典1.5while 循环1.6函数1.7类2.爬虫3.数据分析
2021-11-29 09:49:21
539
原创 React中类组件和函数组件的理解和区别
react代码模块分为类组件和函数组件。从语法和定义、内部状态管理、生命周期、性能、可读性和维护性、上下文、集成状态管理库等角度对比React中类组件和函数组件。
2024-11-07 17:32:58
1614
原创 Vue2和Vue3中key差异整理
因此,将key设计成用于跟踪节点的身份,是Vue3在提高渲染效率和性能方面的一个重要的优化。有效地避免DOM重排和重新渲染,提高了渲染性能,同时也可以避免出现错误的数据更新。使用key就可以精确地判断哪些节点是新增的、哪些节点是删除的。的唯一性是必须保证的,否则会导致节点身份混乱,从而导致错误的渲染结果。结点的变化,而哈希表只能通过字符串或者数字来进行快速的查找和匹配。的值来判断哪些节点是新增的、哪些节点是删除的,然后对。key的值可以是非可预测的,例如随机生成的值。的值必须具有可预测性,不能随机生成。
2024-11-05 09:24:32
546
原创 vue常用的修饰符有哪些
在Vue 中,修饰符处理了许多 DOM 事件的细节,让我们不再需要花大量的时间去处理这些烦恼的事情,而能有更多的精力专注于程序的逻辑处理。在我们填完信息,光标离开标签的时候,才会将值赋予给value,也就是在change事件之后再进行信息同步。的时候,子组件传递的事件名格式必须为 update:value,其中 value 必须与子组件中。自动将用户的输入值转为数值类型,但如果这个值无法被paresFloat解析,则会返回原来的值。事件会让我们的网页变卡,因此我们使用这个修饰符的时候,相当于给。
2024-11-01 15:52:49
805
原创 vue2 的12种 vs vue3 的9种组件通信整理
通过 this.$attrs 获取父作用域中所有符合条件的属性集合,然后还要继续传给子组件内部的其他组件,就可以通过 v。:获取到一个包含所有子组件(不包含孙子组件)的 VueComponent 对象数组,可以直接拿到子组件中所有数据和方法等。把子组件的数据通过插槽的方式传给父组件使用,然后再插回来。可以帮我们实现父组件向子组件传递的数据 的双向绑定,所以子组件接收到数据后。如果在子组件上,引用的指向就是子组件实例,然后父组件就可以通过。把子组件的数据通过插槽的方式传给父组件使用,然后再插回来。
2024-10-31 10:16:37
1037
1
原创 vue2和vue3的数据双向绑定差异整理
劫持的是对象中每一个属性。由于使用发布-订阅模式,当数据变化时,所有订阅者都需要被通知,这可能导致性能问题,尤其是在大型应用中。参数一: target:劫持对象,参数二:prop:劫持对象属性 , 参数三:vaule:新的属性值, p:本身。参数一: obj:劫持对象,参数二:"name":劫持对象属性 , 参数三:给属性添加set,get方法。对象以及对象属性的劫持+发布订阅模式来实现双向数据绑定。将用户输入的数据赋值于变量的时间有输入时延迟到数据改变时。劫持的是对象中每一个属性。2.2、子组件中使用。
2024-10-30 09:12:23
576
原创 vue2与vue3生命周期差异整理
父beforeCreate->父created->父beforeMount->子beforeCreate->子created->子beforeMount->子mounted->父mounted。生命周期整体分为四个阶段,分别是:创建、挂载、更新、销毁,每个阶段都有两个钩子,一前一后。这些新增和改进的生命周期钩子函数使得 Vue 3 的开发更加高效和便捷。() 函数中,我们可以直接访问组件的实例属性和方法,以及通过。钩子函数会在组件的渲染跟踪列表中触发,可以用于优化渲染性能。钩子函数合并为了一个。
2024-10-29 15:03:35
903
原创 electron有关mac构建
执行下面命令,检查下按照的 node.js 版本是不是 intel x64 指令集,如果是的话安装下 arm64 指令集的 node.js终端中执行以下命令:node -p process.arch。针对 Mac M1/2/3 芯片的设备,proces.arch=arm64.勾选 以 Rosetta 打开(Open using Rosetta)。右键点击 终端 应用并选择 获取简介(Get Info)。在 Rosetta 终端中安装nvm与 Node.js。打开 应用程序 文件夹中的 终端 应用。
2024-09-11 11:46:54
796
原创 js有关深度优先遍历和广度优先遍历
当节点v的所有边都已访问,或者没有未被访问的边时,DFS会回溯到发现节点v的节点,继续搜索其他路径。则是另一种图遍历算法,它从图的某一节点(源或起始节点)出发,探索所有相邻的节点,然后对这些相邻节点的未被访问的邻接节点进行探索,直到所有可达的节点都被访问。BFS按层次顺序进行搜索,首先访问离起始节点最近的节点,然后逐渐向外扩展到更远的节点。深度优先遍历适合用于寻找图中是否存在环或者特定路径的情况,而广度优先遍历则更适合于寻找最短路径或者需要遍历图中所有可达节点的情况。
2024-07-19 18:30:25
380
原创 对为什么react需要时间分片,vue3不需要的浅学习
Vue 3 通过编译器优化、响应式系统改进、虚拟 DOM 和 Diff 算法优化、单次异步队列、自动批处理等技术手段,大幅提升了渲染效率和性能。再加上现代浏览器的性能提升,使得 Vue 3 能够在大多数情况下提供流畅的用户体验,而无需借助时间分片等复杂的技术。
2024-07-09 10:46:36
1366
原创 渲染流程关于HTML、CSS和JavaScript的那些事的学习笔记
1、概括我们知道HTML、CSS、JavaScript 数据,经过中间渲染模块的处理,最终输出为屏幕上的像素。 HTML的内容是由标记和文本组成。标记也称为标签,每个标签都有它自己的语义,浏览器会根据标签的语义来正确展示 HTML 内容。比如上面的<p>标签是告诉浏览器在这里的内容需要创建一个新段落,中间的文本就是段落中需要显示的内容。如果需要改变 HTML 的字体颜色、大小等信息,就需要用到 CSS。CSS又称为层叠...
2021-11-17 11:24:41
822
原创 TCP 连接
百度百科定义传输控制协议(TCP,Transmission Control Protocol)是一种面向连接的、可靠的、基于字节流的传输层通信协议。TCP旨在适应支持多网络应用的分层协议层次结构。 连接到不同但互连的计算机通信网络的主计算机中的成对进程之间依靠TCP提供可靠的通信服务。TCP假设它可以从较低级别的协议获得简单的,可能不可靠的数据报服务。 原则上,TCP应该能够在从硬线连接到分组交换或电路交换网络的各种通信系统之上操作。一个完整的 TCP 连接的生命周期包括了“建立连接”“传输
2021-11-16 14:34:57
2795
原创 URL介绍以及同站、同源
1.URL介绍URL(Uniform Resource Locator),统一资源定位符,用于定位互联网上资源,俗称网址。比如http://www.w3school.com.cn/ht...,遵守以下的语法规则:scheme://host.domain:port/path/filename各部分解释如下:scheme - 定义因特网服务的类型。常见的协议有 http、https、ftp、file,其中最常见的类型是 http,而 https 则是进行加密的网络传输。 host - 定.
2021-11-16 10:52:23
1070
原创 导航流程:从输入URL到页面展示,这中间发生了什么?(草稿)
1.用户输入URL浏览器会根据用户输入的信息判断是搜索还是网址,如果是搜索内容,就将搜索内容+默认搜索引擎合成新的URL;如果用户输入的内容符合URL规则,浏览器就会根据URL协议,在这段内容上加上协议合成合法的URL2. 用户输入完内容,按下回车键,浏览器导航栏显示loading状态,但是页面还是呈现前一个页面,这是因为新页面的响应数据还没有获得3. 浏览器进程浏览器构建请求行信息,会通过进程间通信(IPC)将URL请求发送给网络进程GET /index.html HTTP1.14
2021-11-16 09:57:00
151
原创 浏览器缓存机制
浏览器的存储和缓存机制就是为了减少网格请求,提高用户体验。其中缓存位置上来说分为四种:Memory Cache,Service WorkerCache,HTTPCache,Push Cache.并且各自有优先级,当依次查找缓存且都没有命中的时候,才会去请求网络。离线存储技术有:Cookie、Web Storage、IndexedDB...
2021-11-12 15:24:03
560
原创 centos8网络配置
1、设置-网络适配器-网络链接–为NAT链接模式2、nm-connection-editor终端输入命令:nm-connection-editor 回车就弹出网络链接页面。点击+按钮,显示弹窗,下拉设备选择,点击保存3、linux机切换为刚刚添加的以太网4、正常上网...
2021-09-01 14:47:58
517
原创 React Hook源码浅解析
本文源码解析react版本:17.0.31、Hook概述Hook 是 React 16.8 的新增特性,它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。Hook的诞生,是为共享状态逻辑提供更好的原生途径。React官方文档,已经对hook进行了十分全面的介绍:https://reactjs.org/docs/hooks-intro.html2、 React Hook源码文件文件位置:packages/react/src/ReactHooks.js
2021-08-09 11:30:46
401
原创 前言
本专栏是学习《JavaScript设计模式与开发实践》笔记和总结,里面的demo也是来源《JavaScript设计模式与开发实践》。序号 模式 特点 demo 1 单例模式 保证一个类仅有一个实例,并提供一个访问它的全局访问点 demo 2 策略模式 定义一系列的算法,把它们一个个封装起来,并且使它们可以相...
2019-07-13 15:34:19
181
原创 13、状态模式
1、特点允许一个对象在其内部状态改变时改变它的行为,对象看起来似乎修改了它的类。2、demo电灯的开、亮度、关// OffLightState:var OffLightState = function(light) { this.light = light;};OffLightState.prototype.buttonWasPressed = function(...
2019-07-13 15:19:59
180
原创 12、装饰者模式
1、特点装饰者模式可以动态地给某个对象添加一些额外的职责,而不会影响从这个类中派生的其他对象。2、demovar Plane = function() {}Plane.prototype.fire = function() { console.log('发射普通子弹');}var MissileDecorator = function(plane) { th...
2019-07-13 14:46:57
175
原创 11、中介者模式
1、特点解除对象与对象之间的紧耦合关系。增加一个中介者对象后,所有的相关对象都通过中介者对象来通信,而不是互相引用,所以当一个对象发生改变时,只需要通知中介者对象即可。中介者使各对象之间耦合松散,而且可以独立地改变它们之间的交互。中介者模式使网状的多对多关系变成了相对简单的一对多关系。2、demo泡泡堂游戏先定义一个玩家构造函数,它有3 个简单的原型方法:Play.protot...
2019-07-13 14:34:14
174
原创 10、职责链模式
1、特点使多个对象都有机会处理请求,从而避免请求的发送者和接收者之间的耦合关系,将这些对象连成一条链,并沿着这条链传递该请求,直到有一个对象处理它为止。2、demo公司针对支付过定金的用户有一定的优惠政策。在正式购买后,已经支付过500 元定金的用户会收到100 元的商城优惠券,200 元定金的用户可以收到50 元的优惠券,而之前没有支付定金的用户只能进入普通购买模式,也就是没有优惠券...
2019-07-13 13:55:50
156
原创 9、享元模式
1、特点享元(flyweight)模式是一种用于性能优化的模式,“fly”在这里是苍蝇的意思,意为蝇量级。享元模式的核心是运用共享技术来有效支持大量细粒度的对象。2、demo50 种男式内衣和50 种女士内衣,为了推销产品,工厂决定生产一些塑料模特来穿上他们的内衣拍成广告照片// 50 种男式内衣和50 种女士内衣,为了推销产品,工厂决// 定生产一些塑料模特来穿上他们的内衣拍...
2019-07-13 11:08:57
147
原创 8、模板方法模式
1、特点模板方法模式是一种只需使用继承就可以实现的非常简单的模式。由两部分结构组成,第一部分是抽象父类,第二部分是具体的实现子类。通常在抽象父类中封装了子类的算法框架,包括实现一些公共方法以及封装子类中所有方法的执行顺序。子类通过继承这个抽象类,也继承了整个算法结构,并且可以选择重写父类的方法。2、demo泡咖啡和泡 茶var Beverage = function() {};...
2019-07-13 10:15:37
129
原创 7、组合模式
1、特点组合模式是用小的子对象来构建更大的对象,而这些小的子对象本身也许是由更小的“孙对象”构成的。2、demo目前的万能遥控器,包含了关门、开电脑、登录QQ 这3 个命令。现在我们需要一个“超级万能遥控器”,可以控制家里所有的电器,这个遥控器拥有以下功能:a、打开空调b、打开电视和音响c、关门、开电脑、登录QQ<html><body> ...
2019-07-13 10:01:29
152
原创 6、命令模式
1、特点命令模式是最简单和优雅的模式之一,命令模式中的命令(command)指的是一个执行某些特定事情的指令。命令模式最常见的应用场景是:有时候需要向某些对象发送请求,但是并不知道请求的接收者是谁,也不知道被请求的操作是什么。此时希望用一种松耦合的方式来设计程序,使得请求发送者和请求接收者能够消除彼此之间的耦合关系。2、demo菜单程序var bindClick = functi...
2019-07-13 09:41:22
143
原创 5、发布—订阅模式
1、特点发布—订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知。在JavaScript 开发中,我们一般用事件模型来替代传统的发布—订阅模式。2、demo订阅房子开售的消息// 首先要指定好谁充当发布者(比如售楼处);// 然后给发布者添加一个缓存列表,用于存放回调函数以便通知订阅者(售楼处的花名册);/...
2019-07-13 09:13:55
169
原创 4、迭代器模式
1、特点迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示。迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也可以按顺序访问其中的每个元素。2、demo实现自己的迭代器var each = function(ary, callback) { for (var i = 0; i <...
2019-07-12 17:55:24
131
原创 3、代理模式
1、特点代理模式是为一个对象提供一个代用品或占位符,以便控制对它的访问。代理模式是一种非常有意义的模式,在生活中可以找到很多代理模式的场景。比如,明星都有经纪人作为代理。如果想请明星来办一场商业演出,只能联系他的经纪人。经纪人会把商业演出的细节和报酬都谈好之后,再把合同交给明星签。2、demo小明送花var Flower = function() {};var xiaomi...
2019-07-12 17:52:45
141
原创 2、策略模式
1、特点定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换2、demo使用策略模式计算奖金//策略模式//策略模式的定义是:定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换。//使用策略模式计算奖金var calculateBonus = function(performanceLevel, salary) { if (performan...
2019-07-12 17:47:17
150
原创 1、单例模式
1、特点保证一个类仅有一个实例,并提供一个访问它的全局访问点。单例模式是一种常用的模式,有一些对象我们往往只需要一个,比如线程池、全局缓存、浏览器中的window 对象等。2、实现单例模式var Singleton = function( name ){this.name = name;this.instance = null;};Singleton.prototype....
2019-07-12 17:33:34
175
原创 5、js数据结构与算法之字典
1、前言字典是一种以键- 值对形式存储数据的数据结构,就像电话号码簿里的名字和电话号码一样。要找一个电话时,先找名字,名字找到了,紧挨着它的电话号码也就找到了。这里的键是指你用来查找的东西,值是查找得到的结果。JavaScript 的Object 类就是以字典的形式设计的。本章将使用Object 类本身的特性,实现一个Dictionary 类,让这种字典类型的对象使用起来更加简单。2、Di...
2019-06-03 09:21:50
200
原创 4、js数据结构与算法之栈
1、前言栈是和列表类似的一种数据结构,它可用来解决计算机世界里的很多问题。栈是一种高效的数据结构,因为数据只能在栈顶添加或删除,所以这样的操作很快,而且容易实现。栈的使用遍布程序语言实现的方方面面,从表达式求值到处理函数调用。2、对栈的操作 由于栈具有后入先出的特点,所以任何不在栈顶的元素都无法访问。为了得到栈底的元素,必须先拿掉上面的元素。对栈的两种主要操作是将一个元素压入栈和...
2019-06-01 10:59:56
195
原创 3、js数据结构与算法之队列
1、前言 队列是一种先进先出(First-In-First-Out,FIFO)的数据结构。队列被用在很多地方,比如提交操作系统执行的一系列进程、打印任务池等,一些仿真系统用队列来模拟银行或杂货店里排队的顾客。 队列的两种主要操作是:向队列中插入新元素和删除队列中的元素。插入操作也叫做入队,删除操作也叫做出队。入队操作在队尾插入新元素,出队操作删除队头的元素。 ...
2019-05-31 18:05:48
185
原创 2、js数据结构与算法之列表
1、定义在日常生活中,人们经常使用列表:待办事项列表、购物清单、十佳榜单、最后十名榜单等。计算机程序也在使用列表,尤其是列表中保存的元素不是太多时。当不需要在一个很长的序列中查找元素,或者对其进行排序时,列表显得尤为有用。反之,如果数据结构非常复杂,列表的作用就没有那么大了。列表是一组有序的数据。每个列表中的数据项称为元素。在JavaScript 中,列表中的元素可以是任意数据类型。列表中...
2019-05-30 15:02:08
177
WebKit技术内幕高清全书441页
2019-01-21
网站设计解构:有效的交互设计框架和模式
2014-09-29
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人