- 博客(43)
- 收藏
- 关注
原创 双向数据绑定是什么
我们先从单向绑定切入单向绑定非常简单,就是把Model绑定到View,当我们用JavaScript代码更新Model时,View就会自动更新双向绑定就很容易联想到了,在单向绑定的基础上,用户更新了View,Model的数据也自动被更新了,这种情况就是双向绑定,举个例子:/wp:image。
2025-10-13 13:19:58
382
原创 什么是防抖和节流?有什么区别?如何实现?
wp:list节流:n秒内只运行一次,若在n秒内重复触发,只有一次生效防抖:n秒后在执行该事件,若在n秒内被重复触发,则重新计时/wp:list⼀个经典的⽐喻:想象每天上班⼤厦底下的电梯。把电梯完成⼀次运送 ,类⽐为⼀次函数的执⾏和响应假设电梯有两种运⾏策略 debounce 和 throttle ,超时设定为15秒 ,不考虑容量限制 电梯第⼀个⼈进来后 ,15秒后准时运送⼀次 ,这是节流电梯第⼀个⼈进来后 ,等待15秒。
2025-10-12 11:03:55
784
原创 说说你对事件循环的理解
从上面我们可以看到,同步任务进入主线程,即主执行栈,异步任务进入任务队列,主线程内的任务执行完毕为空,会去任务队列读取对应的任务,推入主线程执行。上面的例子中,await会阻塞下面的代码(即加入微任务队列),先执行async外面的同步代码,同步代码执行完,再回到async函数中,在执行之前阻塞的代码。4.跳到new Promise这里,直接执行,打印promise1,下面遇到.then,它是微任务,放到微任务列表等待执行。6.继续执行下一个微任务,及执行then的回调,打印promise2。
2025-10-11 10:41:41
393
原创 谈谈对this的理解
函数的this关键字在JavaScript中表现的略有不同,此外,在严格模式和非严格模式之间也会有一些差别在绝大多数情况下,函数的调用方式决定了this的值(运行时绑定)this关键字是函数运行自动生成的一个内部对象,只能在函数内部使用,总指向调用它的对象举个例子:// 当前调用栈是:baz// 因此,当前调用位置是全局作用域bar();// 当前调用栈是:baz -> bar// 因此,当前调用位置在baz中foo();// 当前调用栈是:baz -> bar -> foo。
2025-09-08 13:06:40
776
原创 原型链和原型
1,每个对象均存在隐式原型(proto),函数对象才有prototype属性2,proto存在的意义在于为原型链查找提供方向,原型链查找靠的是proto,而不是prototype3,函数对象的proto都指向Function.prototype4,每个对象都有一个隐式原型属性(proto),多个原型通过proto链接在一起形成的链式结构就是原型链。
2025-09-04 15:23:04
648
原创 typeof与instanceof区别
虽然typeof null为object,但这只是JavaScript存在的一个悠久Bug,不代表null就是引用数据类型,并且本身也不是对象。所以,null在typeof之后返回的是有问题的结果,不能作为判断null的方法。如果需要通用检测数据类型,可以采用Object.prototype.toString,调用该方法,统一返回格式"[object Xxx]"的字符串。同时,可以发现引用类型数据,用typeof来判断的话,除了function会被识别出来之外,其余的都输出object。
2025-09-04 12:11:46
363
原创 DOM常见的操作有哪些?
DOM(文档对象模型)是HTML/XML文档的编程接口,通过节点层级结构表示文档内容。常见操作包括:创建节点(createElement/createTextNode/createDocumentFragment)、查询节点(querySelector/getElementById等)、更新节点(innerHTML/innerText/style)、添加节点(appendChild/insertBefore)和删除节点(removeChild)。其中文档片段(DocumentFragment)能优化性能,减
2025-09-03 22:57:47
868
原创 单多行文本溢出
在日常开发展示页面,如果一段文本的数量过长,受制于元素宽度的因素,有可能不能完全展示,为了提高用户的使用体验,这个时候就需要我们把溢出的文本显示成省略号对于文本的溢出,我们可以分成两种形式:wp:list单行文本溢出多行文本溢出/wp:list。
2025-09-02 19:58:55
989
原创 css中 ,有哪些⽅式可以隐藏页⾯元素? 区别?
在平常的样式排版中,我们经常遇到将某个模块隐藏的场景通过css隐藏元素的方法有很多种,它们看起来实现的效果是一致的但实际上每一种方法都有一丝轻微的不同,这些不同决定了在一些特定场合下使用哪一种方法。
2025-09-02 12:13:09
849
原创 如何实现两栏布局 ,右侧⾃适应? 三栏布局中间⾃适应呢?
基于绝度定位的三栏布局:注意绝对定位的元素脱离文档流,相对于最近的已经定位的祖先元素进行定位。两栏布局实现效果就是将页面分割成左右宽度不等的两列,宽度较小的列设置为固定宽度,剩余宽度由另一列撑满。比如Ant Design文档,蓝色区域为主要内容布局容器,侧边栏为次要内容布局容器。注意的是,flex容器的一个默认属性值align-items:stretch;这里称宽度较小的列父元素为次要布局容器,宽度较大的列父元素为主要布局容器。在日常布局中,无论是两栏布局还是三栏布局,使用的频率都非常高。
2025-09-01 23:44:57
993
原创 什么是响应式设计?响应式设计的基本原理是什么?如何做
wp:imagewp:heading响应式布局优点可以看到:wp:list面对不同分辨率设备灵活性强能够快捷解决多设备显示适应问题/wp:list缺点:wp:list仅适用布局、信息、框架并不复杂的部门类型网站兼容各种设备工作量大、效率低下代码累赘,会出现隐藏无用的元素,加载时间长其实这是一种折中性质的设计解决方案,多方面因素影响而达不到最佳效果一定程度上改变了网站原有的布局结构,会出现用户混淆的情况/wp:list。
2025-09-01 12:29:08
757
原创 谈谈对BFC的理解
两个p元素之间的距离为100px,发生了margin重叠(塌陷),以最大的为准,如果第一个p的margin为80的话,两个P之间的距离还是100,以最大的为准。当BFC计算高度时,浮动元素也会参与,所以我们可以触发.par元素生成BFC,则内部浮动元素计算高度时也会计算。BFC目的是形成一个相对于外界完全独立的空间,让内部的子元素不会影响到外部的元素。原因是元素之间相互的影响,导致了意外的情况,这里就涉及到BFC概念。前面讲到,同一个BFC的两个相邻的盒子的margin会发生重叠。这时候,边距则不会重叠。
2025-08-31 13:49:25
774
原创 CSS盒模型理解
当对一个文档进行布局(layout)的时候,浏览器的渲染引擎会根据标准之一的CSS基础框盒模型(CSS basic box model),将所有元素表示为一个个矩形的盒子(box)一个盒子由四个部分组成:content、padding、border、margincontent,及实际内容,显示文本和图像border,即边框,围绕元素内容的内边距的一条线或多条线,由粗细、样式、颜色三部分组成。
2025-08-27 13:03:34
897
原创 ReactRouter
一个路径 path 对应一个组件 component 当我们在浏览器中访问一个 path 的时候,path 对应的组件会在页面中进行渲染路由系统中的多个路由之间需要进行路由跳转,并且在跳转的同时有可能需要传递参数进行通信。
2025-08-22 01:44:04
310
原创 Redux
Redux 是React最常用的集中状态管理工具,类似于Vue中的Pinia(Vuex),可以独立于框架运行作用:通过集中管理的方式管理应用的状为什么要使用Redux?独立于组件,无视组件之间的层级关系,简化通信问题单项数据流清晰,易于定位bug调试工具配套良好,方便调试。
2025-08-22 01:43:19
423
原创 React基础下
概念:自定义Hook是以use打头的函数,通过自定义Hook函数可以用来实现逻辑的封装和复用// 封装自定义Hook// 问题: 布尔切换的逻辑 当前组件耦合在一起的 不方便复用// 解决思路: 自定义hook// 可复用的逻辑代码value)// 哪些状态和回调函数需要在其他组件中使用 returnreturn {value,toggle// 封装自定义hook通用思路// 1. 声明一个以use打头的函数// 2. 在函数体内封装可复用的逻辑(只要是可复用的逻辑)
2025-08-22 01:42:38
375
原创 力扣13.罗马数字转整数
若存在小的数字在大的数字左边的情况,根据规则需要减去小的数字。对于这种情况,我们也可以将每个字符视作一个单独的值,若一个数字右侧的数字比它大,则将该数字的符号取反。通常情况下,罗马数字中小的数字在大的数字的右边。若输入的字符串满足该情况,那么可以将每个字符视作一个单独的值,累加每个字符对应的数值即可。数字 1 在数字 5 的左边,所表示的数等于大数 5 减小数 1 得到的数值 4。通常情况下,罗马数字中小的数字在大的数字的右边。(10) 的左边,来表示 4 和 9。关于罗马数字的详尽书写规则,可以参考。
2025-08-21 19:17:00
829
原创 Electron快速上手
Electron是一个跨平台桌面应用开发框架,开发者可以使用:HTML、CSS、JavaScript 等 Web 技术来构建桌面应用程序,它的本质是结合了Chromium和Node.js新版 QQ。
2025-07-27 20:23:37
1100
原创 js数据类型
JavaScript数据类型分为基本类型和引用类型,主要区别在于存储位置不同。基本类型包括Number、String、Boolean、Undefined、Null和Symbol,存储在栈内存中,赋值时会创建新值。引用类型如Object、Array、Function等存储在堆内存中,栈内存保存指向堆内存的地址,赋值时复制的是引用地址而非实际值,因此多个变量可能指向同一对象。基本类型赋值产生独立副本,而引用类型赋值会共享同一对象,修改会相互影响。
2025-06-04 09:50:09
576
原创 数据库06
上面我们介绍了数据库中常见的约束,以及约束涉及到的关键字,那这些约束我们到底如何在创建表、在为字段添加约束时,我们只需要在字段之后加上约束的关键字即可,需要关注其语法。把表结构创建完成,然后接下来,就可以通过一组数据进行测试,从而验证一下,约束是否可以。我们发现,父表的数据删除成功了,但是子表中关联的记录也被级联删除了。添加了外键之后,再删除父表数据时产生的约束行为,我们就称为删除。只需要在创建表的时候,根据我们的需要选择对应的约束即。我们发现父表的记录是可以正常的删除的,父表的数。
2025-05-06 11:03:54
1095
原创 数据库05
查询所有员工的入职天数,并根据入职天数倒序排序。通过数据库的函数,生成一个六位数的随机验证码。语句中实现条件筛选,从而提高语句的效率。流程函数也是很常用的一类函数,可以在。,然后舍弃小数部分,如果长度不足。函数,但是获取出来的随机数是在。入职天数,就是通过当前日期。之间的,所以可以在其基础。:获取两个日期相差的天数。时间值加上一个时间间隔。入职日期,所以需要使用。表的员工姓名和工作地址。的四舍五入的值,保留。:增加指定的时间间隔。
2025-05-05 23:09:01
869
原创 MySQL笔记04
上述只是简单罗列了常见的几种权限描述,其他权限描述及含义,可以直接参考。,用来管理数据库用户、控制数据库的访。仅代表只能够在当前本机访问,是不可以。主机名的方式,来唯一标识一个用户。代表的是访问该数据库的用户名。授权时, 数据库名和表名可以使用。开发人员操作的比较少,主要是。可以在任意主机访问该数据库。多个权限之间,使用逗号分隔。数据库所有表的所有操作权限。代表当前用户访问的主机。进行通配,代表所有。
2025-03-12 23:29:03
803
原创 MySQL笔记03
在一个正常的业务系统中,查询操作的频次是要远高于增删改的,当我们去访问企业官网、电商网站,在这些网站中我们所看到的数据,实际都是需要从数据库中查询并展示的。而且在查询的过程中,可能。分页操作在业务系统开发时,也是非常常见的一个功能,我们在网站中看到的各种各样的分页条,后台。分组之后,查询的字段一般为聚合函数和分组字段,查询其他字段无任何意义。岁员工的姓名和年龄,并对查询结果按年龄升序排序,如果年龄相同按。分页查询是数据库的方言,不同的数据库有不同的实现,语句的完整语法,及编写顺序,接下来,我们要。
2025-03-09 19:56:19
718
原创 MySQL笔记02
insert into employee(id, workno, name, gender, age, idcard, entrydate) values (1,'1','Itcats','男',10,'123456789012345678','2000-01-01');修改语句的条件可以有,也可以没有,如果没有条件,则会修改整张表的所有数据。语句的条件可以有,也可以没有,如果没有条件,则会删除整张表的所有数。插入数据时,指定的字段顺序需要与值的顺序是一一对应的。插入的数据大小,应该在字段的规定范围内。
2025-03-09 14:16:43
564
原创 DataGrip基本使用
当我们想在数据库创建一个表时,右击这个数据库,点击新建,点击表。鼠标右击mysql,点击新建,点击架构。如果想设置字段,鼠标右击列,点击新建,输入完后点击确定。如果想修改表,鼠标右击然后点击修改就会出现修改页面。然后输入自己的用户名和密码,第一次要下载驱动文件。然后点击应用,再点击确定,那么这个连接就建立好了。然后点击测试连接,出现这样的界面就说明成功了。然后点击+号,点击数据源,点击mysql。然后输入自己的项目名称,点击确定。进入到主页,点击新建项目。那么这个表就创建成功了。然后输入数据库的名字。
2025-03-09 00:56:58
1281
原创 MySQL笔记01
Data Definition Language,数据定义语言,用来定义数据库对象(数据库,表,字段)。char 与 varchar 都可以描述字符串,char是定长字符串,指定长度多长,就占用多少个字符,和。字段值的长度无关。而所谓二维表,指的是由行和列组成的表,如下图(就类似于Excel表格数据,有表头、有列、有行,通过这条指令,我们可以查看到指定表的字段,字段的类型、是否可以为NULL,是否存在默认值等信。我们要操作某一个数据库下的表时,就需要通过该指令,切换到对应的数据库下,否则是不能操作的。
2025-03-08 00:48:12
1000
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅