JS再学习 | 青训营笔记

57 阅读2分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第3天

重点知识

各司其职

问题优化 版本 1 js直接操作css样式

image.png

版本2 改变类 image.png

版本3 纯css 伪类选择器 lable标签指定元素绑定checkBox

image.png

image.png

组件封装

方法1 :构造函数太复杂

image.png

image.png

解耦,插件与主件通过依赖注入方式建立联系,如果不要一个组件,直接删html,+注释对应已注册的插件

image.png

过程抽象

  • 用来处理局部细节控制
  • 过程抽象是函数思想的基础
    image.png
    在想象过程抽象中,可以抽象成有一个房间,房间里面的门,窗,然后房间空间本身都是数据,但是开门或者开窗这个动作、行为就是过程,也就说我们不仅可以将门,窗,空间抽象成数据,这个过程也是可以来作为抽象对象的。

image.png 操作次数限制 操作次数限制常用场景有

一些异步交互 一次性的HTTP请求 通过高阶函数,以函数作为参数,就能得到写出一个只执行一次或者限制次数的函数,例如下面Once()函数,这个函数的参数是一个函数fn,然后执行时会返回一个函数出去,在返回函数中间进行判断fn是否存在,如果存在则用实际参数执行fn,然后将fn=null这样下次就不会执行该函数。例如下面,我声明了一个show函数,其中求a+b的和,并且打印了字符串,在下面我讲这个函数赋值给foo=once(show),然后调用了三次foo(),控制台中只执行了一次。

个人理解

本期的讲师真是让人耳目一新,讲的不是js基础,而是js的编码原则,通过几个案例的对比,有助于我改善以往不好的编码习惯

参考链接

blog.csdn.net/weixin_4566…