scrcpy源码: https://github.com/Genymobile/scrcpy 教程： https://www.iplaysoft.com/scrcpy.html https://blog.csdn.net/was172/article/details/99705855 问题解决：https://findweixin.com/videos/scrcpy 安装 adb 环境brew cask install android-platform-tools 安装 scrcpybrew install scrcpy 步骤建议使用 手机 usb 线链接, 以下方式为 usb 链接方式，环境为 安卓手机 usb 线连接电脑 打开 chrome://inspect/#devices，Remote Target 下有链接手机时可进行启动 scrcpy 直接启动 启动不成功时，在 chrome/inspect 页面下多刷新几次在手机上同意调试，多试几次可成功 adb reverse tcp:3001 tcp:3001 启动对应的服务 可在电 ...

第一步，需要先拥有一张 1024 的 png，可以从 iconfont 上或者任意喜欢的 png 图片下载第二步，在命令行里执行 mkdir tmp.iconset或者采用新建文件夹方式命名一个名字为tmp.iconset 的文件夹第三步，在 png 图片的同目录下执行如下命令，生成一张名为 pic.png 的图片，即为你想要生成 icon 的图片sips -z 16 16 pic.png --out tmp.iconset/icon_16x16.pngsips -z 32 32 pic.png --out tmp.iconset/icon_16x16@2x.pngsips -z 32 32 pic.png --out tmp.iconset/icon_32x32.pngsips -z 64 64 pic.png --out tmp.iconset/icon_32x32@2x.pngsips -z 128 128 pic.png --out tmp.iconset/icon_128x128.pngsips -z 256 256 pic.png - ...

Typescript 分享 代码例子 为什么要使用 TypeScript微软推出 TypeScript 主要是为了实现两个目标。 为 JavaScript 提供可选的类型系统：TypeScript 会在编译代码时进行严格的静态类型检查，这意味着你可以在编码阶段发现可能存在的隐患，而不必把它们带到线上。 兼容当前及未来的 JavaScript 的特性：TypeScript 会包括来自 ES 6 和未来提案中的特性，比如异步操作和装饰器；也会从其他语言借鉴某些特性，比如接口和抽象类。 基础类型基础在了解 ts 的各种基本类型之前，首先先了解一下类型语言。 在强类型语言中，当一个对象从调用函数传递到被调用函数时，其类型必须与被调用函数中声明的类型兼容强类型语言不允许改变变量的数据类型，除非进行强制类型转换弱类型语言中，变量可以被赋予不同的数据类型 静态类型语言：在编译阶段确定所有变量的类型（如 c++） 1. 对类型要求极其严格 2. 立即发现错误 3. 运行时性能较好 4. 自文档化 动态类型语言：在执行阶段确定所有变量的类型（如 js） 1. 对类型非常宽松 2. Bu ...

es 语法es2020 种草语法空白合并运算符?? let person = { profile: { name: "", age: 0 }};console.log(person.profile.name || "Anonymous"); // Anonymousconsole.log(person.profile.age || 18); // 18~~~~ console.log(person.profile.name ?? "Anonymous"); // ""console.log(person.profile.age ?? 18); // 0 可选链接运算符可选链 可让我们在查询具有多个层级的对象时，不再需要进行冗余的各种前置校验。 ?. let person = {};console.log(person.profile.name ?? "Anonymous"); // person.profil ...

前端中主要用到e2e测试和单元测试 unit测试是程序员写好自己的逻辑后可以很容易的测试自己的逻辑返回的是不是都正确。 e2e代码是测试所有的需求是不是都可以正确的完成，而且最终要的是在代码重构，js改动很多之后，需要对需求进行测试的时候测试代码是不需要改变的，你也不用担心在重构后不能达到客户的需求。目前常用的工具有，selenium， puppeteer，phantom，protractor（angular）， Nightwatch（Vue）等等 TDD：测试驱动开发 BDD：行为驱动开发 哪些情况下你可能需要写前端UT？ 来做一组判断题（有一个yes就需要写） 你写的是个util类，是会被其他类调用的那种？ 你写的是一个公共component，是会被其他工程调用的那种？ 你写的是一个开源项目 哪些情况需要写e2e（如果你的答案里有2个以上的yes，可能e2e AT（e2e自动化测试）并不是现阶段必须要引入的） 测试团队是否兵强马壮 （基于人海战术的人肉e2e测试） 产品UI是否相对不稳定，经常大改 （改e2e case都来不及） 测试团队是否已经熟练掌握自动化测试技术 ...

为什么出现React Hooks React 需要为共享状态逻辑提供更好的原生途径。为了避开嵌套地狱。 复杂组件变得难以理解 Hook 使你在非 class 的情况下可以使用更多的 React 特性 Hooks APIuseState 在函数组件里面使用 class 的 setState 使用： const [name, setName] = useState("rose"); useEffect 在函数组件里面使用 class 的生命周期函数，是所有函数的合体 使用： // 基础使用useEffect(()=>{ ...}) useEffect最后，加了[]就表示只第一次执行，同 componentDidMount useEffect(() => { const users = "获取全国人民的信息()";}, []); useEffect最后，加[]，并且[]里面加入了字段，就表示这个字段更改了，当前effect才执行 useEffect(() => { ...

读 《是谁出的题这么难，到处都是正确答案》摘抄记录。 人类从历史中学到的唯一教训，就是无法从历史中吸取任何教训。 明明曾经优秀，怎么就突然不优秀了，拖后腿了呢。这有两说，一说是企业冷血，卸磨杀驴，嫌弃老人成本太高，又没有年轻人肯卖命；另一说是，一些老白兔们不知道追求进步，躺在功劳本上坐吃山空，还占着位置阻碍了新人的前进。那么根据不同人的屁股位置，会有不同的选择。你猜我站哪一边？我不站立场，我只站事实，事实只有一句话，优秀的门槛越来越高。 如何实现视觉和交互 -> 交互如何触发逻辑 -> 逻辑如何影响视觉的变化。 这世上有天赋的局限，有命运的束缚；这世上，有很多我们做不到的事，可是，我们可以试试不用“能力问题”做原宥、逃避的借口。你若不去推动自己的边界，又如何知道自己到底可以走多远呢？ 没有什么比“明白现实世界如何运作”并且“如何应对它”更重要的事。而你在这个过程中的心态，决定了所有的差别。（There is nothingmore important than understanding how realityworks and how to deal with it. ...

positionposition 属性用来指定一个元素在网页上的位置，一共有5种方式，即position属性主要有五个值。 static static是position属性的默认值。如果省略position属性，浏览器就认为该元素是static定位。 这时，浏览器会按照源码的顺序，决定每个元素的位置，这称为”正常的页面流”（normal flow）。每个块级元素占据自己的区块（block），元素与元素之间不产生重叠，这个位置就是元素的默认位置 注意，static定位所导致的元素位置，是浏览器自主决定的，所以这时top、bottom、left、right这四个属性无效。 relative,absolute,fixed 三个属性的共同点是 ”都是相对于某个基点的定位“，不同之处在于”基点不同“ relative relative表示，相对于默认位置（即static时的位置）进行偏移，即定位基点是元素的默认位置。 它必须搭配top、bottom、left、right这四个属性一起使用，用来指定偏移的方向和距离。 absolute absolute相对于上级元素（一般是父元素）进行偏移， ...

大O时间大O表示法指出了算法有多快。例如，假设列表包含n个元素。简单查找需要检查每个元素，因此需要执行n次操作。使用大O表示法。这个运行时间为O(n)。大O表示法指的并非以秒为单位的速度。大O表示法让你能够比较操作数，它指出了算法运行时间的增速。 算法的速度指的并非时间，而是操作数的增速。 谈论算法的速度时，我们说的是随着输入的增加，其运行时间将以什么样的速度增加。 算法的运行时间用大O表示法表示。 O(log n)比O(n)快，当需要搜索的元素越多时，前者比后者快得越多。 递归编写递归函数时，必须告诉它何时停止递归。正因为如此，每个递归函数都有两部分:基线 条件(base case)和递归条件(recursive case)。递归条件指的是函数调用自己，而基线条件则 指的是函数不再调用自己，从而避免形成无限循环。 递归主要使用栈，使用栈虽然很方便，但是也要付出代价:存储详尽的信息可能占用大量的内存。每个函数调 用都要占用一定的内存，如果栈很高，就意味着计算机存储了大量函数调用的信息。在这种情况 下，你有两种选择。  递归指的是调用自己的函数。 每个递归函数都有两个条件:基线条 ...

参考文章 泛型泛型是什么设计泛型的关键目的是在成员之间提供有意义的约束，这些成员可以是：类的实例成员、类的方法、函数参数和函数返回值。 泛型接口interface Identities<V,M> { value: V; message: M;}identity<T, U> (value: T, message: U): Identities<T, U> { console.log(value + ": " + typeof (value)); console.log(message + ": " + typeof (message)); let identities: Identities<T, U> = { value, message }; return identities;}this.identity('111111111', 1) 泛型类我们在什么时候需要使用泛型呢？通常在决定是否 ...