随笔分类 - JavaScript
摘要：TypeScript 设计的初衷是 JavaScript + Types，所有 TypeScript 的特性不改变运行时的行为 反过来说，如果在 TS 代码中去掉静态类型，应该得到一份完整有效的 JS 代码 这样的好处在于，我们可以通过 ESbuild 而不是 tsc 完成我们的 TS 代码到 JS
阅读全文
摘要：一个普通的晚上，普通的我听着普通disco回到普通的家，不普通的老婆让我做一件普通的事情：导数据 因为种种原因，只能在前端通过控制台脚本导数据，而且有这几种类型的数据： 1. 查询列表接口，并导出一个 Excel 表格； 2. 查询列表接口，分别将每一行数据导出一个文本文件； 3. 查询列表接口，基
阅读全文
摘要：做报表的时候偶尔会遇到这种需求： 为了补齐长度，在一个数字字符串前面添加 N 个 0 占位 举个例子： 单元格需要展示 6 位数字，如 '123456' 但后端返回的数字是 123，这时候就要在前面补 0，得到 '000123'，使其长度为 6 那就需要实现一个方法，基于 number 类型的参数
阅读全文
摘要：某个阳光明媚的下午，我正悠闲的品着刚买的滇红，测试小姐姐突然急匆匆的找到我： “快看一下群里，文章编辑器出问题了！” 我手中的滇红瞬间不香了，抓了抓所剩无几的头发，开始了漫长的 Debug 环节 经过排查，发现问题的根源居然是一段正则表达式... 一、问题重现 // 在浏览器控制台中运行下面的代码
阅读全文
摘要：这个递归不太难 相信大家都知道什么是递归，但在实际开发的时候用过多少次递归呢？ 程序的世界有句话叫“人用循环，神用递归”，很多情况下我们都会优先使用循环而不是递归。我和几个朋友聊过，他们的看法是：“相比循环而言，递归性能更差，而且更不可控，容易出问题。” 捕获关键词“问题”，启动“解决”模式...
阅读全文
摘要：最近在开发一个批量展示图片的页面，图片的自适应排列是一个无法避免的问题 在付出了许多头发的代价之后，终于完成了图片排列，并封装成组件，最终效果如下 一、设计思路 为了使结构清晰，我将图片列表处理成了二维数组，第一维为行，第二维为列 render() { const { className } = t
阅读全文
摘要：最近和做技术的朋友聊天的时候，发现自己居然不能将函数式编程思想讲清楚，于是做一次复习 一、函数是“一等公民” 常常都能听到这么一句话：在 JavaScript 中，函数是“一等公民”，这句话到底意味着什么？ 在编程语言中，一等公民可以作为函数参数，可以作为函数返回值，也可以赋值给变量 —— Chri
阅读全文
摘要：众所周知，Vue 2.x 的数据绑定是通过 defineProperty。而在 Vue 3.x 的设计中，数据绑定是通过 Proxy 实现的，这两者到底有何异同？ 一、definePropety defineProperty 是 Object 的一个方法，可以在对象上新增或编辑某个属性，可编辑的内容
阅读全文
摘要：作为一名前端工程师，debugger 和 console.log 应该是最常用的调试命令 但 console.log 除了打印一条普通的 message 之外，还能做一些有意思的事情 比如打印一条不普通的 message 一、console.log console.log 除了常规用法之外，还可以通
阅读全文
摘要：一、环境变量 由于众所周知的原因，在国内访问 Flutter 有时可能会受到限制，所以在开发之前，需要先配置环境变量 MacOS: 编辑 ~/.bash_profile 文件 vim ~/.bash_profile 这里用的是 vim 来编辑，如果不习惯，可以将 vim 替换为 open open
阅读全文
摘要：1. Array.prototype.forEach() forEach() 是一个专为遍历数组而生的方法，它没有返回值，也不会改变原数组，只是简单粗暴的将数组遍历一次 参数： callback() 必填 在数组每一项上执行的函数 thisArg 可选 执行回掉时用作 this 的对象 如果传入
阅读全文
摘要：一、初识 MessageChannel 对象 通过构造函数 MessageChannel() 可以创建一个消息通道，实例化的对象会继承两个属性：port1 和 port2 port1 和 port2 都是 MessagePort 对象，在这里是只读的，无法对其进行字面量赋值 不过可以给 port
阅读全文
摘要：ECMAScript 中的相等操作符由两个等于号 ( == ) 表示，如果两个操作数相等，则返回 true。 相等操作符会先转换操作数（通常称为强制转型），然后比较它们的相等性。 在转换不同的数据类型时，相等操作符遵循下列基本规则： 1. 如果有一个操作数是布尔值，则在比较相等性之前，将其转换为数值
阅读全文
摘要：- “插入自定义标签是什么鬼？” - “比如你要插入一个<wise></wise>的标签...” - “什么情况下会有这种需求？” - “得罪了产品的情况下...” 一、需求背景 某天，产品找到我，发生了如下对话 PM：“哇，研发小哥哥你今天好帅啊～” 我：“说人话。” PM：“我有一个需求。”
阅读全文
摘要：为了摆脱咸鱼的身份，我给自己定了一个开源项目的目标 于是抽空写了一个 textarea，打算发布到 npm 的时候却遇到了问题 之前用 vue-cli 2.x 的时候，打包配置项非常透明，可以很容易的修改 但升级到 vue-cli 3.x 之后，反而一脸懵逼。。。 在踩了一天的坑之后，终于成功发布了
阅读全文
摘要：移动端的项目经常会引入手势库来实现拖拽 不过如果只是一两个页面用到拖拽，再引入一个手势库就很不划算 最近的项目中就有这么一个需求： 因为就这一个地方需要拖拽，所以我就没有引入第三方库 移动端的拖拽有两种主流的实现方案： 1. 将元素设置为固定定位，然后在拖拽的时候修改其定位，实现拖拽的效果； 2.
阅读全文
摘要：中午和同事吃饭，席间讨论到数组去重这一问题 我立刻就分享了我常用的一个去重方法，随即被老大指出这个方法效率不高 回家后我自己测试了一下，发现那个方法确实很慢 于是就有了这一次的高性能数组去重研究 一、测试模版 数组去重是一个老生常谈的问题，网上流传着有各种各样的解法 为了测试这些解法的性能，我写了一
阅读全文
摘要：继 Browserify、Webpack 之后，又一款打包工具 Parcel 横空出世 Parcel.js 的官网有这样的自我介绍 “极速零配置Web应用打包工具” 简单接触了一下，单从效率上来说，确实要比 webpack 强上不少，可坑也挺多，未来升级之后应该会逐渐普及 官方文档：https://
阅读全文
摘要：用 js 画工作日历的时候，需要用 js 计算指定月份一共有多少天 在网上找了些方法，都比较繁琐，后来灵机一动，想到一个偷懒的办法，分享一下 一、原理分析 要想得到某月有多少天，只需要获取到当月最后一天的日期就行了 围绕这一思路，灵活调用 setMonth()，getMonth()，setDate(
阅读全文
摘要：最近遇到一个需求，需要点击按钮，复制 <p> 标签中的文本到剪切板 之前做过复制输入框的内容，原以为差不多，结果发现根本行不通 尝试了各种办法，最后使了个障眼法，实现了下面的效果 一、原理分析 浏览器提供了 copy 命令 ，可以复制选中的内容 如果是输入框，可以通过 select() 方法，选中输
阅读全文
浙公网安备 33010602011771号