阿超

世界在音乐中得到了完整的再现和表达。它是各种艺术当中第一位的，帝王式的艺术，能够成为音乐那样，则是一切艺术的目的。——叔本华 继续还是js中Array的方法 这次说的方法是from：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/from 这个方法简单应用如下： 12345console.log(Array.from('foo'));// expected output: Array ["f", "o", "o"]console.log(Array.from([1, 2, 3], x => x + x));// expected output: Array [2, 4, 6] 我这里写个稍微复杂点的例子，随机生成文件名并排序 1[...new Set(Array.from(Array(200).fill('文件'),x=>x+String(...

立志用功如种树然，方其根芽，犹未有干；及其有干，尚未有枝；枝而后叶，叶而后花。——王守仁 我们在React遍历渲染列表时会遇到这样一个报错： 意思是说，渲染list列表时必须给每个元素指定一个唯一的key 当然你可以选择忽略这个报错，但是为什么会提示这个报错呢？ 假设我们给key指定一个随机数，或者干脆不指定的话，会怎么样呢？ 官方文档给出了答案： 渲染列表时的逻辑以及问题 为了解决上述问题，React 引入了 key 属性。 也就是说，如果给key指定一个随机数，或者干脆不指定的话，会造成性能问题 这个时候，我们想到了用遍历时的元素下标作为key 但是官方文档明确告诉我们： 如果列表项目的顺序可能会变化，我们不建议使用索引来用作 key 值，因为这样做会导致性能变差，还可能引起组件状态的问题。可以看看 Robin Pokorny 的深度解析使用索引作为 key 的负面影响这一篇文章。如果你选择不指定显式的 key 值，那么 React 将默认使用索引用作为列表项目的 key 值。 这里Robin Pokirny的文章中提到了，如果满足这三者，可以放心使用index作为...

新的方法和概念，常常比解决问题本身更重要。——华罗庚 我们在前端开发中，可以使用fill函数来快速构建数组 1Array(5).fill(1,1,4) 得到的是这样一个数组： 1[, 1, 1, 1, ] 这里参数fill(value,start,end)也是可以省略的 12345678910111213141516[1, 2, 3].fill(4); // [4, 4, 4][1, 2, 3].fill(4, 1); // [1, 4, 4][1, 2, 3].fill(4, 1, 2); // [1, 4, 3][1, 2, 3].fill(4, 1, 1); // [1, 2, 3][1, 2, 3].fill(4, 3, 3); // [1, 2, 3][1, 2, 3].fill(4, -3, -2); // [4, 2, 3][1, 2, 3].fill(4, NaN, NaN); // [1, 2, 3][1, 2, 3].fill(4, 3...

你最可爱，我说时来不及思索。但思索之后，还是这样说。——普希金《你多么可爱》 首先是这个issue：希望AnnotationUtil增加对@AliasFor的支持 然后我就提交了这个PR：提供AnnotationUtil#getAnnotationAlias，为@Alias注解做别名支持的适配 代码如下(找不到方法可以去看hutool源码)： 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152import cn.hutool.core.exceptions.UtilException;import cn.hutool.core.util.ArrayUtil;import cn.hutool.core.util.ObjectUtil;import cn.hutool.core.util.ReflectUtil;import cn.hutool.core.util.StrUtil;import java.lang.annotation.Ann...

我喜欢我的懦弱，痛苦和难堪也喜欢。喜欢夏天的光照，风的气息，蝉的鸣叫，喜欢这些，喜欢得不得了。——《寻羊冒险记》 dva 首先是一个基于 redux 和 redux-saga 的数据流方案，然后为了简化开发体验，dva 还额外内置了 react-router 和 fetch，所以也可以理解为一个轻量级的应用框架。 官网文档：https://dvajs.com/ 简单快速入门后，有一个课堂实战 这个实战就是用dvajs 写一个列表，包含删除按钮，点删除按钮后延迟 1 秒执行删除。 当然，我也完成了这个简单的Demo： https://gitee.com/VampireAchao/simple-dva.git 并顺手练习了一下并行、竞争等概念 还是很有意思的

活着就意味着必须做点什么，请好好努力。——《地下》 我们知道React等单页应用在开发时，页面变化依赖于state 随着 JavaScript 单页应用开发日趋复杂，JavaScript 需要管理比任何时候都要多的 state（状态）。 这些 state 可能包括服务器响应、缓存数据、本地生成尚未持久化到服务器的数据，也包括 UI 状态，如激活的路由，被选中的标签，是否显示加载动效或者分页器等等。 管理不断变化的 state 非常困难。如果一个 model 的变化会引起另一个 model 变化，那么当 view 变化时，就可能引起对应 model 以及另一个 model 的变化，依次地，可能会引起另一个 view 的变化。直至你搞不清楚到底发生了什么。state 在什么时候，由于什么原因，如何变化已然不受控制。 当系统变得错综复杂的时候，想重现问题或者添加新功能就会变得举步维艰。 如果这还不够糟糕，考虑一些来自前端开发领域的新需求，如更新调优、服务端渲染、路由跳转前请求数据等等。前端开发者正在经受前所未有的复杂性，难道就这么放弃了吗？当然不是。 这里的复杂性很大程度上来自于...

有的东西被遗忘，有的东西销声匿迹，有的东西死了，而其中几乎不含有悲剧性因素。——《寻羊冒险记》 今天用typescript写了个Generator函数自动执行器： 1234567891011export function runGenAuto(fn: Function) { let gen: Generator<Function> = fn() function next() { let result = gen.next() if (result.done) { return result.value } return result.value(next) } return next();} 为了测试效果，我们定义一个Generator函数，这个函数用于将URLSearchParams转换成一般对象 当然直接遍历不用generator也能实现上述需求，但这里主要是为了测上方的自动执行Generator...

一年好景君须记，最是橙黄橘绿时。——苏轼 聊聊这仨很常用的函数 我相信很多人也跟我一样也有个误区，错把replace当成replaceFirst，把replaceAll当成replace 实际上，replace函数会替换掉满足字符串中所有出现过第一个参数中的值的地方 例如： 1234 String string = "ruben love strawberry"; String replace = string.replace("r", "");// uben love stawbey 如果我们只需要替换第一处，则需要使用replaceFirst 例如： 1234 String string = "ruben love strawberry"; String replaceFirst = string.replaceFirst("[A-Za-z0-9]", "");// uben love strawberry 并...

向着清风吟唱的歌手，还会对着运转的宇宙歌吟。——纪伯伦《先知》 我们使用Stream收集操作收集元素时，会遇到对规则进行分组后，对每一组的数据还要进行处理的情况，这时候我们可以使用Collectors.collectingAndThen处理，例如我下面本来分组后得到一个Map<String,List<String>>，但我将分组后每一组的结果转换为了JSON格式的String 12345678910111213import java.util.Map;import java.util.stream.Collectors;import java.util.stream.Stream;import com.alibaba.fastjson.JSON;class Scratch { public static void main(String[] args) { Map<String, String> collect = Stream.<String>empty().collect(Collec...

人活在世，不过一场美丽的寄居。——简嫃曾 我们可以使用image-comparison来在java中进行两个文件的对比： 项目地址：https://github.com/romankh3/image-comparison 它会自动生成对比后带红框的对比图，还能返回这些正方形的信息 首先引入GAV： 12345<dependency> <groupId>com.github.romankh3</groupId> <artifactId>image-comparison</artifactId> <version>4.4.0</version></dependency> 使用： 123456789//load images to be compared: BufferedImage expectedImage = ImageComparisonUtil.readImageFromResources("expected.png"); ...