- 博客(29)
- 收藏
- 关注
原创 Promise总结
Promise只有promise调用then的时候,then里面的函数才会被推入微任务中;1.Promise的三个状态pending(进行中)、fulfilled(已成功)、rejected(已失败)只有异步操作的结果可以改变状态,其他任何操作都无法改变,即承诺状态改变只有2种可能1.1 pending->fulfilled1.2 pending->rejected状态改变就不会再变,如果改变已经发生,再对Promise对象添加回调函数也会立即得到结果这
2021-09-27 14:06:06 409
原创 React生命周期
组件生命周期:getInitialState初始化this.state的值,只在组件装载之前调用一次如果是使用ES6,可以在构造函数中初始化状态getDefaultProps即预先定义好的对象值只在组建创建时调用一次并缓存返回的对象(即在React.createClass之后就会被调用)因为这个方法在实例化之前调用,所以在这个方法里不能依赖this获取组件的实例如果是ES6,直接定义defaultProps这个类属性来替代Counter.defaultProps = {init
2021-09-10 13:46:19 216
原创 函数组件设计模式
容器模式实现按条件执行Hooks使用render props模式复用UI逻辑首先,Hooks的一个重要规则:Hooks必须在顶层作用域调用,而不能放在条件判断、循环语句中,即Hooks必须被执行到。这个规则存在的原因是:React需要在函数组件内部维护所用到的Hooks状态例子,对于一个对话框组件,通过visible属性来控制是否显示。比如期望如下:function UserInfoModal({ visible, userId, ...rest }) { if (!vis.
2021-07-27 17:01:39 247
原创 Hooks处理Rest API请求
首先实现自己的API Client无论大小项目,先创建自己的API Client,之后所有请求都通过这个Client发出去可以在API Client中对需要连接的服务端做一些通用的配置和处理,比如Token、URL、错误处理等// axios相对于fetch,更加方便,语义化的APIimport axios from 'axios'// 定义相关的endpointconst endPoints = { test: "https://..../", prod: .
2021-07-25 13:29:20 450
原创 React-Hooks处理表单
首先,在表单中使用React组件有受控组件非受控组件function MyForm() { const [value, setValue] = useState('') const handleChange = (evt) => { setValue(evt.target.value) } return <input value={value} onChange={this.handleChange} />}.
2021-07-25 01:26:54 1365
原创 React事件处理
原生事件是浏览器层面的事件自定义事件是纯组件实现的一种机制首先,是不是所有的回调函数都需要用useCallback进行封装呢?是否需要使用useCallback和函数复杂度没有必然关系,而是和回调函数绑定到哪个组件有关。这是为了避免因组件属性变化而导致不必要的重新渲染。对于原生的DOM节点,如button、input等,我们是不用担心重新渲染的。所以,如果事件处理函数是传递给原生节点,那么可以不写callback。但如果使用的是自定义组件,或者一些UI框架的组件,那么回调函数还都应该用us.
2021-07-25 00:44:32 132
原创 React-Hooks-04-自定义hook的四个典型使用场景
简单的例子,简单计数器实现,抽离业务逻辑成为hook:function useCounter() { const [count, setCount] = useState(0) const increment = useCallback(() => { setCount(count + 1) }, [count]) const decrement = useCallback(() => { setCount
2021-07-19 20:44:04 1586
原创 React组件通信
父组件向子组件通信 父组件通过props向子组件传递需要的信息 子组件向父组件通信 子组件间接回调父组件的setState的方法来改变父组件的state 新的state通过props的形式再次被子组件获取 回调函数 子组件通过父组件传递的函数,将参数传递给父组件使用 React16.3新特性:Context API 跨级组件通信Context(发布订阅者模式) 类似于有个数据源,组件可以订阅这个数据源 在简单场景下可以代替部分redux的功能 使..
2021-07-19 11:28:19 80
原创 React类中方法的this指向
对于普通的类:class Person { constructor(name, age) { this.name = name; this.age = age; } speak() { console.log(this); }}const p1 = new Person(’tom’, 18);p1.speak(); // 通过实例调用speak方法const speak = p1.speak;speak();
2021-07-19 11:08:16 191
原创 React-Hooks-学习-03-理解组件生命周期
React的本质? 从Model 到 View 的映射。假设状态永远不变,那么实际上函数组件就相当于是一个模版引擎,只执行一次。但是React本身正是为了动态的状态变化而设计的,而可能引起状态变化的原因基本只有两个: 用户操作产生的事件,比如点击了某个按钮 副作用产生的事件,比如发起某个请求正确返回了 例子:一个用于显示博客文章的组件,接收一个文章的id作为参数,然后根据这个id从服务器端获取文章内容并显示,并检测id的变化,重新发送请求。如果在 class 组件,需要这..
2021-07-19 10:57:04 240
原创 React-Hooks-学习-02-4个常用hooks
Hooks的使用规则: 只能在组件的顶级作用域使用,且在组件的多次渲染之间必须按顺序执行。 即不能在循环、条件判断、嵌套里面使用 即所有hook必须执行到,且按顺序 只能在函数组件或其他hooks中使用。 4个常用的内置hooks: useCallback useCallback(fn, deps)相当于useMemo(() => fn, deps) 该回调函数仅在某个依赖项改变时才会更新 useMemo use..
2021-07-19 10:48:13 250
原创 React hook实现展示对话框
React中使用对话框并不容易,主要因为: 对话框需要在父组件中声明,才能在子组件中控制其是否显示 给对话框传递参数只能由props传入,这意味着所有状态管理都必须在更高阶的组件中。而实际上这个对话框的参数只在子组件中才会维护。这时就需要我们使用自定义事件将参数传回 这些问题的本质就是:如何用一个统一的方式去管理对话框,从而让对话框相关的业务逻辑更加模块化,以及和其他业务逻辑进行解耦。下面的方式只是经验总结,并不是唯一或者最佳实现:思路:使用全局状态管理所有对话框对话框本
2021-07-15 20:11:28 1215 1
原创 为什么要发明Hooks?
一方面,React组件之间是不会相互继承的。即没有利用到Class的继承特性 另一方面,所有UI都是由状态驱动的,因此很少会在外部去调用一个类实例(即组件)的方法。组件所有方法都是在内部调用,或者作为生命周期方法被自动调用的 目标: -给函数组件加上状态因为函数和对象不同,并没有一个实例的对象能够在多次执行之间保存状态,所以需要一个外部的空间来保存这个状态,并且能够检测其变化,从而能触发组件的重新渲染。进一步: 需要一个机制,能够把一个外部的数据绑定到函数...
2021-06-20 21:44:04 257
原创 React-Hooks-学习-01
核心hook useState useEffect 其他较重要hook useCallback useMemo useRef useContext useState 让函数组件具有维持状态的能力 遵循一个原则:state中永远不要保存可以通过计算得到的值: 如props传递的值、从URL获取的值、从cookie和localStorge获取的值 ...
2021-06-20 21:37:21 108
原创 JavaScript面向对象编程
JS面向对象的程序设计,大部分初学者写JS都是运用的面向过程的思维来写的(即一个function后接着另一个function)其实JS中的function就是一个对象,如下:var HelloWscats = function(){ console.log("wscats is not cat");}var _init = function(){ var obj = new HelloWscats();}_init(); // wscats is not cat此
2021-05-08 10:19:10 218
原创 用大白话理解递归
先来个场景:你带着女友去电影院看电影~女友问,咱两现在坐在第几排啊?电影院里面太黑了,看不清,没法数,现在你怎么办?于是你开始展示你智慧的一面了,先问前排的人他是第几排,你想只要在他的数字上加一,就知道自己在哪一排了。但是,前面的人也看不清啊,所以他也问他前面的人。就这样一排一排往前问~ 直到问到第一排的人,说我在第一排,然后再这样一排一排再把数字传回来。直到你前面的人告诉你他在哪一排,于是你就知道答案了。这就是一个非常标准的递归求解问题的分解过程,去的过程叫“递”,回来的过程叫“归”,所以叫“递
2021-04-13 10:36:32 324
原创 关于Vue的双向数据绑定
如何理解Vue数据绑定原理Vue数据双向绑定原理是通过数据劫持结合发布者-订阅者模式的方式来实现的,首先是对数据进行监听,然后当监听的属性发生变化时则告诉订阅者是否要更新,若更新就会执行对应的更新函数从而更新视图MVC模式以往的MVC模式是单向绑定,即Model绑定到View,当我们用JavaScript代码更新Model时,View就会自动更新MVVM模式MVVM模式就是Model–View–ViewModel模式。它实现了View的变动,自动反映在 ViewModel,反之亦然。对于双向绑
2021-03-25 11:14:43 206
原创 KMP算法
KMP算法一张图一句话:一张图:一句话:为了避免子串不断回溯到首个元素造成的浪费,KMP算法利用记录最大前后缀长度的方式(next数组)在失配时保持主串指针不动,让子串指针每次移动到更有效的位置,从而达到节省时间的作用。一张图:...
2020-06-14 20:34:50 141
原创 NumPy 广播(Broadcast)
广播(Broadcast)是 numpy 对不同形状(shape)的数组进行数值计算的方式, 对数组的算术运算通常在相应的元素上进行。如果两个数组 a 和 b 形状相同,即满足 a.shape == b.shape,那么 a*b 的结果就是 a 与 b 数组对应位相乘。这要求维数相同,且各维度的长度相同。import numpy as np a = np.array([1,2,3,4])...
2019-12-19 13:35:06 342
原创 在Mac中像Windows一样查看Tomcat控制台信息
在Windows系统中,通过startup.bat启动Tomcat之后会打开一个控制台,输出日志信息,在系统调试过程中,也会随时输入日志或错误信息,对开发很有帮助。在Mac中,通过startup.sh启动Tomcat却只会输入几行信息告知Tomcat已经启动,而不会输出一些过程信息。其实Mac也可以像Windows一样随时查看Tomcat控制台信息,具体步骤如下:启动Tomcat之后,执行以...
2019-12-17 21:24:12 310
原创 如何对HashMap按键值排序—DailyNews1
HashMap存储每对键和值作为一个Entry<K,V>对象,键的每次插入,都会有值对应到散列映射上,生成一个Entry <K,V>对象。通过使用这个Entry <K,V>对象,我们可以根据值来排序HashMap。步骤如下:1、从HashMap恢复Entry集合:Set<Map.Entry<Character,Integer>> m...
2019-12-13 15:29:40 231
原创 专业知识小结1
1.TCP/UDP的区别UDP(用户数据报协议)特点:无连接、近最大努力交付、面向报文(既不合并也不拆分)功能:复用和分用?TCP(传输控制协议)特点:面向连接、可靠传输、面向字节流、流量控制、拥塞控制面向连接数据传输开始前 建立连接 三次握手数据传输结束后 断开连接 四次挥手三次握手:(规避请求超时等问题)客户端 发起请求 SYN报文,服务端接受后返回SYN和ACK请求确认...
2019-12-11 20:14:30 153
原创 tf.split使用
import tensorflow as tftensor = [[[1,2,3],[4,5,6],[7,8,9]]]with tf.Session() as sess:tensor1, tensor2 = tf.split(tensor, [1,2], 2) #将tensor在第2个维度(基1)切为1份和2份print(tensor2 .eval())代码运行结果:[[[2 3...
2019-12-09 21:35:06 78
原创 一点感悟
最近用GAN进行PAN-sharping的实验,发现不加GAN反而效果更好,网上查阅一番,原因可能是因为GAN是通过学习真实的数据集,通过生成对抗训练,得出和数据集分布规则一样的数据集,而遥感融合要求的是真实的地理图片,而不仅是生成像真实的地理图片,而且训练集里的训练样本就是所想要得到的结果,所以,所有和GAN扯上关系的遥感融合方面的论文只是个噱头罢了,论文能够通过难道是审稿专家也没搞清楚GAN的...
2019-12-09 15:43:09 245 4
转载 String、StringBuffer和StringBuilder的区别
String、StringBuffer和StringBuilder的区别:文章目录StringStringBufferStringB...
2019-11-29 20:07:16 387
原创 Receptive field(感受野)
e.g.两层 33 卷积操作的有效区域(感受野)是55 (所有filter的stride=1,pad=0)e.g.三层33卷积核操作的有效区域是77 (所有filter的stride=1,pad=0)**定义:感受野用来表示网络内部的不同神经元对原图像的感受范围的大小,或者说,convNets(cnn)每一层输出的特征图(feature map)上的像素点在原始图像上映射的区域大小。神经...
2019-11-29 09:53:36 112
原创 Java Lambda
你要做个操作,比如a.get(InterfaceName b);,这是不是代表你要传一个实现了InterfaceName接口的子类对象进去作为参数(因为InterfaceName接口无法直接实例化)?最low的办法是你写一个类实现了InterfaceName接口,然后你创建了一个该类对象b传进去当了参数。但是这样是不是很麻烦,于是java官方推出了匿名类,你可以直接通过匿名类的方式传参,是这么...
2019-11-15 22:15:52 84
原创 DenseNet网络关键点
优点:1、减轻了vanishing-gradient(梯度消失)2、加强了feature的传递3、更有效地利用了feature4、一定程度上减少了参数数量核心思想:create short paths from early layers to later layers.Each layer has direct access to the gradients from the loss...
2019-11-13 10:28:33 265
原创 CNN中的feature map
CNN中的feature map新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入新的改变我们对Markdow...
2019-11-13 09:27:14 460
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人