叶一一yyy的博客_趣学前端(2)

小程序自动发版探索，两个优秀的第三方库该如何选择？且听我娓娓道来【玩转前端】

前情提要目前的多端项目，在代码发布的时候，对于不同的端，需要进行不同的操作。尤其小程序端，每次都要在开发者工具中进行一次：上传->填写版本信息->提交审核(确定上线时)既然手动这么麻烦，能不能做成自动的？让开发节省重复操作时间，同时避免手动操作遗漏的可能性。我翻阅资料，发现已经有大佬实现了上面的功能，我只需要站在巨人的肩膀上，结合实际需要，做些细微的调整即可。功能计划目前想要的功能比较

ci

taro

微信小程序

原创 2024-03-20 10:04:46 80 阅读 yyds干货盘点

standardBrowserEnv 标准浏览器中对 cookie 的读写删操作【玩转源码】

字符串

数组

ios

原创 2024-03-11 09:54:53 31 阅读 1点赞 yyds干货盘点

正确使用classnames库的方式摸索【玩转React】

前言我们日常开发使用的是React框架，主要采用JSX写法，而classnames与JSX十分般配，组合使用效果极佳，可以实现class的动态绑定。接下来，通过对 classnames 源码的阅读，来进一步了解classnames出现的契机及其用法。听说你叫 className讲 classnames 之前，科普一点关于它「兄弟」 className 的知识点。万物皆有源之 JSX众所周知，在 R

CSS

字符串

JSX

原创 2024-03-08 09:36:02 553 阅读 1点赞

与热爱同行的源码阅读，想要掌握它、运用它，如何开启是关键【玩转源码】

前言antd 5.0 正式发布已经有一段时间了，除了对它新特性感兴趣之外，它的源码我十分好奇，一直以来都没机会“参观”一下。antd 的源码内容还是很多的，想要完整阅读不是一件简单的事情。此前，我虽然有过几个完整的阅读经验，但是源码项目相对简单，阅读过程快速且顺畅。所以我一直想办法摸索一份源码阅读的开启经验，好让自己更好的掌握源码、运用源码。通过一段时间的摸索，我发现开启前的准备工作也同样重要，于

源码阅读

css

开发者

原创 2024-03-07 09:46:11 84 阅读 1点赞 yyds干货盘点

异步请求返回处理之finally的用途，代码规范摸索【玩转JavaScript】

前言最近在改动老代码时，发现了一个有趣的现象。对于异步请求返回结果处理中，使用finally做兜底处理，不同的页面并不统一，也就是有的页面使用了，有的页面没使用，没使用的页面增加了额外的失败的处理。所以finally到底要不要统一？本着代码规范化原则的思维，我准备一探究竟。finally 听说好用？编程欢乐小剧场某：来吧，是时候做个决定了。一：我不知道怎么回答，多说的讯息。某：我们的异步请求，到底

数据

抛出异常

逆向思维

原创精选 2024-03-06 09:32:16 244 阅读 1点赞 yyds干货盘点

一次七拐八折的 Git 仓库协作者用户名的获取过程

背景目前我们的多端项目中的小程序开发，每次都要手动在开发者工具中进行上传操作，并填写版本信息。我计划实现小程序端的自动化发布，正好川哥有一篇相关工具库的文章。文章中提到了两个第三方库，我都可以直接用。但是，终于要提到本篇的主题了。在自动化发布之后，开发者为 ci 机器人的名称，如下图：这样一来，没办法知道具体是哪位开发者提交的版本。于是，我接受建议，采用获取 Git 仓库里协作者用户名+拼接到项目

小程序

原创 2023-12-10 14:27:47 56 阅读 yyds干货盘点

源码逆思维，从 remote-git-tags 的用途反向推导实现方案【玩转源码】

前言不知不觉中，源码的文章也写了几期了，每一期都能多少有些收获。原本，我在看 remote-git-tags 源码之前，计划带着 3W 的思维去看。但是，我有了一瞬间的停顿。这个库的源码不是很多，是不是可以改变个思维。当已知库的实际用途的情况下，是不是可以反向推导出实现方案。没准，过程中能时不时来个惊喜。功能测试先来看一下，remote-git-tags 具体是干什么的。1、先生成 package

git

远程仓库

github

原创 2023-12-09 20:29:05 71 阅读 yyds干货盘点

两种图片类型的 base64 格式转换

常用图片资源类型我们项目里目前主要有三种图片资源类型第三方图片资源、本地SVG、本地base64这三种对应不同的使用场景：对于图片画质要求较高、图片内容较复杂的，一般都是将图片资源放到第三方图床上，页面展示通过加载远程地址的方式；小的 icon 图标，首选 SVG 格式，文件体积小，加载更快速。但是实现成本比较大，一般情况需要设计师的支持；base64，某些特殊功能实现下需要的格式，不常见，但是

读取文件

原创精选 2023-12-08 12:28:31 465 阅读 yyds干货盘点

antd 5.0 定制主题如此酷炫，我决定开启 @ant-design/cssinjs 阅读之旅

前言antd 5.0 正式发布已经有一段时间了，发布当天，一心二用的看完直播。很喜欢整个设计，有种简约快乐工作的感觉，某些功能设计初衷也给了我一些启发。antd 5.0 提供的主题定制挺酷炫的，加之我最近对「CSS-in-JS」很感兴趣。于是迫不及待的打开了它的源码，准备研究一番。我大部分情况下都是通过碎片化的时间来研究技术，所以时间合理配置和任务合理分块，一直是我常采用的方式。加上对源码阅读的

源码

原创精选 2023-12-06 12:20:08 504 阅读 yyds干货盘点

实用功能分享，弹窗展示形式的6位卡号输入功能实现【玩转业务功能】

前言本篇主要分享如何实现一个弹窗展示形式的6位卡号输入功能。6位卡号输入前面是根据卡的不同状态的流程实现，接下来，讲讲卡号输入的交互实现。卡号输入 UIUI 的呈现，会影响前端的实现方式。这里 UI 设计成弹出层的方式，每个数字都是一个方框。开发前在开发前，我列了一些可能出现的问题。比如，不同手机的光标样式、输入时页面抖动、input无法只输入数字等。所以我在实现的时候，有针对性的规避前面罗列的问

移动端

react

数字输入弹窗

原创 2023-12-04 12:26:53 140 阅读 yyds干货盘点

yocto-queue 库如何实现替代数组【玩转源码】

前言前面提到了可以使用yocto-queue库代替Array操作数组，本篇则深入源码了解一下yocto-queue是如何实现替代数组的。yocto-queue源码分析源码中的代码量相对较少，读起来会比较轻松，看似可以琢磨的点少，其实不然。代码中包含知识点主要包括类的属性、链表与数组的对比、队列、自定义迭代器等，容我细讲。git 地址：yocto-queueNode 类node 类的作用是在新增操作

数组

迭代器

链表

原创 2023-12-03 18:39:22 188 阅读 yyds干货盘点

较大数据量数组，操作执行方法【玩转JavaScript】

前言对于数组类型的数据处理，对 Array 方法的时间复杂度的问题，没有深入研究。最近有时间正好研究了一把，看有没有比较好的替代方式。前端关于性能问题，一直十分关注。提升性能的方式有很多，有时候一个简单的数据操作，前端开发者们也会“货比三家”，尤其是对数据的处理，总是在对比性能，时间复杂度是衡量标准之一。后来发现了一个第三方库yocto-queue 库或许可以解决我的困惑，开研究一下吧。yoct

队列

前端

JavaScript

原创 2023-12-01 09:37:32 140 阅读 yyds干货盘点

灵感闪现的 JS 实验，** 运算符怎么用【玩转JavaScript】

前言某天正在研读源码，突然发现一个有趣的代码段。这个代码段里包含一个运算，运算符是“**”。一般优先级相同的运算符做运算的时候，从左到右运算，不会添加额外的符号，比如小括号。通常是不同优先级的运算符做运算，才会为了保障运算结果的正确，添加小括号。所以这看似多余的代码，但是并不影响代码的正常运行，这是什么情况？让我们来一探究竟吧。** 运算符，相同运算符还要小括号？编程欢乐小剧场某：咦？一：干什么？

运算符

优先级

结合性

原创 2023-08-23 09:11:11 229 阅读 1点赞 yyds干货盘点

精读 classnames源码，解读重点功能的实现【玩转源码】

前言本文主要讲解 classnames 相关的知识点。对 classnames 源码，按照功能模块进行解读。尤其对于源码中关键代码从实现层面做了解读。在总结过程中，对 CSS-in-JS 写法有了不同的想法，结合大佬的文章，将想法记录在了文末。classnames 的原理源码目录功能模块目录结构classnames ┣ ?benchmarks ┃ ┣ ?fixtures.js ┃ ┣ ?

classnames

源码阅读

原创 2023-08-19 19:00:40 120 阅读 1点赞 yyds干货盘点

formDataToJSON 抽丝剥茧 formData 与 Object 的转换【玩转源码】

前言通过axios 源码阅读，实现formDataToJSON 抽丝剥茧 formData 与 Object 的转换，接下来详细分享整个过程。formDataToJSON 抽丝剥茧 formData 与 Object 的转换FormData 对象FormData 对象用以将数据编译成键值对，以便用XMLHttpRequest来发送数据。FormData 对象主要用于发送表单数据，但亦可用于发送带键

FormData

源码阅读

原创 2023-08-17 10:12:13 273 阅读 1点赞 yyds干货盘点

业务功能经验分享，关于后台系统的数据权限的摸索【玩转前端】

逃坑威龙：来时无声，去时留踪最近踩了几个不常见的坑，人虽然没emo，但是填坑那几天的精气神到底是有些不足。这些天的经历过于丰富，一时间想不到语言去形容。所以我画了幅图，并取了个好听的名字——"逃坑威龙"。虽然不排除，今后还会经历踩坑、填坑、再入新坑的循环。至少，这个短暂的时期内，我是处于写"万字感言"的阶段。于是有了前一篇代码设计闭坑思路，也有了今天这篇数据权限的思考。数据权限：可算是触发隐藏副本

权限控制

原创 2023-08-15 09:39:21 150 阅读 1点赞 yyds干货盘点

每期必做的开发设计，来一场合理性探索吧【玩转前端】

想找「神之一手」？《棋魂》是我很喜欢的一部电视剧，里面的主人公之一褚嬴，作为曾经的南梁围棋第一人，一直在找寻领悟围棋的最高境界“神之一手”。“神之一手”，即棋手在下棋的过程中，领悟到了如同神一般的技艺，在关键时刻走出的影响全盘棋局的一步。我不会下棋，却喜欢观看竞技比赛。而作为开发者的我，也一直期待能在编写程序的过程中，设计出令自己“拍案”的“神之一手”。每期都做设计，聊胜于无？很长一段时间内，我都

组件设计

业务功能

原创 2023-08-14 09:36:22 107 阅读 1点赞 yyds干货盘点

实用功能分享，流程简化方案A-归类处理方案实现【玩转业务功能】

大家好，最近整理功能实现方案，整合了一个专栏《实用功能开发指南》，未来会将所有的实用功能方案相关的文章放到这个专栏里。（不排除某个系列单独一个专栏，之后再做其他规划。）这个专栏里的功能，大部分是我再实际工作中遇到的比较有趣或者复杂点，有些实现过程还挺曲折的，我会将我最终采用的方案写出来，希望能给大家提供一些思路。今天主要分享流程简化方案实现方案：归类处理。接下来，我详细的讲讲这个方案的具体实现流程

交互方式

业务开发

前端开发

原创 2023-08-13 09:49:13 75 阅读 1点赞 yyds干货盘点

arrify 源码，19行核心代码分析以及代码之外的收获【玩转源码】

前言我之所以执着于源码源码，一方面是因为去年借着日更，读完了好几本大部头的JavaScript相关书籍，以及对 MDN 中的许多知识点做了梳理和过滤。另一方面，源码共读第一期活动中，开始关注若川大佬，若川大佬提供了大量的源码阅读的方向。正所谓，背有大树好乘凉。计划集中1~2月的精力，进行一波源码阅读。本篇是对 arrify源码的解读，以及在解读过程中，关于实现代码的新想法和 tsd 类型校验工具

arrify

源码阅读

原创 2023-08-11 11:49:29 92 阅读 1点赞 yyds干货盘点

standardBrowserEnv 标准浏览器中对 cookie 的读写删操作【玩转源码】

浏览器

原创 2023-08-09 09:27:19 61 阅读 1点赞 yyds干货盘点

正确使用classnames库的方式摸索【玩转React】

前言我们日常开发使用的是React框架，主要采用JSX写法，而classnames与JSX十分般配，组合使用效果极佳，可以实现class的动态绑定。接下来，通过对 classnames 源码的阅读，来进一步了解classnames出现的契机及其用法。听说你叫 className讲 classnames 之前，科普一点关于它「兄弟」 className 的知识点。万物皆有源之 JSX众所周知，在 R

JSX

React

原创 2023-08-08 12:50:44 543 阅读 1点赞 yyds干货盘点

异步请求返回处理之finally的用途，代码规范摸索【玩转JavaScript】

前言最近在改动老代码时，发现了一个有趣的现象。对于异步请求返回结果处理中，使用finally做兜底处理，不同的页面并不统一，也就是有的页面使用了，有的页面没使用，没使用的页面增加了额外的失败的处理。所以finally到底要不要统一？本着代码规范化原则的思维，我准备一探究竟。文章速度finally 听说好用？编程欢乐小剧场某：来吧，是时候做个决定了。一：我不知道怎么回答，多说的讯息。某：我们的异步请

数据

抛出异常

逆向思维

原创 2023-08-06 21:54:34 294 阅读 1点赞 yyds干货盘点

业务功能探索之条件分支全覆盖，includes能否一劳永逸【玩转JavaScript】

灵感闪现某天，正在认真的敲代码，突然同事问了我一个问题，虽然不难，但是解决方案还是挺有趣的。所以写写这篇文章，详细记录一下实现过程。这个功能来自业务功能中的条件分支全覆盖，原本的做法一个includes轻松搞定，而这次，我心生了一点点疑问：includes真的能一劳永逸吗？JS 实验开始includes 不是一劳永逸的法子？编程欢乐小剧场一：年轻人，为何唉声叹气。某：代码改漏了，太不严谨了。一：哪

数组

条件判断

表单

原创精选 2023-08-05 11:44:32 300 阅读 2点赞 yyds干货盘点

关于模板字面量，我有点好奇它的内部结构【玩转前端】

前言最近翻看源码的时候，发现一些有趣的 JS 的知识点，基于日常的开发经验，我做了一些联想和对比。整个过程充满了乐趣。于是我想，是不是可以延续这种创意带来的学习的乐趣。带的富含创造力夜晚的 buff，确实让我拥有了不错的灵感。这些灵感像繁星一样闪耀着我的夜里，留下一行文字：关于模版字面量，好奇它的内部结构吗？文章速读阅读文章，可以有以下收获：模板字面量的内部结构编程欢乐小剧场这天某正在欢乐的敲代码

字符串

字面量

模版

原创 2023-08-04 09:56:11 82 阅读 1点赞 yyds干货盘点

参加了WOT全球技术创新大会2023，迅速整理了《大前端最佳实践》专题的收获

令人心动的 WOT最近这段时间，我最期待的一件事就是6月17号这天的到来。因为之前51CTO的官网预告了"WOT全球技术创新大会2023"。（这个设计图怪好看的）点击进入大会的官网，大会的举办时间是6月16号、6月17号这两天。16号那天工作没时间，17号这天我挺早出发的。因为到的早，还玩了几个小游戏，拿了好几个小礼物。还有一个比较惊奇的发现，51CTO 有自己的技术期刊叫做《CTO悟道》，现在已

WebAssembly

跨平台

最佳实践

原创 2023-06-18 13:30:37 532 阅读 2点赞 1收藏 yyds干货盘点

arrify 源码阅读 | 19行核心代码分析以及代码之外的收获

前言新年伊始，万象更新，宜登高望远，宜阅读源码。新的一年，第一个 Flag 就是源码阅读。之所以执着于源码，一方面是因为去年借着日更，读完了好几本大部头的JavaScript相关书籍，以及对 MDN 中的许多知识点做了梳理和过滤。另一方面，源码共读第一期活动中，开始关注若川大佬，若川大佬提供了大量的源码阅读的方向。正所谓，背有大树好乘凉。计划集中1~2月的精力，进行一波源码阅读。本篇是对 arr

源码

arrify

原创 2023-06-17 22:47:31 10000+阅读 1点赞 yyds干货盘点

梅开二度的 axios 源码阅读，三千字详细分享功能函数，帮助扩展开发思维

axios

源码

原创 2023-06-15 09:12:21 111 阅读 1点赞 yyds干货盘点

三千字详解 classnames，精读源码，解读重点功能的实现

前言本文主要讲解 classnames 相关的知识点。对 classnames 用法做了详细介绍。对 classnames 源码，按照功能模块进行解读。尤其对于源码中关键代码从实现层面做了解读。在总结过程中，对 CSS-in-JS 写法有了不同的想法，结合大佬的文章，将想法记录在了文末。文章速读阅读本篇文章，你将有如下图中的收获：听说你叫 className讲 classnames 之前，科普一

classname

源码

原创精选 2023-06-14 09:54:17 310 阅读 1点赞 yyds干货盘点

antd 5.0 定制主题如此酷炫，我决定开启 @ant-design/cssinjs 阅读之旅

前言antd 5.0 正式发布已经有一段时间了，发布当天，一心二用的看完直播。很喜欢整个设计，有种简约快乐工作的感觉，某些功能设计初衷也给了我一些启发。antd 5.0 提供的主题定制挺酷炫的，加之我最近对「CSS-in-JS」很感兴趣。于是迫不及待的打开了它的源码，准备研究一番。我大部分情况下都是通过碎片化的时间来研究技术，所以时间合理配置和任务合理分块，一直是我常采用的方式。加上对源码阅读的

UI组件

antd

原创 2023-06-13 09:40:31 1287 阅读 1点赞 yyds干货盘点

三个灵感闪现的 JS 实验，正向和逆向思维齐活了

灵感闪现某天，正在认真的敲代码，看着刚刚写下的这行代码，突发奇想，如果逆向思维去写这行代码会是什么结果。「一生二，二生三」，我从一行代码联想到数行 JS 代码，何不试试看？于是，接下来的故事，顺其自然的发生了。接下来的文字，也自然而然的被创作了出来。文章速读本文从正向和逆向两个不同的思维点出发，实验了几个不同 JS 功能。阅读文章，可以有以下收获：JS 实验开始includes 不是一劳永逸的法子

JavaScript

原创 2023-06-12 09:12:01 90 阅读 1点赞 yyds干货盘点

官方博客	全部文章	热门标签	班级博客
了解我们	网站地图	意见反馈

鸿蒙开发者社区	51CTO学堂
51CTO	软考资讯

51CTO博客

叶一一的博客

小程序自动发版探索，两个优秀的第三方库该如何选择？且听我娓娓道来【玩转前端】

standardBrowserEnv 标准浏览器中对 cookie 的读写删操作【玩转源码】

正确使用classnames库的方式摸索【玩转React】

与热爱同行的源码阅读，想要掌握它、运用它，如何开启是关键【玩转源码】

异步请求返回处理之finally的用途，代码规范摸索【玩转JavaScript】

一次七拐八折的 Git 仓库协作者用户名的获取过程

源码逆思维，从 remote-git-tags 的用途反向推导实现方案【玩转源码】

两种图片类型的 base64 格式转换

antd 5.0 定制主题如此酷炫，我决定开启 @ant-design/cssinjs 阅读之旅

实用功能分享，弹窗展示形式的6位卡号输入功能实现【玩转业务功能】

yocto-queue 库如何实现替代数组【玩转源码】

较大数据量数组，操作执行方法【玩转JavaScript】

灵感闪现的 JS 实验，** 运算符怎么用【玩转JavaScript】

精读 classnames源码，解读重点功能的实现【玩转源码】

formDataToJSON 抽丝剥茧 formData 与 Object 的转换【玩转源码】

业务功能经验分享，关于后台系统的数据权限的摸索【玩转前端】

每期必做的开发设计，来一场合理性探索吧【玩转前端】

实用功能分享，流程简化方案A-归类处理方案实现【玩转业务功能】

arrify 源码，19行核心代码分析以及代码之外的收获【玩转源码】

standardBrowserEnv 标准浏览器中对 cookie 的读写删操作【玩转源码】

正确使用classnames库的方式摸索【玩转React】

异步请求返回处理之finally的用途，代码规范摸索【玩转JavaScript】

业务功能探索之条件分支全覆盖，includes能否一劳永逸【玩转JavaScript】

关于模板字面量，我有点好奇它的内部结构【玩转前端】

参加了WOT全球技术创新大会2023，迅速整理了《大前端最佳实践》专题的收获

arrify 源码阅读 | 19行核心代码分析以及代码之外的收获

梅开二度的 axios 源码阅读，三千字详细分享功能函数，帮助扩展开发思维

三千字详解 classnames，精读源码，解读重点功能的实现

antd 5.0 定制主题如此酷炫，我决定开启 @ant-design/cssinjs 阅读之旅

三个灵感闪现的 JS 实验，正向和逆向思维齐活了

欢迎