9月份学习记录

 

第一章    绪论

在计算机行业中，似乎天生带着“难”的底色,可这份“难”的背后，也藏着行业独有的吸引力。

计算机行业的薪资水平，始终处于普通人可触及的高薪行业之列，这份实实在在的回报，

成了我咬牙坚持的动力；

 第二章    学习方法

在我前端学习过程中呢，遇到了许许多多的问题和困难，那就对于我⽽⾔
这些⼤致分为两类：1 记忆类。2理解类。

 2.1    记忆类

真的就是纯记忆啊，⽐如说 JS 的⼋⼤基本类型：这需要理解吗？不需要吧
我就是⽤谐⾳记的（u so nb）翻译过来就是：
undifined  string  symbol  object  null  number  boolean  bigint
我⾃⼰实践的确确实实⾼效的⽅法是：通过输出倒逼记忆留存
学习完⼀天的内容后写⼀篇总结⽂章，画⼀个知识图，给他⼈讲解（哪怕是空⽓），讲不明⽩的地⽅就是记忆漏洞。
毫不夸张地说，通过这些就可以把 99%的记忆类知识给搞定了。

 2.2    理解类

理解性的东⻄就很神奇，你发现即使你再怎么输出，输出再多，你要是不理解，那就是 “盲⼈骑瞎⻢ —— 没把握” 。这类问题⾸先就是看⽂档，看好⻓时间还是不理
解，就去问AI，AI有时真的既方便又快捷，若还不理解，就去找视频，看了好⼏个视频依旧没有理解，就去问⼤佬，这个佬不⾏就去问那个佬，问完之后请他喝个奶茶，吃个饭应该是没有问题的吧。
一般到这⾥就会理解了，毕竟你前⾯沉淀了那么久，对不对？但如果你的脑⼦像是扭成了一根筋一样，死活不开窍，那我只能说：先把这问题扔边去，过⼏天再来战⽃！ 可不能因为这样⼀个⼩⼩的事情影响咱们的⼼情，影响咱们的⽣活 ！
毕竟⼈的⼤脑认知⽔平是有限的，等过⼀段时间那些曾经让你绞尽脑汁也理解不了的
东⻄，也许在某⼀个微妙的时刻瞬间就恍然⼤悟了！

 第三章    关于JS

3.1     认知迭代

我发现学习是存在认知迭代的, 就是我最开始学习所形成的理解极有可能是一种片面认知, 随着对知识的深入接触, 最终形成了更全面,更本质的理解.

比如有一次当我跟着视频做后台管理系统的时候,遇到了这样一个问题:
就是当我做到一个阻止链接跳转的小demo时(代码如图3.1):

                    图3.1 阻止链接跳转的代码片段

我以为这个传入的参数e ,目的就是借用e来调用preventDefault() 这个函数.
我把这个e理解为一种媒介,就是换了字母f也行, g也行. 但其实这样理解并不完全正确.
后来在读MDN文档的时候, 才发现这里的e (event) 其实叫做事件对象, e的作用远不止调用prventDefault(),它还包含了事件的核心信息,比如:
e.target: 触发事件的DOM元素(比如具体是哪个链接被点击)
e.type: 事件类型(如点击事件click, 键盘事件keydown)
prventDefault()只是事件对象的一个方法,但事件对象的价值更多体现在它承载的事件细节上.

 3.2     拦路虎

### 3.2.1 发现

记得我第一次学Vue时,没有看文档,只是跟着视频做着一个个小demo, 过了一遍Vue.
可回过头来总结的时候,发现我自己连最基本的reactive的工作原理都没搞清楚.
当研究reactive时, 又发现reactive这个API里面的Proxy是个什么东西啊?
要知道Vue3是基于Proxy实现响应式的  (Vue2使用 Object.defineProperty 实现响应式，但只能监听对象的属性变化)
所以我一定要拿下Proxy

图3.2 用Proxy自定义获取一个对象的属性

可当时看到 处理器,  陷阱,  target , 不变式, 反射(reflect) 的时候直接懵了.这都什么意思啊?一大堆不懂的名词扑面而来.
然后我就尝试着理解这些概念, 一天 ,二天, 一周然后越拖越久,直到有一天我看了一下reactive的核心源码实现.

图 3.2.1 有关Proxy中的术语

### 3.2.2 解决

                     图 3.2.2 raective的核心源码底层逻辑

因为reactive是对对象的引用,当响应式对象的属性被修改时,依赖该属性的组件就
会自动重新执行.
那么我此时再把proxy的概念带入到reactive中去.
handler就相当于是包含get,set 的配置对象
target就相当于那个obj,即被包装成响应式的原始对象
set 和get就相当于是陷阱,,而且陷阱这个名称非常的形象,当代码试图对对象执行
某些操作的时候,这些操作会掉进我预设的陷阱里,而不是直接作用于原始对象

所以这也就印证了Proxy的概念:
proxy对象可以拦截某些操作并实现自定义功能.
通过将reactive的核心源码实现与proxy的基本概念对比起来.
就很容易理解proxy究竟是个什么东西了 !

 第四章    关于Vue

当时了解到Vue比React更容易上手,所以就先学了Vue
大概4个Vue项目是跟着视频做的
跟着视频的问题是:
即使是很新的视频, 24年的,存在后端接口不能用,崩掉,或者用着用着就过期了等情况

我认为Vue最不好理解的就是Vue的基本原理, 每次看都能有新发现,新认识.
Vue的核心思想是数据驱动视图. 传统的DOM操作需要手动修改DOM才能更新视图, 而Vue会让视图自动更新.自动渲染

还有就是Vue的响应式系统, 前面也说到过Vue3的响应式系统主要通过Proxy,
Vue2是通过Object.defineProperty.
之前背过一道面试题: Vue和React的区别是什么? 了解到react强调组件化和函数式编程.
并且react对TS的兼容要比Vue强很多
后续未来也会学一下react, 做一做react项目.

 第五章    未来计划

首先是夯实基础:
基础打牢真的是太重要了,很多深层次的问题都是建立在基础上的...

然后是多做项目:
多做项目不仅能巩固知识,还能遇见各种各样新的东西

最后是拓宽技术栈:
假如面试官在两份很相似的简历中去筛选,一份:会Three.js ,另一份没有写,那么大概率那位会three.js的人会获得面试机会...