首页 / 资讯中心 / 文章详情

重拾前端:跟着配套视频重做前端入门练习,打通HTML/CSS与DOM事件

重拾前端:跟着配套视频重做前端入门练习,打通HTML/CSS与DOM事件 ★ FEATURED ARTICLE
工作到第五六个年头回头再看自己早些年写的页面那种感觉挺微妙。我这次下决心重拾前端起因很朴素手上接了个需要自己搭界面的活结果布局调了半天调不明白Flex 的对齐属性全靠记忆瞎猜JS 里的事件委托写起来还要翻文档。基础这东西不用就退化而且退化得比你想的快。于是我把一套前端入门课程的练习篇重新翻出来配套视频一集一集看案例一个一个敲从 HTML 标签、CSS 盒模型一直练到 DOM 操作和事件。这篇不是教程是我把这套配套视频里的练习全部重做一遍之后关于怎么练、练什么、卡在哪儿、怎么爬出来的完整记录适合那些有基础但生疏了想捡回来的人也适合刚入门正在跟着视频练、但练完就忘的新手。1. 重拾前端为什么必须从动手练切入而不是再看一遍教程1.1 眼高手低的真实成因拆解我先说说自己第一次重拾失败的经历那次我选的是把课程视频从头到尾刷一遍。倍速开着看的时候频频点头哦这个我知道这个简单两个小时刷完十集成就感拉满。第二天让我手写一个三栏布局我卡在清除浮动上卡了四十分钟。原因不复杂看视频是被动接收写代码是主动调用大脑在这两件事上调用的机制完全不一样。看的时候你只需要识别写的时候你要生成而生成的路径需要反复走才能形成稳定的神经回路。更麻烦的是视频有节奏保护。老师讲到position: absolute的时候会顺带说出记得给父元素加相对定位这句话在视频里出现得恰到好处你听着觉得理所当然但等你自己面对一个元素飞出去的时候脑子里根本不会自动弹出这句话。视频把知识和触发这个知识的场景已经帮你缝合好了你产生的是一种被缝合过的错觉。练习的意义就是把这根线拆开让你自己去缝。所以我后来给自己定了个硬规矩每个知识点视频只看一遍然后关掉视频默写三遍最后改一个需求。这三步分别对应识别、生成、迁移也就是练习篇真正该干的事。配套视频里的案例其实设计得挺有梯度从单个标签的用法到一整个页面如果你只是跟着敲那就浪费了这个梯度必须自己加一层关掉视频的动作。1.2 练习篇的定位与我给自己设计的推进路径这套练习篇的定位很明确它是肌肉记忆训练场不是知识索引。你在里面不会遇到什么前沿特性全是float、padding、addEventListener这类老掉牙的东西但恰恰是这些东西构成了你之后看任何新框架时的底气。我见过太多人 React 写得飞快但让他处理一个元素的垂直居中他还是条件反射地写margin: 0 auto然后发现没用。我的推进路径分四段按周切阶段内容目标验收方式第一周HTML 结构 CSS 基础盒模型能不看视频写出一个静态卡片手写 3 遍不出错第二周浮动、定位、Flex 布局能实现两栏/三栏/吸顶白纸上画出布局示意图第三周DOM 查询与事件绑定完成 3 个交互小案例不看代码自己复现第四周综合小项目串联静态页变可交互页加一个视频里没有的需求这个路径的关键在于每周的验收方式不是我看完了而是我能不看资料写出来。这是个很残酷的标准但你一旦习惯了这种标准进步速度会比刷完快两到三倍。另外说一下我给每一周都留了缓冲因为实际执行下来必然会卡住别把计划排得太满卡住才是正常状态卡住的地方就是你的真实盲区。2. 练习环境准备与工具链搭建2.1 编辑器配置够用就行别在这上面花两天我见过不少人在重拾的第一天花整整一天折腾编辑器主题、字体、快捷键然后心满意足地关掉电脑。这是个特别隐蔽的拖延陷阱。我自己的配置极简一个主流代码编辑器装三四个插件其余全部默认。必须装的插件只有两类。一类是实时预览改完保存浏览器自动刷新这个能省掉大量改一行、切窗口、F5的时间一天下来能省出半小时。另一类是标签自动补全输入div.cardulli*3按一下键就展开成嵌套结构写 HTML 骨架时提速非常明显。其他的格式化、括号高亮、路径提示属于锦上添花装不装都行。这里有个实操心得练习阶段千万不要装代码片段库类插件。那些插件会让你输入三个字母就补全一整段 Flex 布局代码看起来很爽但你练的就是手写这件事插件帮你补全等于别人替你练了。我第一周就把这类插件全关了强迫自己把每一个属性名敲完整敲错几次反而记牢了。工作区还有一个容易被忽略的点把练习代码和笔记分开放。我的习惯是建一个练习总目录下面按周分文件夹每周一个每个案例再单独一个文件夹。笔记单独放另一个目录用纯文本写记录今天卡在什么上、为什么、怎么解决的。这个习惯坚持一个月后你会发现自己的问题清单会重复出现重复出现的那几条就是你真正的短板。2.2 目录结构的约定与命名规范目录结构这件事一个人练的时候看起来无所谓但它直接影响你后期能不能快速找回某个案例。我用的约定是这样practice/ ├── week01-html-css/ │ ├── 01-card/ │ │ ├── index.html │ │ ├── style.css │ │ └── images/ │ └── 02-list/ ├── week02-layout/ │ ├── 01-float-three-col/ │ └── 02-flex-nav/ └── week03-dom/ ├── 01-tab-switch/ └── 02-todo/命名上坚持两条全小写、用短横线连接不要出现中文、空格、大写字母混用。我知道这听起来像废话但实际踩过的坑很真实——早期我用中文文件夹名后来想把这个练习目录放到别的机器上跑一下路径编码问题折腾了半小时最后还得重命名。还有一点每个案例里HTML 和 CSS 分开文件不要图省事写在行内。练习阶段强制分离能逼着你把选择器写对也方便你后期把某一段 CSS 单独抽出来复用。2.3 浏览器调试面板的必会操作练习篇真正的主战场不是编辑器是浏览器的调试面板。我在重拾过程中花在这上面的时间可能比看视频还多。有四个功能必须练到条件反射第一是元素检查。鼠标点一下元素右侧立刻显示它命中的全部 CSS 规则从上到下按优先级排列被划掉的那些就是被覆盖的。这个视图能直接回答我的样式为什么没生效这个高频问题比盲猜快十倍。第二是盒模型可视化。选中元素后有个彩色方块图从内到外分别是内容、内边距、边框、外边距四边数值都标着。练习盒模型的时候我基本是改一行 CSS 就去看一眼这个图看数值有没有按我预期变化。这个习惯建立起来以后你对这个元素到底占多宽的判断会变得非常准。第三是临时改样式。右侧面板里可以直接改数值、勾掉某条规则、加新属性刷新就还原。这个功能对练布局特别有用你可以把float: left勾掉立刻看到不加浮动时是什么样把overflow: hidden加上看看父元素高度有没有恢复。这种对比观察比看十遍讲解都管用因为你亲眼看到了差异。第四是控制台看报错。JS 练习阶段养成写完就打开控制台看一眼的习惯红色报错会直接告诉你哪个文件的第几行出了什么问题。我一开始总忽略这步导致页面毫无反应的时候还在那儿一行行读代码浪费时间。注意调试面板里的改动都是临时的刷新就没了。改到满意的效果一定记得回编辑器里落地我至少有三四次改完很满意顺手刷新了一下全没了。3. 配套视频练习的三阶段推进法3.1 第一阶段跟着敲建立的是输入法肌肉记忆第一阶段没什么技巧就是视频放一段暂停自己敲一遍敲完对照。听起来很笨但这一步不能跳。它的价值不在于理解而在于让手指熟悉那些标签名和属性名的拼写让大脑熟悉这个结构大概长什么样。我在这个阶段给自己加了两个小动作效果挺明显。第一个是每敲完一个案例把视频进度条拖回去看老师有没有提到我漏掉的细节。经常有这种情况我敲出来了视觉效果也差不多但老师前面说过一句这里用语义化标签更好我用的还是div。这类细节不会影响页面呈现但会影响你对为什么这么写的理解。第二个小动作是敲完立刻删掉重敲一遍第二遍不看视频卡住的地方做个标记。这个阶段大概占整个练习时间的四成。听着比例不小但它是地基。我见过跳过这一步直接去写项目的结果 CSS 属性名拼错、HTML 结构嵌套错误报错都看不懂反而更慢。3.2 第二阶段关掉视频自己写暴露知识盲区这是整个练习里最痛苦、也最有价值的一段。做法很简单看完一个案例的视频关掉视频关掉代码从一个空的 HTML 文件开始把刚才那个案例完整复现一遍。不要求像素级一致要求结构一致、主要样式一致、交互一致。我实测下来的情况是第一个案例我卡了整整五十分钟其中二十分钟卡在居中十分钟卡在清除浮动剩下二十分钟在反复调内边距。而这个案例在视频里只有八分钟。差距在哪在于视频里老师是顺手写了某个属性的而我根本不知道那个属性存在或者知道但没想到这个场景要用它。这里有个技巧卡住的时候不要立刻去看视频先给自己定一个挣扎时限。我的时限是十五分钟十五分钟内允许翻文档、翻笔记、在调试面板里瞎试就是不许看原视频。超过十五分钟还没解决再去看看完之后必须在一张纸上写清楚我为什么没想到。这个为什么才是真正的收获它往往指向一个认知缺口比如我从来没把overflow和父元素高度塌陷联系起来。3.3 第三阶段加需求改造从复现走到迁移复现只能证明你记住了改造才能证明你懂了。第三阶段我给每个案例都加一个视频里没有的需求难度不大但不能靠背。举几个我实际加过的改造导航栏案例视频里是横向五个链接我加一个最后一项靠右的需求逼自己去想margin-left: auto和flex: 1的配合。卡片列表案例视频里是固定三列我改成屏幕窄于某个宽度时变成两列、再窄变一列这个当时还没学媒体查询我是用百分比宽度加flex-wrap硬凑出来的凑了半小时但那一小时里我对flex-wrap的理解比看视频深得多。选项卡案例视频里是点击切换我加一个默认选中第一项逼自己去想初始化逻辑放在哪。待办列表案例视频里只能添加我加了删除和标记完成逼自己去用事件委托因为直接给每个删除按钮绑事件后加进去的项就没有事件了。这套改造做下来最直观的变化是我开始能预判改这里会影响哪里。这个能力在真实项目里比任何语法知识都值钱因为实际开发中你绝大多数时间不是在写新代码而是在改已有代码。4. 核心知识点练习拆解4.1 HTML 结构的语义化练习要点HTML 这块很多人觉得没东西可练标签就那么些背下来就完事。我不这么看。语义化的真正价值不在好看而在它决定了你 CSS 选择器的组织方式也决定了后期改版时的改造成本。我的练习方法是每写一个页面先不写任何 CSS只把结构搭出来然后检查三件事。第一去掉所有样式之后这个页面在纯文本状态下读起来是不是还讲得通有没有一堆 div 完全分不清谁是谁的情况。第二标题层级有没有乱是不是出现了正文里用三级标题但页面上没有二级标题的情况。第三表单控件有没有和标签正确关联点标签文字能不能聚焦到输入框。第三个点最容易被跳过但它是语义化里最实用的部分。我在做一个搜索框练习的时候一开始用的是普通的div包一个输入框加一个按钮点搜索两个字完全没反应因为那两个字根本就是个装饰性的div。改成正确的表单结构之后不但点击能聚焦键盘的 Tab 顺序也自动正确了还白得了一个回车提交的能力。那一刻我才明白语义化不是你额外付出的成本它是浏览器免费给你的能力你不用反而要自己写代码补。再补充一个实操细节练习阶段我建议强制自己用最少嵌套。新手特别容易写成每层只有一个子元素的俄罗斯套娃五层 div 包一个文字。这样的结构写 CSS 时选择器会越写越长改起来极其痛苦。我的自检标准是如果一个容器里面只有一个子元素且这个容器没有任何独立样式那就把它删掉。这个规则帮我砍掉了大量无用嵌套。4.2 CSS 盒模型与尺寸计算必须动手算一遍盒模型是整块 CSS 里最需要算的部分光看讲解是学不会的。我建议你拿一个具体元素把它的尺寸从头算一遍算完再打开调试面板对照。标准盒模型下一个元素在页面上占的总宽度是这样算的总宽度 内容宽度 左右内边距 左右边框 左右外边距举个具体例子内容宽度 200px左右内边距各 20px左右边框各 1px左右外边距各 10px。总宽度 200 20×2 1×2 10×2 200 40 2 20 262px这时候如果你要把它和另一个同样宽 200px 的元素并排放在一个 500px 的容器里你会发现放不下因为实际占了 262px 加 262px 等于 524px超了。新手在这里最常见的反应是我明明设的 200px 怎么放不下其实是被内边距和边框撑开的。解决办法是把盒模型改成边框盒也就是让宽度包含内边距和边框* { box-sizing: border-box; }改完之后你设 200px内容区域会自动被压缩总宽就是 200px 加上外边距。我现在的习惯是每个练习项目开头就把这条规则写上省掉后面大量的调试时间。但练习阶段我建议你前两周别写就用默认的标准盒模型强制自己把每次的尺寸算一遍。等你算到看见数值就能反应过来、算到不用打开调试面板也知道会不会溢出再统一改成边框盒。还有一个必须动手练的点垂直居中。这玩意儿方法太多每种方法的适用条件都不一样。我把练习时试过的几种整理成表方法适用场景关键条件我踩过的坑行高等于高度单行文字容器高度固定多行文字会溢出上下内边距相等内容高度不确定无容易算错导致上下不等绝对定位加位移元素宽高已知或未知均可父元素需定位忘记给父元素加定位元素飞到页面顶部外边距自动块级元素水平居中元素必须有明确宽度不设宽度自动外边距无效Flex 对齐各种场景父元素设为 Flex 容器主轴方向搞反对齐属性用错轴最后一行那个坑我踩了不止一次。Flex 里水平居中和垂直居中用的是两个不同属性一个管主轴一个管交叉轴一旦把容器方向改成竖向排列这两个属性的作用就互换了。我当时的解决办法很土在纸上画一个箭头标出主轴方向然后再选属性。画了七八次之后就不用画了。4.3 浮动与定位老技术为什么还得练有人会问现在都 Flex 和 Grid 了还练浮动干嘛。我的回答是你得知道你在改什么。大量存量项目和大量老教程还在用浮动布局你完全看不懂浮动接手一个老页面就跟看天书一样。而且浮动带来的父元素高度塌陷问题是理解块级格式化上下文最好的入口这个东西在后面解决各种奇怪布局问题时反复出现。浮动练习的核心就两件事怎么让元素浮起来怎么让父元素重新包住它。第二件事有三种常见做法/* 做法一给父元素加 overflow */ .parent { overflow: hidden; } /* 做法二父元素末尾加一个空元素清除浮动 */ .clearfix { clear: both; } /* 做法三用伪元素清除最干净 */ .parent::after { content: ; display: block; clear: both; }做法一最省事但有副作用它会把超出容器的内容裁掉如果你的页面里有下拉菜单或者提示气泡要溢出去就全被切了。做法二要在 HTML 里塞一个纯样式的空标签语义上不干净。做法三是我现在的默认选择不污染 HTML也没副作用。这三种做法的差异光看视频是记不住的必须每种都用一遍然后自己制造一个内容溢出的场景看看做法一坏在哪。我就是在做了这个实验之后才真正理解为什么大家都推荐伪元素那种写法的。定位这块重点练absolute和relative的配合。规则很简单绝对定位的元素会往上找最近的、有定位的祖先元素作为参照。所以子绝父相这个口诀的本质是给父元素一个相对定位但不改变它的位置好让子元素有个参照物。我在练习的时候故意做过一个对照实验给父元素加相对定位和不加各跑一遍看子元素跑到哪里去了。不加的时候它跑到了整个页面的左上角因为再往上找不到参照物了。这个实验做一次比背十遍口诀管用。4.4 DOM 操作与事件从能跑到能维护JS 部分的练习我建议从查询元素、改内容、改样式这三件事开始然后立刻进入事件。因为没有事件你改的东西用户触发不了练起来毫无反馈很容易放弃。第一个必练的案例是点击切换。结构大概是一个按钮列表加一个内容区点哪个按钮就显示对应内容。这个案例练的是查元素、遍历、绑事件、切换类名。写第一遍的时候我是给每个按钮单独绑事件的代码重复得厉害六个按钮写了六段几乎一样的代码。第二遍我改用循环绑定代码短了一半。第三遍我学了事件委托只在父容器上绑一次靠事件对象的target判断点的是谁。三遍下来我对事件冒泡这个东西的理解就从知道有这么回事变成了知道它为什么有用。事件委托为什么重要我举个自己踩的坑。做待办列表的时候我一开始给每个删除按钮都绑了事件然后测试的时候先加了三条待办删掉第一条再从列表里加第四条——新加的第四条点删除没反应。原因很明确事件是在那三条已经存在的按钮上绑的第四条是后来才创建的它身上根本没有事件。当时我的解决办法是每次添加新的待办之后把所有的删除按钮重新绑一遍事件。这个办法能跑但极其丑陋而且重复绑定会导致老按钮触发两次。改成事件委托之后问题一次性消失代码也短了。除了事件还有两个必须练的小东西定时器和本地存储。定时器练一个轮播图或者倒计时能让你理解异步这个概念不是玄学本地存储练一个刷新不丢数据的待办列表能让你第一次体会到数据和界面是两回事。我在做这个练习的时候刻意把数据存在一个数组里界面每次根据数组重新渲染而不是直接操作页面元素。这个思路当时只是觉得清爽后来学框架的时候才发现这就是所谓数据驱动视图的雏形早一点建立这个直觉后面学任何框架都轻松。5. 常见问题与排查技巧实录5.1 样式完全不生效的排查顺序这个问题我踩过太多次后来总结出一个固定顺序按这个顺序走基本五分钟内能定位看选择器有没有写错。类名少个点、多个空格、拼错字母这是最高频的。看选择器优先级够不够。你写的是类选择器但目标元素上有行内样式那你怎么写都覆盖不了。看样式表有没有被正确引入。路径写错、文件名大小写不对整张表都没加载。看有没有被后面的规则覆盖。同样的优先级写在后面的赢。看浏览器缓存。改了没反应强制刷新一下。这个顺序的设计逻辑是从最可能、最容易查的开始。第 1、2 条在调试面板里一眼就能看到第 3 条看网络面板有没有 404第 4 条看样式面板里那条规则有没有被划掉第 5 条是兜底。我早期的问题基本都是顺序乱跳一上来就怀疑缓存刷新十遍没用最后发现是类名少了个点。实操心得给元素加一个绝对不会生效的测试样式比如outline: 3px solid red如果页面上能看到红框说明选择器是通的问题在具体属性上看不到红框说明选择器本身有问题。这个办法能在一秒内把问题范围砍掉一半。5.2 布局错位与塌陷类问题速查布局问题最烦人因为它往往没有报错页面就是看起来不对。我把练习阶段遇到的整理成一张速查表现象最可能的原因排查动作父元素高度为 0背景色看不见子元素全部浮动父元素没包住在调试面板临时加overflow: hidden看是否恢复两个块级元素并排但掉下来了两者宽度加内边距边框超出容器算一遍实际总宽或临时改边框盒元素之间有多余空隙行内元素之间的换行符被当成空格把标签写在同一行或给父元素设字号为 0垂直外边距看起来比设置的大上下相邻元素的外边距发生合并只给一个方向设外边距或给父元素建立新的层叠上下文文字垂直方向偏上或偏下行高与字号配合问题单独设行高不要依赖默认值绝对定位元素跑到页面顶部父元素没有定位参照物变成了页面给父元素加相对定位表里第三行那个多余空隙害我查了半小时。当时做一排并排的图片怎么调都差那么几个像素我以为是外边距一个个清零都没用。后来在调试面板里看到每个图片盒子之间有一段空白才反应过来是 HTML 里标签换行产生的空白字符。解决方案有三个标签全写一行可读性差、父元素设字号 0 再给子元素单独设回来略绕、改用 Flex 布局最干净。我现在一律选第三个。第四行的外边距合并也是经典坑。两个上下相邻的块上面设下外边距 20px下面设上外边距 30px你以为中间会有 50px实际只有 30px因为浏览器取了较大的那个。这个行为在标准里写得很清楚但新手不看标准就会觉得我的设置被吃掉了。解决办法也简单只给一个方向设外边距养成习惯别两边都设。5.3 JS 完全不执行或事件没反应JS 的问题排查第一步永远是打开控制台看有没有红字。有红字先解决红字绝大多数时候红字解决完功能就正常了。没有红字但功能不生效按下面几条查第一脚本放的位置对不对。如果脚本写在页面顶部而它要操作的元素在下面脚本执行的时候元素还不存在查出来就是空值。经典表现是报无法读取空值的属性。解决办法要么把脚本放到页面末尾要么把逻辑包在页面加载完成的事件里。我早期特别喜欢把脚本放在顶部因为看起来整齐结果被这个问题坑了无数次。第二选择器查到的到底是哪个。页面上有多个同名元素的时候查单个只会拿到第一个你给第二个绑的事件当然不生效。这种情况我一般会在查完之后立刻打印一下看看拿到的是不是我以为的那个。第三事件绑定的对象对不对。比如你想给按钮绑结果绑到了按钮外面的容器上点容器空白处能触发点按钮反而不行。第四有没有被别的元素挡住。这个最隐蔽元素明明在那儿事件就是不触发因为有个透明的层盖在上面。解决办法是在调试面板里给可疑元素加个高亮背景或者临时把上层元素隐藏掉看看。一个很省时间的习惯写 JS 的时候每完成一小步就打印一次中间结果。查元素之后打印一下绑事件之后在回调里打印一下改完样式之后打印一下。看起来啰嗦但一旦出问题你能立刻知道是哪一步断的而不是从头到尾重新怀疑一遍。5.4 案例跑得起来但经不起改的三种典型情况这是练习到中后期才会暴露的问题也是最值得警惕的。第一种情况是硬编码路径图片用的是本机的绝对路径案例在你自己电脑上跑得好好的换个目录就全变成裂图。解决办法是从一开始就写相对路径并且保持目录结构和引用路径严格对应。第二种情况是样式和结构耦合过深。你写选择器的时候用了很长的层级链比如外层容器下的第二个子元素的第一个链接案例只要能跑就行。但等你改一下结构加个包裹层样式全崩。我的做法是尽量只用类选择器最多两层避免用第几个子元素这种依赖顺序的选择器。第三种情况是逻辑写死在事件里。比如选项卡切换你把点第一个按钮显示第一块内容这种映射关系直接写死在四个回调里。想加第五个选项卡就得再复制一段。正确做法是先抽一个数组存数据和对应关系然后循环生成。这个改造我第一次做的时候花了四十分钟做完之后加第五个选项卡只需要加一行数组元素。从能跑到能改中间隔着的就是这一步抽象练习阶段越早建立这个意识后面写任何东西都会更从容。6. 练习节奏、验收标准与个人体会6.1 每日时间分配与可持续的练习节奏我试过两种节奏效果差别很大。第一种是周末集中练六个小时结果周一全忘而且中间那两个小时的效率低得可怕。第二种是每天固定一个半小时连续练效果完全不一样因为每天都能保持手感前一天卡住的东西在睡眠之后反而更容易想通。一个半小时我是这么分的前二十分钟看视频和做笔记中间五十分钟关掉视频自己写最后二十分钟改需求或者复盘。中间那五十分钟必须是完整不被打断的因为写代码进入状态需要时间被打断一次至少要十分钟才能回来。我当时把手机放到另一个房间一开始觉得夸张试了一周之后发现这是最有效的一个改动。复盘那二十分钟我只做一件事在笔记里写下今天卡住的点和解决方式。不用写得多漂亮一句话就行比如浮动导致父元素高度塌陷 → 伪元素清除。一个月下来这份笔记会变成你自己的问题索引比任何教程都贴合你的情况因为里面全是你真实踩过的坑。6.2 我用的验收清单和几条实话最后分享一下我自己用的验收清单。每完成一个阶段我会对着这几条自查一遍任何一条过不了就回去补验收项通过标准结构去掉所有样式后页面内容仍能读通布局不看调试面板能说出元素的实际占位宽度样式任意改一处内边距能预判会不会溢出交互关掉视频能在四十分钟内复现案例扩展能加一个视频里没有的需求且不破坏原有结构代码没有重复到夸张的代码块没有依赖第几个子元素的选择器说实话这套练习做完我最大的感受不是我学会了很多新东西而是我以前以为自己会的东西有一半是没掌握的。这个发现不太舒服但它很有用因为它让我在后面看任何新框架的时候不再急着跳过基础部分而是会先问一句这个东西解决的是哪个老问题它为什么比老办法好。还有个小技巧分享给同样在重拾的人每完成一个阶段把之前做过的某个案例重新做一遍。不要看旧代码从空文件开始。间隔一两周之后重做你会发现自己不但没忘还写出了比第一遍更短的代码。这种看得见的进步是坚持下去最大的动力比任何打卡都有用。我现在的练习目录里躺着二十多个案例其中大概有六个是被我重做过两三遍的那几个恰好是我现在最有把握的部分。
阅读完成 · 觉得有帮助?
咨询建站