这是我参与「第五届青训营 」伴学笔记创作活动的第 1 天
按课表内容来讲青训营前三天的芝士应该算是第一大模块了，这里我们再次接触了梦开始的地方——前端开发三剑客。当初开始接触前端的时候，这些东西对我来说还是很生涩的玩意，后面接触到各种现代架构后逐渐忘记了这些老家伙。但经过青训营的课程，我对他们产生了新的理解，感觉像是接触到了新世界。
前端
前端，顾名思义前面的那头，主要以ui界面与用户交互，同时与后端一系列服务处理这些交互。
前端技术栈，便是HTML、CSS、JavaScript三座大山。
HTML
过多重复内容忽略，对我来说比较陌生的便是HTML语义化。可能是之前学习时没注意过，这个概念让我对前端开发有了新的认识——“传达的是内容，不是样式”。互联网最初的目的是进行知识共享，而语义化正是将现在网络的发展引向最初的那个目标。
<h1>Hello World!</h1>
<p style="font-size:32px; font-weight:900;">Hello World!</p>
效果如下
虽然他们看起来是一样的，但搜索引擎不这么认为，帮助视觉障碍人士浏览网页的阅读器也不这么认为。作为一名开发者，我们要知道我们面对的用户不仅仅是同事和普通用户，充分理解并应用语义化将对所有用户都很友好。
CSS
作为一个知识树比较奇葩的前端小白，我对CSS的继承及优先级计算竟没有任何知识储备……
优先度主要参考三个参数：id选择器，（伪）类选择器，元素选择器。根据一条CSS样式的选择器不同，按顺序填成三位数，哪个大哪个优先级就高。最后一个元素的样式将经过一系列复杂的计算来确定。
偷个懒用课上的截图（逃……
利用CSS画图也是曾经遇到过的一个有意思的解决方法，当时的场景要求使用一个小圆点，可以这样搞
// CSS
#circle {
width: 100px;
height: 100px;
background-color: blue;
border-radius: 50px;
}
// HTML
<div id='circle' />
感觉灵活性蛮高的
JavaScript
月影老师讲了js的三大原则：各司其职，组件封装，过程抽象。这是一份好的代码的一个标准。
各司其职，就要使js与HTML、CSS分离，专注做好各自的任务，比如js处理事件逻辑
组件封装，将一部分实现某个东西的代码抽离组合在一起，变成一个较独立的功能单元。这在比较流行的react、vue等框架中已经有了相当广泛的应用。
过程抽象，应用函数式编程思想，处理局部细节。（本身就很抽象……）
对于js本身，需要学的内容好多像红宝书、犀牛书等已经很全面了。而对于实践中可能出现的各种问题，月影老师也分享了一些优化代码的技巧。这让我想起来之前竞赛时学到的种种算法，其实他们都是相通的，就比如拼接字符串的log(N)做法，对于竞赛生还是很熟悉的。
在之后的学习工作中，为了避免像leftpad之类的事情发生，我们要经常问问自己：这段代码还能不能继续优化啊……
