- 博客(13)
- 收藏
- 关注
RSS订阅原创 JS继承：原型继承、构造函数继承、组合继承与最佳的继承
最近对JS继承中的几种方式复习了下，在这里总结一下：首先我们先定义一下父类的构造函数function Person(name) { this.name = name;}然后我们在父类的原型上添加一个printName函数Person.prototype.printName = function () { return "I am a person";};下面开始我们的表演：一、原型继承原型继承，顾名思义就是通过原型链来让子类继承父类的属性以及函数，代码如下：function
2020-07-07 20:37:19
960
原创 React diff--lastIndex作用理解
React的diff中有个用lastIndex来做顺序优化的手段。lastIndex就是当前在旧集合中访问的最右边的节点位置。这几天感觉这个优化手段还是有点难理解的，后面发现用一种相对位置最大化利用的角度可以解释清楚一点。以上面这个图为例：1、一开始我们以旧集合中第一个位置作为相对位置，我们从新集合中的B出发，发现B在旧集合中是在相对位置的右边，说明这个时候B对于前面节点的顺序是没有影响的，相对顺序正确。2、然后我们将旧集合中B所在的第二个位置作为相对位置，接着从新集合中的下一个节点A出发，发现A在
2020-07-03 20:01:20
651
原创 TypeScript常用工具泛型函数总结
最近用到了TS中一些工具泛型，觉得TS中的很多工具泛型函数用处还是很大的，在这里总结一些常用的：PartialPartial的作用是将传入的属性变成可选项，原理就是使用keyof拿到所有属性名，然后再使用in遍历，T[P]拿到相应的值。RequiredRequired 的作用是将传入的属性变为必选项，原理是使用-？将可选项的？去掉。与之对应的还有个+？。ReadonlyReadonly的作用是将传入的属性变为只读选项MutableMutable的作用是将传入属性的readonly移除。
2020-07-03 19:56:58
1386
原创 React-防止组件卸载时内存泄露
前阵子在开发过程中遇到了React-组件卸载时内存泄漏的问题，在这里记录一下：问题描述使用react开发的项目在切换页面的时候，报了下面这个错：Can’t perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous
2020-07-03 19:46:16
1418
1
原创 Nodejs做后端，实现文件压缩下载的几种方案（archiver、compressing、linux的zip命令）：
一、 Archiver1、 安装npm install archiver2、 使用由于需要做文件操作，所以我们需要将fs库也引进来先创建一个可写流，用于传入压缩包数据再创建一个archiver实例，其实就是一个可读流。指定压缩格式与压缩等级：压缩格式支持zip与tar；压缩等级的话，速度最快的是1，也就是不压缩，压缩包大小与包内文件大小总和几乎相等，而压缩性能最好的是9。使用pipe将两个流连接，开始写压缩包数据单个文件压缩的话，可以使用append来逐个添加。append方法的第一
2020-05-28 10:22:24
5634
3
原创 Redux知识总结与使用技巧
Redux的机制可以用下面这张图来概括：1、 storestore可以看成一个容器，是我们用来保存数据的地方。整个应用中只能有一个store。2、 state前面说到的store对象中包含我们整个应用中所有的数据。如果想得到某个时间节点的数据，通过store就能拿到那个时间节点的数据集合。这种数据集合就叫做state，通过store.getState()可以拿到当前时刻的state。3...
2020-05-06 21:57:20
246
原创 React生命周期&setState总结
近日实习过程中的过程中，我在React生命周期这个地方踩了比较多的坑，主要原因还是自己对这部分知识的理解不够深。刚好最近自己花了点时间对这个知识点进行了理解巩固，在这里总结一下：一、 组件初次挂载的生命周期二、 组件更新的生命周期三、 组件卸载的生命周期四、 组件错误处理的生命周期五、 常用生命周期函数&setState总结1. render()官方文档中提到，ren...
2020-05-05 20:12:59
1266
原创 CSS3-Animation学习总结：keyframe&Animation属性&动画重置技巧
一、keyframe（关键帧）CSS3中的动画，其实是通过改变每一帧中元素的样式来实现的。通过在动画序列中定义关键帧的样式可以控制CSS动画序列中的中间步骤。@keyframes slidein { from { margin-left: 100%; width: 300%; } to { margin-left: 0%; width: 100%;...
2020-04-02 18:48:30
2550
原创 node编译程序踩坑及解决方案：ES6转ES5
今天笔者正在学习Redux，编写了一个程序准备运行体会一下，代码如下：import {createStore} from 'redux'function counter(state = 0, action) { switch (action.type) { case 'INCREMENT': return state + 1; case 'DECREMENT': ...
2020-03-31 17:31:06
708
原创 React学习之路（4）：代码分割&Context
一、代码分割这里介绍React中常用的几种代码分割的方法：1、动态import()没使用动态import之前：import {add} from './math'useadd(){ console.log(add(16, 26));}使用动态import后：useadd(){ import('./math').then(math=>{ console.log(add...
2020-03-30 23:36:58
361
原创 React学习之路（3）：状态提升&组合&继承
一、状态提升class TemperatureInput extends React.Component { constructor(props) { super(props); this.handleChange = this.handleChange.bind(this); } handleChange(e) { this.props.onTemperat...
2020-03-29 23:31:56
187
原创 React学习之路（2）： 事件处理&条件渲染&列表&key&表单
一、事件处理记录一下在官网文档上学习事件处理的知识点：1、react事件命名采用小驼峰式（camelCase）2、在JSX语法中传入函数作为事件处理函数，而不是字符串<button onClick={activateLasers}> Activate Lasers</button>3、react中不能通过返回false来阻止默认事件行为，而是需要通过显式地...
2020-03-28 23:23:45
225
1
原创 React学习之路（1）: JSX&元素渲染&组件&props&state&生命周期
一、JSXconst element = <h1>Hello, world!</h1>;上面这种语法就是react中的JSX。按照官方文档的说法，这是为了使得渲染逻辑与UI逻辑内在耦合，所以React中采用将渲染逻辑与UI逻辑共同放在“组件”中来实现。其实就是在组件中共同操作了html与js，使得组件作为一个整体进行渲染（按照我的理解）。JSX的语法也不止是像上面那...
2020-03-28 21:35:49
562
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人