程序员社群 成长&生活分享 2021/03/18

各位程序猿(媛)晚上好,今天轮到我来分享,先来自我介绍16年毕业计算机通信,后来专升本(计算机科学),这教育经历算是很差了,从事前端大概有三年(我也不是很确定…),中间有留校工作了1年多,后来辗转成都和重庆,19年回的浙江。

好自我介绍结束,开始正题:

💻 怎么入的前端坑?

之前一直学的计算机通信嘛,大概是13/14年有一届青少年科技创新大赛被老师拉进团队开始接触网站制作,那段时间接触的是PHPASP。快实习的时候一起比赛的学长找我去他们公司做,算是正式进入到前端领域(是一个外包公司)。
当时也没有认识到 外包自研 的区别,工作也简单就是做一个 页面仔 还原设计稿的,一开始一个月熟悉项目开发流程,后边就开始独立自己切,每天都一直努力还原设计稿,这段时间积累HTMLCSS的知识确实是最快的时候,我到现在都没有怎么回顾过了,基本看到设计稿大概就知道应该是怎么样的一个HTML结构,CSS应该怎么去写,有哪些部分可以复用,到实习结束大概已经切了大概有一百个网站(我们实习期很长有一年)

阅读全文

回顾史无前例的 2020 年

不知不觉庚子年已经过完了,都不知道怎么就过完了看似艰难的一年,甚至觉得中间缺失另一部分的时间,还有很多想做的事情还没来得及做,可能年纪大了吧,真像别人说的,现在的一年只占用了 1/27 份的记忆空间,所以回忆起来觉得时间过得特别快,以后也只会越来越快。
说实话去年没有什么好回顾的,所以一直拖到正月都过完了都不想动手写,很多事情都不顺心,也出现了很多计划之外的事情。不管是工作还是生活上,特别是感情上,导致全年大部分的时间情绪都不高涨,先回顾一下去年吧。

阅读全文

关于情感勒索与关系依存自尊者

最近和女友闹得很僵,情绪很低落,没有什么动力填坑,更别提开新坑了,光把 设计模式学习 补完就折腾的够呛,而且有一些定义很模糊容易混淆,经常就为了区分两个很类似的模式停滞几个小时。

周二的时候知乎推送了一个问题 在恋爱中,女孩子真的会遇到一个满眼都是自己的男孩子吗?, 第一次接触到一个名词 关系依存自尊,确实一直以来都把感情看得很重要,并且已经深刻影响到自己生活的方方面面。

KnowYourself 的回答真的让我一下子明白过来,原来在不经意中我已经情感勒索了很久并不自知,也理解了她口中的压力并不是我以前所想的那样……

阅读全文

「 设计模式学习 」 L00 开坑贴 & 设计模式概览

设计模式是我在2018年在成都工作的时候听 肉山老师 的直播JavaScript 设计模式 导言的时候就想学习的一个东西,但是一直拖拖拖,虽然后来买了肉老师的 Chat 从 jQuery 里学习设计模式,但是看了一头雾水,后来同样买了肉老师推荐的书《设计模式:可复用面向对象软件的基础》,也是在家里吃灰了半年多。
一直想把整个设计模式都了解一下,不用吃透大概明了就可以,但是每次都提不起开坑的念头,如果再写成学习笔记的话,学习周期会大大拉长。

这次在项目的不断迭代中,我遇到了一个问题,就是 项目中的类型和状态管理,所以就想着是否有一个合适的设计模式来解决问题,所以就被逼迫着捡起来了……

阅读全文

项目中的类型和状态管理

这段时间项目迭代比较快,所以很多时候对于记录的状态和类型判断我都是使用的 魔术字符串 的形式,但是这样就与代码形成了 “强耦合”, 不利于后期的维护

例如这样的代码结构:

<!-- 用vue template来举例 -->
<template>
    <table>
        <!-- 其它结构 -->
        <td>
            <!-- 直接使用状态值判断 -->
            <a @click='xxx' v-if='record.status === 0'>操作A</a>
            <!-- 使用数组下标判断 -->
            <a @click='xxx' v-eles-if='record.status === status[1].key'>操作B</a>
            <a @click='xxx' v-else'>其他操作</a>
        </td>
        <!-- 其它结构 -->
    </table>
</template>

特别是最近一整个分类的类型和状态的都变更了,所以在业务逻辑内的魔术字符串也需要一个一个文件去同步修改,大部分的都被替换了,但还有一些零碎的地方没有被修改到,导致不断有 BUG 被提上来,这就很头疼了。

所以我就想者怎么把业务逻辑内的魔术字符串使用一种方式替换掉,最开始我想法是把状态集中起来进行管理

阅读全文

Symbol() 是个什么东西?

最近在一些 Demo 中经常会看到 Symbol() 这个东西,例如:

var race = {
  protoss: Symbol(),
  terran: Symbol(),
  zerg: Symbol()
}

就只能记得大概了,就是赋值一个独特的值,但是这个值具体是什么我想不起来了。
所以还是记个笔记加深下印象,省的看了又忘。

ES6 引入了一种新的原始数据类型Symbol,表示独一无二的值。它是 JavaScript 语言的第七种数据类型

阅读全文

📟 树莓派 4B(2GB RAM) 开箱记录

自从我爸妈他们屋子重新装修好了之后,我爸就嚷嚷着要把他的旧电脑搬上楼装起来,但是家里没有多少地方能摆电脑桌了(怕他又和以前一样在书房看着小说抽一整天的烟)。所以趁着双十一,就入手了一个树莓派 4 Model B,准备给他放客厅连到电视上,通过家里人时不时打断他投入看小说的状态。

今天到货了,开始折腾一下….

阅读全文

聊一下自己 VueJS 项目的编码习惯和风格

横幅

最近在考虑把遍码习惯整理一下,一个良好的遍码习惯可以有效减少一个项目的维护成本,
因为不可能在整个项目的生命周期中,均由最初的开发人员来维护,或者所有的代码都是由你一个人写出来的,
改善代码的可读性,可以让开发人员尽快理解历史的业务代码。

之前也有研究过 ESlint的格式化风格 选择一款适合自己的来规范自己,但是了解的越多,越觉得还是需要团队互相讨论来找一个大家能都接受的妥协结果,所以最后还是选择了 Prettier ,因为我觉得其它两种风格相对来说太严苛了,很多项目都是自己开发并没有多人合作开发的情况出现,所以使用 Prettier 相对来说所自由一些…

阅读全文

ES6 中的 新数据结构 Set & Map

今天在一个需求里边遇到一个使用 MAP 数据结构的场景,就去解了一下 ES6 的新数据结构

ECMAScript 6 内提供了 4种 新结构 Set, WeakSet, Map, WeakMap,虽然已经是5年前的知识了,但是对于我来说还是新🤣

本来想先聊 Map 的,但是仔细看了阮一峰老师的文章之后发现,确实是要从 Set 开始讲

阅读全文

VueJS中 v-bind 的一些修饰符

今天洗澡的时候在听 饥人谷的模拟面试 (五) 的时候,一直觉得这次面试的学生有点差,如果是我来面话可能已经让他回家了,但是 方方老师 很有耐心,在中间问道 .sync 的时候我 ???? 完全没有印象了。

正好已经有2个月没有更新了,所以复习一下 v-bind 的三个修饰符 [ .prop, .camel, .sync ]

阅读全文