分类下相关文章
2022-09-26 · 阅读 438 · 字数 323
用习惯了 golang 的 gofmt 自动格式化代码工具，迫切需要其他语言的自动 format 功能。发现 js 也有类似的工具 prettier。 https://prettier.io/ 用了一下，还可以。至少可以自动帮我补充行尾的分号，及自动换行。但是也有非常不爽的地方，就是会把你多行对齐的注释毁掉。而且官方维护团队态度恶劣，对这个问题连讨论的余地都不留。远不如 gofmt 优雅。 全局安装 虽然官方推荐每个项目独立安装一个，且做好不同的配置，但是我基本都一个人开发项目，所以也不需要兼顾别人的感受，全局安装更方便。 sudo npm install -g prettier VIM 中 ...
2022-08-04 · 阅读 832 · 字数 132
TypeScript 最恶心的地方在于让写 js 完全丧失了灵活性。今天发现之前写的 antd 代码里一堆 TypeScript 报错信息，虽然代码能正常编译运行。 报错代码为第二行： function slugHandler() { console.log(formRef.current.getFieldValue("Title")); } 报错信息为： Object is possibly 'null' 解决方法非常类似 Kotlin 的语法糖。 方法一：non-null assertion operator ! formRef.current!.getF ...
2022-07-12 · 阅读 674 · 字数 47
父级访问子 iframe 的方式 const iframe = document.querySelector('iframe'); const iDoc = iframe.contentWindow.document; iDoc.querySelector('#text') 子 iframe 访问父级 window.parent.document.querySelector("#text") postMessage 通信参考 完美解决iframe父子间的通信问题 ...
2022-06-03 · 阅读 1372 · 字数 254
示例代码 const maxWidth = imgs.reduce((m, x) => Math.max(m, x.width), 0); 其功能是计算一组图片的最大宽度。 但是看起来很难理解。 可读性更好的 reduce 用法 const maxWidth = imgs.reduce( (previousValue, img) => Math.max(previousValue, img.width), 0 ); 其实就是遍历数组中的每一项，通过函数逐一比对，最终返回一个最大/小值。 reduce 参数说明 reduce() 方法接收一个函数作为累加器，数组中的每个值（ ...
2022-05-03 · 阅读 3404 · 字数 770
之前只用过 webpack 进行 js 项目打包，但其实都是用的现成的脚手架，不需要过多的自己配置。 这次是纯手动创建的项目，并没有任何脚手架代码及配置，所以我想尝试自己配置一遍。 为何选择 esbuild 粗略调研了一圈，webpack, rollup, vite, esbuild。 webpack 确实最强大，我甚至花了两天时间看了一本书，虽然学到不少，但用不到那么多配置 vite 感觉是人为推广，跟风严重，不太想去了解，而且开发环境是基于 esbuild。我对知乎上一致好评的技术选型有天然的抵触情绪 rollup 官方教程不错 我决定尝试 esbuild，仅仅是因为 esbuild 是 ...
2022-04-01 · 阅读 888 · 字数 152
例如展示合作伙伴公司的 logo 等。 轮播的英文到底是什么 slick 光滑的 flick 轻弹，拂去 carousel 旋转木马 Flicking https://naver.github.io/egjs-flicking/ 简洁，不需要依赖 jQuery 韩国产 自适应效果好 目前没有遇到坑 在 staticfile.org 中搜素时，使用 egjs-flicking。 目前就使用这个了。 同样也适用于顶部大 banner 的轮播，参考 https://naver.github.io/egjs-flicking/Showcases slick https://kenwheeler ...
2022-05-02 · 阅读 1375 · 字数 246
我在写一个自动选课的插件，需要先扫描几千个课程，然后统计出所有课程所属的类目。 这个类目，需要去重，然后列举出来，如果能用 python set 类型来统计，就非常方便了。 但是不知道 js 是否支持这样的数据类型。 查了一下，果然已经支持。在 Chrome 里测试了一下，非常方便 > let s = new Set(); > s Set(0) {} > s.add(1) Set(1) {1} > s.add(2) Set(2) {1, 2} > s.add(3) Set(3) {1, 2, 3} > s.add(3) Set(3) {1, 2, 3} / ...
2021-09-08 · 阅读 1056 · 字数 159
js 中使用 float 浮点数类型，会发现运算时结果表示出人意料 问题现象 2.4 - 2.25 > 0.1499999999999999 0.1 + 0.2 > 0.30000000000000004 看来这是一个经典的问题。 解决方法一 转换成整数进行计算 (2.4 * 100 - 2.25 * 100) / 100 > 0.15 解决方法二 如果计算不求精确，四舍五入即可 (0.1 + 0.2).toFixed(2) > "0.30" 方案一的漏洞 2.3 * 100 > 229.99999999999997 2.3 * 10 ...
2021-08-21 · 阅读 1312 · 字数 38
例如，我想用 js 实现将数字 1000，显示成 1,000 的格式。 实现方法 let x = 100000000000000; x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); > "100,000,000,000,000" 参考 https://stackoverflow.com/questions/2901102/how-to-print-a-number-with-commas-as-thousands-separators-in-javascript ...
2021-08-02 · 阅读 2082 · 字数 116
由于要跟蓝牙设备交互，在传递浮点数时，想用 ascii 进行编码。 问题来了，22.22 这样的浮点数，用 ascii 码表示时，如何进行 array buffer 与 string 的相互转换。 解析数据实现代码 function ab2str(buf) { return String.fromCharCode.apply(null, new Uint8Array(buf)); } 由于是用了 AscII 编码 (256 个字符)，所以一个字符是用 1 个字节，即 8 bit 表示。 这里用 Uint8 来解析。 参考 https://stackoverflow.com/questio ...
2021-07-30 · 阅读 2120 · 字数 227
返回的数据是一个字节，即 8 bit 位，每一个 bit 代表一个设备状态的开启与否。 即 8 个不同设备的开启状态。 如何用 Javascript 来解析二机制状态位呢？ 开关作用 可以通过 dataView.getUint8(N) 将返回的一个字节数据 array buffer 转换成整数，例如下面的 flags。 然后通过开关位比对来判断其状态： var flags = 5; // 二进制的0101 if (flags & 4) { // ... } // 0101 & 0100 => 0100 => true 注意，这里是单个与符号，两个就是逻辑与符 ...
2021-06-24 · 阅读 5895 · 字数 144
我想将小程序中获取到的日期和时间，转换成 UTC 时间，格式如： 2021-12-25T08:08:08Z 好方便传输给后台，进行 InfluxDB 时间区间过滤。 转换方法 先拼接成不加 Z 结尾的字符串。不加 Z 代表是当前 locale 对应的市区。 > let d = new Date(Date.parse("2019-01-01T00:00:00")); Tue Jan 01 2019 00:00:00 GMT+0800 (中国标准时间) d.toISOString() "2018-12-31T16:00:00.000Z" d.t ...
2021-04-01 · 阅读 3936 · 字数 189
例如在一段 Ant Design Pro V5 的代码中看到： import { Button, message, Input, Drawer } from 'antd'; import React, { useState, useRef } from 'react'; import { useIntl, FormattedMessage } from 'umi'; import { PageContainer, FooterToolbar } from '@ant-design/pro-layout'; import type { ProColumns, ActionType } from ...
2021-01-31 · 阅读 9440 · 字数 569
在 tampermonkey 的很多实际使用场景中，需要在模拟点击之后，等待界面变化，或者数据返回，此时就需要用到 setTimeout。但是如果是一系列的点击等待，就需要进行 setTimeout 嵌套，或者 setTimeout 时间进行倍数增长，代码可读性非常低。 所以，我想找一种 setTimeout 同步的写法，以提高代码的可维护性。 测试代码 (function() { 'use strict'; function wait(ms) { return new Promise((resolve, reject) => { ...
2021-01-27 · 阅读 1918 · 字数 160
由于 58 同城的开放平台申请接口权限一直处于审核中，而想要用的一个接口没有使用文档，也无法联系到人类客服询问，只能采取浏览器插件的方式做数据导出。 58同城管理后台为了防爬虫，做了诸多的防爬策略，其中一种就是没有明确的 class 和 id。 例如，管理后台的全选按钮： <span class="t-g-checkbox-font">全选</span> class 选择的话符合条件的很多。只能通过 inner text 来匹配。 解决方法 Array.from(document.querySelectorAll('span.t-g-checkbo ...