【减肥&转正主题月】5月完结

冲冲冲，冲冲冲！

# 5.31

# 买房攻略

迁移到单独一篇文章

# 算法打卡 - 多数元素

easy的多练习，多解法

# 5.30

# mac文件夹

在folder中：command+shift+g，会有个弹窗，输入路径进入

在命令行打开folder： open /

不得不吐槽mac的文件管理是真的辣鸡

# macOcr

截图获取图中文本，只可惜不支持中文。识别的是乱码，其他挺好

# 5.29

# outerHTML

<div id="test1">这是div中的文字<span>这是span中的文字</span></div>
console.log('innerHTML:'+test1.innerHTML);
// innerHTML:这是div中的文字<span>这是span中的文字</span>
console.log('outerHTML:'+test1.outerHTML);
// <div id="test1">这是div中的文字<span>这是span中的文字</span></div>

1
2
3
4
5

# 5.28

# 吃的欲望

做的就是管不住嘴，一吃就胖，这周没搞减肥餐，导致总是饿，一饿就想暴饮暴食。所以减肥餐还是有必要的。

# html显示LaTeX

MathJax也可以，不过有标签支持。了解一下。

    <p>(MathML)解不等式
        <math xmlns="http://www.w3.org/1998/Math/MathML">
        <mi>f</mi>
            <mo>(</mo>
            <mi>x</mi>
            <mo>)</mo>
            <mo>&gt;</mo>
            <mfrac>
                <msqrt>
                    <mn>2</mn>
                </msqrt>
                <mn>8</mn>
            </mfrac>
            <mo>+</mo>
            <mn>1</mn>
        </math>
    </p>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

# 5.27

# 贪心算法

问题能够分解成子问题来解决，子问题的最优解能递推到最终问题的最优解

常见算法题：买卖股票，货币选着

贪心算法与动态规划的不同在于:它对每个子问题的解决方案都作出选择，不能回退，动态规划则会保存以前的运算结果，并根据以前的结果对当前进行选择，有回退功能，而回溯算法就是大量的重复计算来获得最优解。

# 5.26

# 智力题

开始的想法：两个空杯都接一半? 2.5 + 3.5 = 6L。有人说不能用主观刻度，那这种题肯定就是组合问题了。

正确的解法：7-(5-(7-(5-(7-5)))) = 6

# React Xss防范

XSS: 将恶意代码注入到应用中，浏览器去默认执行

React官方： React DOM 在渲染所有输入内容之前，默认会进行转义。也提供了dangerouslySetInnerHTML 语法避免转义

// 一段恶意代码
<img src="empty.png" onerror ="alert('xss')"> 

// 转义后输出到 html 中
&lt;img src=&quot;empty.png&quot; onerror =&quot;alert(&#x27;xss&#x27;)&quot;&gt;

1
2
3
4
5

XSS练习小网站 (opens new window)

# 原生添加样式

Ele.className='aaa'  // 设置元素的class为aaa ，如果元素上原本有class则会覆盖

Ele.classList.add = "aaa" // 给Ele新增aaa

Ele.className += " aaa"  // 给Ele新增aaa

1
2
3
4
5
6

# 判断元素上是否有某个属性

Ele.classList.contains("aaa")  // 如果Ele上面有aaa属性返回true，否则返回false

# 插入DOM

Ele.appendChild(ele) 在Ele的最后插入ele

Ele.insertBefore(newele,ele) // 在Ele元素中的 ele元素前插入 newele

1
2
3
4

# 5.25

# vue 原生事件和自定义事件

看到群友有人问关于Vue JSX写法中nativeOn的写法。之前用vue从来没写过JSX，去了解了下。

先看下这个解释：为什么有些事件需要.native? vue将原生事件绑定到组件 (opens new window)

  // 事件监听器在 `on` 内，
  // 但不再支持如 `v-on:keyup.enter` 这样的修饰器。
  // 需要在处理函数中手动检查 keyCode。
  on: {
    click: this.clickHandler
  },
  // 仅用于组件，用于监听原生事件，而不是组件内部使用
  // `vm.$emit` 触发的事件。
  nativeOn: {
    click: this.nativeClickHandler
  },

// 我理解的这种写法，change需要子组件emit出来才能出发。natvieChange，如果子组件里面有原生的change方法就可以。
// 懒得去试了，谁写vue，去写JSX呢。。。

  <MyCom @change="change"  @change.native="natvieChange"/>   

  h('MyCom', {on:{change:()=>{}}, nativeOn:{nativeChange:()=>{}}})

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

# 滑动窗口

滑动窗口算法基本原理与实践 (opens new window)

滑动窗口主要应用在数组和字符串上, 考的也会比较多，必须得会。还有个双指针，两者思想差不多。

打卡一题(字节考的最多的)：无重复字符的最长子串 (opens new window)

题解见算法打卡

# 一个css学习网站

Learn CSS (opens new window) 英文版

# 前端技术圈儿

搞了个微信群，早上半天一百多人，保持学习的积极性，保持竞争力！

# 5.24

# 加油💪🏻

又经历了一段低谷期，闹分手，打游戏，啥也不想干的状态。

该干的都干了，还是要调整心态，好好学习，加油💪🏻

5月打卡，技术方面学的太少了，警告自己一下，充实起来！

# 减肥的flag

马上就没动力了，决定：每天晚上下班跑步回家！！！一周至少3天

# umi && dva

内部有个后端大哥写的项目，临时支援一下，用的umi，需要熟悉一下。

感觉不太好用，react的目的不就是少的api来完成更加自由的功能。这个umi封装了一些东西，类似vue。这样一来，别人来维护就必须要去熟悉下。

dva感觉也是配置化，很多项目感觉用不到状态管理，react自带的context就够用了。老项目在用，那没办法，学一学。

这样想想，react少量的api确实挺好的，感觉减少了一定的维护成本。

# 开源项目PR

写项目发现一个zent组件库的bug，准备提个PR。排查问题的过程也发现了，自己debugger的能力还有待提升

多看看开源项目，找找bug，提提PR

# 5.23

# webssembly

概念：

一种新的、抽象的虚拟机指令集（W3C）标准；
四大浏览器已经支持该标准 MVP 版本的所有特性；
一种以.wasm为后缀的二进制格式；
可以通过标准的Web API接口在浏览器中加载、解析和执行；

WebAssembly 并不是一门编程语言，而是一份字节码标准，需要使用高级编程语言编译出字节码放到 WebAssembly 的虚拟机中运行（有点像 Java ），目前主流浏览器都已经支持 WebAssembly。

都2021年了，你怎么还在说webassembly？ (opens new window)

# 5.22

# playground-macos：用前端实现 macOS's GUI

https://github.com/Renovamen/playground-macos

挺牛逼的，可访问 portfolio.zxh.io (opens new window) 查看。

# 5.21

# 持续性吵架

# 5.20

# 这才是你该有的样子

总有一天，你会明白，能够治愈你的，从来都不是时间，而是你心里的那股释怀和格局。只要内心不慌乱，连世界都难影响你。

你可以消沉，也可以抱怨，甚至可以崩溃，但不能丧失自愈的能力，要学会及时止损。人生不一定要贏，但绝不能输给过去的错误和愚蠢。人生哪有白走的路，每一步都是成长，你要把头抬起来，一直往前走，天总会亮的。

一辈子很短，一定要好好爱自己。你的优秀要遇到识货的人，你的真诚要遇到珍惜你的人，你的善良要遇到感恩的人。

谋生的路上不抛弃良知，谋爱的路不放弃尊严。你该有的样子就是：十分沉静，九分气质，八分资产，七分现实，三分颜值，两分糊涂，一分自知之明。

无论身处何方，陷于何地，都要向下扎根向上开花，不负生活，不负自己。

                                                                 2021.5.19 俊劫

# 5.19

# 烦心事比较多，消失一段时间

# 转正文档

昨天晚上吵架到3点，有种啥也不想干了，收拾东西回老家的想法。

TL和HRBP让开始写转正文档，慢慢写写吧。

# STAR法则

situation(背景)
task(任务)
action(行动)
result(结果)

做一些总结性的东西，牢记这4条

# 5.18

# 日常

吵架，就因为我没事在家打游戏，她觉得我玩的爽了，她不爽，就要搞事，没意思。

# 打卡

越来越有点敷衍了，坚持还是比较难的，学习的劲头忽然就减少了很多。得想点法子，我感觉这个打卡还是很有必要的。保持学习，保持竞争力，可能需要调整一下形式

# 5.17

# react hooks总结

写了一点点

# font-variant-numeric

一个设置数字样式的css属性。font-variant-numeric: tabular-nums 可以将数字变成等宽的，比如1和9。

演示参考：font-variant-numeric MDN (opens new window)

# 早：体重

146.1 周末两天中午都吃了饭，放假还是太能放纵了，考虑以后周六日安排一天去图书馆或者公司。周日打会游戏，女朋友又开始作。

# 5.16

年前报的汽修班，考个证。安排周日培训一波，10-12点，刚好碰到了前leader，上完课简单吃个饭，简单聊了会。

# 5.15

女朋友出去团建，很难得的机会，在家干了一天LOL，有大哥带，有几个人一块玩，玩的很开心

# 5.14

# 早：体重

144.1

新人妹子入职，去吃了顿欢迎饭。上家婚礼纪，男朋友之前是有赞的，现在去了字节，想想她们俩能赚好多钱，我就很难受

# 5.13

# 早：体重

144.9

昨天晚上还吃了好多东西，前期掉的这么快🐴

# canary分支

简称：金丝雀，比DEV分支更快的开发版，并且不覆盖DEV/beta/stable分支而是并存的形式，图标也不一样

# 新来一个妹子

17届，男朋友之前是有赞的，现在在字节，想想他们俩就能赚很多钱，羡慕死了~~~~

# 5.12

# 早：体重

145.8

# DTO

(Data Transfer Object，数据传送对象)是解决这个问题的比较好的方式。 DTO是一个普通的Java类，它封装了要传送的批量的数据。当客户端需要读取服务器端的数据的时候，服务器端将数据封装在DTO中，这样客户端就可以在一个网络调用中获得它需要的所有数据。

# 算法打卡

滑动窗口算法在一个特定大小的字符串或数组上进行操作，而不在整个字符串和数组上操作，这样就降低了问题的复杂度，从而也达到降低了循环的嵌套深度。其实这里就可以看出来滑动窗口主要应用在数组和字符串上。

解决一些查找满足一定条件的连续区间的性质（长度等）的问题。

# github1s ！！！！

javascript-algorithms (opens new window)

在任何github仓库的的地址中，将github.com改成github1s.com

原地起飞🛫

# 5.11

# 抱怨

总是动不动就迷茫，女朋友永远都在抱怨，真就挺累的。有时候自己心态停积极的，一听到她抱怨这个不好，那个不好，我真很无奈。

# 减肥

早餐：一个茶叶蛋，一盒纯牛奶中午：一个100g面包晚上：一个80g面包

美团优选买的减肥餐到了，明天开吃

体重还是记录每天早起的吧，加油💪🏻

# web打印分享

准备准备，ppt和demo都写的差不多了，明天早上早点来，自己先练习一遍，控制下演讲时间

# 监听打印窗口

window.onbeforeprint = function(event) {
  console.log("打印窗口调起");
};
window.onafterprint = function(event) {
  console.log("打印窗口关闭");
};

1
2
3
4
5
6

# SKU/SPU

一部 IPhone 6S, 它身上有很多的属性和值

spu 属性(不会影响到库存和价格的属性, 又叫关键属性) >>

sku 属性(会影响到库存和价格的属性, 又叫销售属性) >>

# runtime

计算机程序运行的时候所需要的一切代码库

Vue Runtime Only (适合生成环境用)

我们在使用 Runtime Only 版本的 Vue.js 的时候，通常需要借助如 webpack 的 vue-loader 工具把 .vue 文件编译成 JavaScript，因为是在编译阶段做的，所以它只包含运行时的 Vue.js 代码，因此代码体积也会更轻量。

在将 .vue 文件编译成 JavaScript的编译过程中会将组件中的template模板编译为render函数，所以我们得到的是render函数的版本。所以运行的时候是不带编译的，编译是在离线的时候做的。

Vue Runtime+Compiler（包体积大了40%，开发环境用）

我们如果没有对代码做预编译，但又使用了 Vue 的 template 属性并传入一个字符串，则需要在客户端编译模板。

# 5.10

# 手写JS实现 - 图片懒加载

写了个简易版，这块要实现高级些的，也挺复杂的

# react基础文章

掘金发文，react基础，感觉掘金的推荐机制有点变化，搞不灵清

# noop

NO Operation,空操作

# 减肥

女朋友一直说我不争气，减不下去，自己也一直是在开始的路上。

恨自己没骨气，made，刚好离转正还有一个月，就这一个月，拼一拼。我不信了，flag 立下了，减不下去，我是废物！

# 晚：体重

147.2

# 5.9

# 有赞两个月

3.9 号到今天，刚好两个月。接下来一个月得冲一波了。

技术分享、业务需求、转正答辩，忙起来

# 学习&游戏

买了个书桌，稍微有点小，跟女朋友换了个桌子。本来准备是学习的，结果去打了联盟。。。

# 5.8

# mac 计算器

打开计算器，cmd +shift + s 会创建一个副本，自动记录计算器的过程和结果

# Lerna

用于管理具有多个包的 JavaScript 项目的工具

自动解决 packages 之间的依赖关系。
通过 git 检测文件改动，自动发布。
根据 git 提交记录，自动生成 CHANGELOG

# 汉字书写

https://hanziwriter.org (opens new window)

一个很牛逼的库，可以将汉字的一笔一划都画出来。如果做在线教育可能会用到，留意一波

# Canton

是中国广州的英文名，在国外被广泛地使用。

我以为是个公司呢~~~

# 5.7

# figlet

「FIGlet」官网 (opens new window)

「FIGlet」是基于 ASCII 字符组成的字符画。它的名字由来，其实有几个固定的名称，几种比较主要的称呼分别是：「ASCII TEXT」、「ASCII TEXT Banner」、「ASCII Art」、「ASCII Decorator」和「FIGlet」

# 身心愉悦

/*
 *                        .::::.
 *                      .::::::::.
 *                     :::::::::::
 *                  ..:::::::::::'
 *               '::::::::::::'
 *                 .::::::::::
 *            '::::::::::::::..
 *                 ..::::::::::::.
 *               ``::::::::::::::::
 *                ::::``:::::::::'        .:::.
 *               ::::'   ':::::'       .::::::::.
 *             .::::'      ::::     .:::::::'::::.
 *            .:::'       :::::  .:::::::::' ':::::.
 *           .::'        :::::.:::::::::'      ':::::.
 *          .::'         ::::::::::::::'         ``::::.
 *      ...:::           ::::::::::::'              ``::.
 *     ````':.          ':::::::::'                  ::::..
 *                        '.:::::'                    ':'````..
 */

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

# 『前端开发核心知识进阶』

侯策大哥的书，同事图书馆借的，看目录很心动。加入计划，不知道啥时候能看完。

# pop 组件

大部分组件库都是基于 popover 实现，但是这个组件需要一个定位元素，当子组件被禁用，无外层元素时，就会定位失败，Pop 就不会显示，坑点

# 5.6

# keyNote 学习

学来学去，还是模板好看~~~

# 5.1 - 5.5 小长假

# 博客 5.0

正式上线，新功能多多

🔥 主题大改动，基于 vdoing 定制修改
🔥markdown 支持嵌入 html 标签
🔥 留言板功能
🔥 网站导航：嵌入了各种第三方前端网站，持续更新
🔥 底部加入访客统计功能
🔥more。。。

# 这个五一

过得还是挺有意义的，带女朋友回家，满足了一下奶奶的心愿。家里人也挺重视的，姐姐帮了很多忙，忙前忙后的，还给女朋友买了个礼物（YSL 反转巴黎香水）。

也是让女朋友认识一下我家的情况，要是感觉不行，估计后面也相处不了多久。

看朋友圈晒出去旅游的貌似并不多，有两三个去海边的。一直都挺想去的，看看海，拍拍照。等下一波长假，舟山来一波。

# 5.5

早上 4 点到杭州，火车晚点半个小时。打车也用了有十几分钟。5 点到家睡觉，到 9 点自然醒，晚会手机，给女朋友叫个外卖。继续睡。

下午起来和同事打了几把 LOL，一天就没了。还好留了一天时间休息，不然回来就要上班，不得难受死。

# 5.4

姐姐下午一点半去郑州的车，所以就早点做了饭，一块吃完，她就先走了

我带着女朋友在县城里面逛了几圈，看看还有什么衣服要买的，走的挺累的，天气也比较热就没有继续看了。路上碰到个 2 元店，买了个小包包，10 块钱。女朋友说是给她妹妹买，我看她挺喜欢的

# 5.3

白天去逛了县城，买买衣服，给奶奶买买吃的，顺便带女友逛了逛我的高中。下午三点多回家，遇到大雨，硬是冲回来了。。。。好在下雨的时候离家不远了，衣服没怎么湿。

晚上去舅舅家换了现金，晚上去奶奶家谈了谈，主要是怕奶奶一个人孤独。也顺便让妹妹给奶奶和我和女朋友拍个合影，准备洗一个相册给奶奶。毕竟不会用手机，无聊的时候相册是一个很好的回忆。

# 5.2

早上六点到商城，再转一班公交车到县城。本来是准备把大包小包放到姐姐男朋友家，然后去逛超市买点东西带回家。但是离车站有点远加上太早了，需要等两个小时超市才开门，就直接打车回去了，40RMB，滴滴秒接单，是个女司机。13KM，感觉她回来跑个空车，不太划算。

姐姐在家做好了午饭，喊奶奶下来一块吃饭，还有两个姑姑家妹妹一起。

吃完饭睡了一会，然后骑车去奶奶家看看，附近逛一逛，2 号就过去了~~~

# 5.1 带女朋友回家

21.47 的火车，人超多，俩硬座。晚上腿都伸不开，挺难受的。好在不会发生高速上的堵车。

白天也没干啥，就收拾收拾东西，出去逛逛超市。

#学习打卡

最近更新时间： 2021/07/06 16:08:30

← 【React主题月】4月完结【学习打卡】2022-6 从心出发→

【减肥&转正主题月】5月完结

# 5.31

# 买房攻略

# 算法打卡 - 多数元素

# 5.30

# mac文件夹

# macOcr

# 5.29

# outerHTML

# 5.28

# 吃的欲望

# html显示LaTeX

# 5.27

# 贪心算法

# 5.26

# 智力题

# React Xss防范

# 原生添加样式

# 判断元素上是否有某个属性

# 插入DOM

# 5.25

# vue 原生事件和自定义事件

# 滑动窗口

# 一个css学习网站

# 前端技术圈儿

# 5.24

# 加油💪🏻

# 减肥的flag

# umi && dva

# 开源项目PR

# 5.23

# webssembly

# 5.22

# playground-macos：用前端实现 macOS's GUI

# 5.21

# 持续性吵架

# 5.20

# 这才是你该有的样子

# 5.19

# 烦心事比较多，消失一段时间

# 转正文档

# STAR法则

# 5.18

# 日常

# 打卡

# 5.17

# react hooks总结

# font-variant-numeric

# 早：体重

# 5.16

# 5.15

# 5.14

# 早：体重

# 5.13

# 早：体重

# canary分支

# 新来一个妹子

# 5.12

# 早：体重

# DTO

# 算法打卡

# github1s ！！！！

# 5.11

# 抱怨

# 减肥

# web打印分享

# 监听打印窗口

# SKU/SPU

# runtime

# 5.10

# 手写JS实现 - 图片懒加载

# react基础文章

# noop

# 减肥

# 晚：体重

# 5.9

#  有赞两个月

# 学习&游戏

# 5.8

# mac 计算器

# 有赞两个月