年初计划完成全年的30+本阅读，到年底只完成了7本，自我检讨，25年再接再励。
提供一个scss中巧妙使用js变量，实现动态样式的思路！
本想着今年就没有读书小结了，2022年像囫囵吞下的一个枣，还没察觉就已经过去了。回过头看，发现脑中一片空白，阅读也停摆了一年。不过转念一想，这一年的备考中学习看的书，也算是一种特定品类的阅读吧。于是把这一年学的科目书罗列了一遍，也算是2022年的不完全阅读小结了。
时隔将近一年，才得空把年初在公司隔离的日记发出来，原因是这一年实在是太忙了！本以为是结束，没想到这篇日记后是更为漫长的接近2个月的居家隔离生活，后续有空了，会慢慢将这一年的文章整理出来。
纯css实现虚点线渐变效果——渐变背景色+与背景色相同的边框虚点线+background-origin设置背景图定位
今年的阅读量相比于去年稍有增长，不过惭愧的是依旧没有太多文字的输出。粗略的统一了一下，这一年总共写了4篇技术博客，2篇随笔，1篇年中总结，两篇写了一半没有完成以及一堆在脑海中构思了没有落笔的文章。
通常面对这种同类型的嵌套数据，且不确定嵌套层级数量时，我们处理起来通常会使用——递归，通过函数重复自我调用的方式，对数据进行递归处理。
日子是飞着过的。匆匆是生活的常态，伴随着绝望、孤独和悲伤，快乐偶尔也是有的，但快乐的尾调通常也是苦涩。
在前端日常开发排版布局过程中，虽然万物都可切图搞定，但是难免会不太灵活，所以针对一些不太常见的设计样式，如下图这种类似优惠券的一种样式，如果能有方式在代码层面搞定，尽量还是不要选择切图了。
Storybook是一个开源UI开发工具，能够有效的可视化项目组件，便于组件复用，避免重复造轮子。
之前在项目中维护同事代码，发现部分浏览器及低版本Chrome浏览器都出现报错情况.排查发现是由于replaceAll()函数兼容性问题所导致
今年的阅读量较去年大概翻了一番，共计完成了28本，超额完成今年的读书任务！🎉🎉
需求场景：一个进度条渐变色块，使用标签表明当前进度，标签背景色要与当前位置色值统一。
近日得空做一些整理，年底了，总归是喜欢回望一下这一年，展望一下下一年。因为最后一个月的阅读还没有截止，索性就把前两年的阅读数据翻出来总结了一番。
对于一个在大数据公司搬砖的前端，这几年除了地图，遇到最多的就是各种图表的需求了。基本上Echart作为一个图表库，已经能满足绝大多数项目中的图表需求了。BUT～常规的配置基本是无法满足产品大大们高端的品味的，So～难免也会遇到一些个性化的配置需求。
大概列了我觉得可能会比较有用的属性，尤其是转千分位，转时间的属性，其他的如果感兴趣，可以前往MDN自行查看。
通过获取年月日，时分秒，可以进行多个时间之间的时间差运算，实际业务场景还是蛮多的，不过现在有很多库，比如moment.js，对于一些运算进行了封装，使用起来也很方便。但对于原生的实现，也还是很有了解的必要的。
看见一篇博文，列出了博主关于字节跳动的线上面试题：https://blog.csdn.net/handsomezhanghui/article/details/108691314，针对这些题目，我试着做了以下解答，以供参考。（部分解答参考网上其他资料）
起因是对于开发过程中一些复用率比较高的代码片段，每次遇到都要想着去之前项目中出现的地方，进行参考复用，时间久了，找起来就很麻烦，于是准备在github建一个仓库，用来整理存放一些常用的代码干货。
网上关于clientHeight， offsetHeight，scrollHeight...的相关文章其实很多，整理这篇文章的主要目的还是在于加深一下自己对于这些元素的记忆，每次用到的时候，总是模棱两可的，需要再去查阅一下，希望自己总结之后，彻底把这几种height搞明白！
作为一个码龄差不多四五年的程序员，在开发过程中常常要面对各种类、变量、函数的命名。虽然这些年也差不多也逐渐形成了一些个人风格的命名规则，但并没有成一个比较规范的系统，因此很多时候还是比较随心的。最近看了《代码大全2》中变量名的力量一章，于是把书中的知识点挑出了一些列了出来。相信，对于有一定经验的程序员，可以帮助重新审视自己的日常编码习惯，从而改正一些错误的习惯；对于那些新手程序员，可以在初期，好好规范自己，从而养成良好的代码风格。
记录一个刚刚遇到的问题，以及解决方法。希望可以帮助之后遇到同样问题的小伙伴们！
这个项目适用于一些集合了系列子项目的项目，并且希望仓库能够统一的情况，不过目前搭建的这个架构还没有经过实际操作的考验，因此可能会有一些没有考虑到的一些实际情况中会遇到的问题，所以暂且放出了，如果有一些没有考虑到的情况，可以留言说明！
刚刚过去的这半年可以说是非常不寻常的半年了，但生活却变得比从前更寻常了。
有时候，不同的项目对于node版本的要求不同，如何快捷的控制我们电脑的node版本就成了我们需要考虑的问题
在日常开发过程中，有一些前端业务场景可能需要让元素在尺寸变化的同时，保证宽高比不变，所以在此记录一下具体的实现方法和应用场景。
本文主要回顾整理一下之前（大概一年前，
，这一年实在比较忙 ）写的一个页面动画。
这真的是一篇拖的太久的文章了。从前年拖到去年，从年前拖到年后，从月初拖到月中，从周一拖到了周六，然后不出意外的又从早晨拖到了晚上。
ES6给我们带来便利的同时，也给我们带来了一下麻烦。当然自从chrome等浏览器对于ES6语法的全面支持以来，这种麻烦也已经降到了最低，如果你的项目完全不需要考虑兼容问题，现在你在项目中可以尽情的使用ES6，且不用做特殊处理。当然这是理想情况。
整理一些平时不太注意，或者曾经踩过坑的Echarts设置，其实官方文档都可以找到，记录在此只是为了下次遇到同样问题能够快速解决。
console.log()差不多是我们平时开发过程中最常用的调试手法了，但其实关于Console还有很多其他方法可以帮助我们提高开发效率，虽然不常用，但可以作为扩展知识，稍作了解。
本文针对Array进行了其的方法汇总，方便实际使用中的查阅。
鉴于之前做的大屏的项目，全屏背景图过大，传统的写法导致页面渲染过慢，因而非常影响用户体验。除此以外，很多时候在开发过程中会出现很多图片的情况，图片过多或大，会直接影响页面的响应时间，从而导致页面性能变差。针对以上，我们可以使用WebP来有效的改善。
从前我们在网页中会需要内容定位，或者返回顶部之类的功能，通常使用锚点来实现，但是页面跳转太过生硬，用户体验不够，于是会通过一大串的js来实现平滑滚动的效果，近两年出现了一些新的属性可以很方便的完成这种交互，很大程度的减小了开发难度。
日常开发中，数组或是对象的遍历是一个经常会遇到的事情，关于遍历，其实Js提供了很多方法，但是对于他们之间的区别却理解的不是很透彻，通常情况就是抓起来一个forEach就用。为了提高代码质量，我认为有必要深入了解一下不同遍历的特点。当然，本文不作太多深入讲解，只是就各种的特点进行整理展示。
通常我们需要使用VUE的watch去监听一些值的变化，从而去进行一些操作，但是对于对象的监听，我们往往会遇到一些问题，对象内部的某个属性改变的时候无法触发watch函数，这个时候就需要使用vue的深度监听
经常会遇到一些开发场景需要我们按照一定的概率执行某件事，经常遇到的比如电商活动的抽奖，前段时间写一个类似头脑王者的答题小程序，如果没有玩家匹配时，需要与机器人，而机器人的答题正确率需要设定。
js中的数组和对象都是引用类型，其实说白了，数组的数据类型也是对象，因此我们在实际项目中需要注意，如果直接将一个对象赋值给另一个空对象，这个操作仅仅是让两个对象的指针指向了同一个地方。
当项目中多处出现相同的模块时，此时的正常考虑是将其做成公共组建，通过传参不同，实现多处复用
如果是平时的pc或H5的项目，要实现这个效果，可能选择性还会再多一些，包括使用SVG,transform等来实现。考虑到小程序的一些局限性，所以选择用canvas+js来实现。
在小程序里，map、canvas、video、textarea等 组件是由客户端创建的原生组件，它们的层级是最高的，不能通过 z-index 控制层级，因此在实际开发过程中就会遇到很多由此产生的问题。
情景一，如何设置小程序的入口页面。情景二，日常开发时，避免每次刷新都回到初始页面，影响开发效率，可以通过设置编译模式，为当前开发页面添加一个编译模式。
整理一些使用频率较高的布局样式，方便日常开发时参考，增加开发效率。
webpack在手动配置开发环境时，需要实时在网页中看到代码的更改，又不想要每次修改代码都手动`npm run build`一下，webpack提供三种解决方案，在此记录一下。
最近在做百度地图添加自定义覆盖物时，遇到一个问题。起先参照api都很顺利，但是当我在给自定义的覆盖物添加点击事件时，问题来了：无法触发。
一个地图展示页面，其中包含一个tab切，展现数据的两种展现形式，（实际情况是tab切页面中还有子tab切，但这不是关键），两个地图实例都设置了相同的中心点point，但是当tab切换到第二个地图时，出现了中心点偏移。
这里只写一些我在实际开发过程中用到过的属性，因为全部属性实在太多，就不一一列出来了，后续会持续更新新用到的属性。另外，之所以写这个文档，是因为ECharts官网的配置文档看起来实在是太费劲了。。。
最近在准备面试，想到之前面试总是会被问到：遇到过哪些坑，都是怎么解决的。每每遇到这种问题我都很尴尬，因为一下子让你去想踩过的坑还真不太想的起来，一般我只有再次遇到同样的坑的时候才会记起，所以决定以这篇文章开始，认真记录自己遇到过的坑，以备不时之需！
最近面试被问到这个问题，其实平时在开发的时候都会习惯性的用一种方法，能实现就行。虽然问题很基础，但是在面试的时候遇到这种问题，估计就是在考你基础知识掌握的全面性了，因此做一个整理，把能实现的方法都列一遍，也是对自己的css知识做一个复习
一直对于JS、jquery比较生疏，苦于在前端路上一直是孤军奋斗，没人学习交流，全靠自己琢磨。上家公司时抽了一些空余时间对于js、jquery的基本知识进行了一些系统的自学，并没有实际去写一些相关的项目，但自我感觉已经掌握了不少了，在这种自我感觉良好的情况下跳槽到了现在的公司：有货，主要工作内容就是活动pc及app页面的是制作，添加链接，基础到不行的工作。上次的活动需要写个Tab切，心想还是有点自学基础的我就开始动手写了，结果，挫败感很强啊