- 博客(40)
- 收藏
- 关注
RSS订阅原创 Fiber
JavaScript引擎和页面渲染引擎两个线程是互斥的，当其中一个线程执行时，另一个线程只能挂起等待如果JavaScript线程长时间地占用了主线程，那么渲染层面的更新就不得不长时间地等待，界面长时间不更新，会导致页面响应度变差，用户可能会感觉到卡顿而这也正是 React 15 的 Stack Reconciler 所面临的问题，当React在渲染组件时，从开始到渲染完成整个过程是如果组件较大，那么js线程会一直执行，然后等到整棵VDOM树计算完成后，才会交给渲染的线程。
2023-09-11 16:14:55
330
原创 函数式编程
上面说了纯函数的定义，相同输入会带来相同的输出，没有副作用第一条很好理解，第二条没有副作用看起来很奇怪，这个也是药物么，有副作用啥的？副作用指不影响外部环境，也就是只关注于函数自身的变化，不去改变其他函数和变量维护的值；常见的副作用为修改全局变量的值、操作DOM节点等。
2023-09-08 11:55:05
176
原创 antd中Radio组件defaultChecked无效
使用Radio自带的defaultChecked和checked都无效，后来查询后得出，需要在Radio.Group中写defaultValue才会有默认选中的效果，但是这样的形式表单无法收集到他的值，也就是Form.getFieldsValue()收集不到Group中defaultValue的值，校验也无法通过，所以采用了useEffect生命周期的形式在组件挂载时使用setFieldsValue手动设置Radio在表单当中的值，校验通过，UI形式也生效；如果有更好的方法可以留言，大家一起进步;
2023-08-11 09:41:38
698
原创 antd中Form如何自己手动调用onFinish方法
在一个ModalForm的浮层表单当中(Procomponents)，不想使用Fomr自带的提交和重置按钮，所有在submitter中自定义render了一个button用于提交；但是这个自定义提交的onClick事件并不能触发表单的校验规则，但是在Form提供了onFinish中可以调用，所以需要手动调用onFinish方法。自定义渲染下一步按钮，但是无法触发onFinish方法，不能联动表单校验。可以看到表单有一个字段需要校验，触发校验可以使用onFinish。触发后显示message提示。
2023-08-09 18:53:47
2294
原创 暑期实习经历3
2.弄清楚这个url之后，知道了，除非是线上地址，要不然拿到也没有用，所以也就不考虑这个事情了，然后就把这个目光啊，转向这个base64形式的图片地址了，然后这里我又不懂了，我这个base64形式的地址，是从哪里转出来的呢，是我图片存储的地址，还是图片本身？这样的表示，这也是很多图片上传的时候，图片没有办法进行回显的原因，只有有这样标识的base64形式的字符串才会被视为图片，才会在回显的时候被特殊解析，能够回显，然后就没有然后了，这个图片的参数就随着后端接口被发送了...我又双叒叕来写实习经历了....
2023-08-04 15:33:09
170
原创 暑假企业实习2
这里主要是涉及到了一些react的通用技术，都是一些很基础的东西，但是因为没学过react，还是有必要去记录一下的；1.这周我被分配到了Uniqua项目组，去做一个OE Stone的项目，我主要做的是任务调度界面的所有内容以及功能。
2023-07-27 16:49:48
108
原创 暑期公司实习经历笔记1
这篇就说一下前两周的一些经历，剩下的留到后面的文章去说；如果读这篇文章的同学也有进行暑期实习的，我觉得实习嘛，主要是历练自己的一个过程，作为实习生来说，也不可能接受太复杂太难的任务，虽然很多同学实习的目的就是为了学到更多的东西，但是从我实习的角度来说，如果公司分给实习生稍微难一点的任务，并不能保证任务完成的质量和效率，如果完不成还要再加工时去填，这样得不偿失，与其冒险让实习生去尝试，不如让一个正式员工直接去解决，这样来的也快一点。
2023-07-27 12:40:33
201
原创 client&offset&scroll
今天复习的时候看到了图片懒加载这个技术，最简单的方法就是判断用户可视窗口的距离和要懒加载的图片的距离，借此进行判断是否要更改src中真正的请求路径；这种通过js实现懒加载的方式需要对可视窗口的距离进行判断，所以此文记录下client&offset&scroll这三个属性的区别和用法；
2023-05-11 08:29:28
99
原创 ajax状态码
总之，整个XMLHttpRequest对象的生命周期应该包含如下阶段：创建－0初始化请求－1发送请求－2接收数据－3解析数据－4完成。
2023-05-04 16:17:57
352
原创 变量声明提升&函数声明提升
在ES6中，提出了块级作用域和let&const关键字，这就出现了变量提升的概念；因为let&const关键字并不能进行变量提升；而var关键字可以；具体的提升过程可以去看一下我js分类中的js变量提升一章，那里有详细的介绍；
2023-05-04 15:21:15
132
原创 node是什么
由于JavaScript是单线程运行的原因，程序难免会发生请求阻塞的情况，试想如果请求一直没有得到回复，那就会一直处于卡死状态。这是很不好的体验，所以人们就想出了一种异步的方案，等待请求资源返回后执行回调函数。但是Node的功能远远不止这样，Node打破了JavaScript代码只能在浏览器运行的局面，使得。进一步说明了JavaScript的功能不会局限于脚本，而是一门真正的。
2023-04-28 12:39:02
628
原创 Git学习
git是分布式版本控制工具，不需要有中央服务器去存储所有的代码，但是git有一个中心服务器，但他不像集中式版本控制一样将所有的代码都存储到服务器中，git的中心服务器可以被看作为一个普通的pc用户端，它不工作了照样可以进行版本控制和代码交换，只是会变得不方便。
2023-04-27 09:29:45
151
原创 CSS实现多列等高
元素设置的padding-bottom尽可能大一些，并且需要设置一样大小的margin-bottom负值去抵消padding-bottom撑大的区域，正负一抵消，对于页面布局不会有影响。另外的话还需要设置父元素overflow：hidden把子元素多出来的色块背景隐藏掉。flex中的伸缩项目默认为拉伸为父元素的高度，同样可以实现等高效果。在pc端兼容性不是很好，在ie9以及ie9以下不支持。grid布局的缺点和flex一样，pc端兼容性不是很好，ie9以及ie9以下不支持。
2023-04-24 13:00:05
251
原创 {}&new&Object.create的区别
如上图，字面量创建对象和new关键字创建对象的新对象都继承了Object身上的属性和方法，但是Object.create并没有，所以当我们只需要继承原型对象身上所有的属性和方法，就可以使用Object.create方法，如果想要使用构造函数身上的属性和方法，那么推荐使用字面量创建和new关键字之中的一种。
2023-04-23 08:33:44
225
原创 Webpack学习
开发模式就是开发代码时使用的模式这个模式下我们主要做两件事1.编译代码 使浏览器能够识别运行2.代码质量检查 树立代码规范eslint.js//继承eslint规则env:{node:true, //启用全局node变量browser:true, //启用浏览器中全局变量},},rules:{"no-var":2 //不能使用var变量。
2023-04-21 09:32:49
568
原创 执行上下文
JavaScript代码开始运行的默认环境代码进入一个JavaScript函数使用eval()执行代码，JavaScript中有一个执行上下文（Execution context，EC）的概念。也就是说，当JavaScript代码执行的时候，会进入不同的执行上下文，这些执行上下文就构成了一个执行上下文栈（Execution context stack，ECS）。
2023-04-14 15:52:24
137
原创 js变量提升
首先看一下MDN对于变量提升的解释：变量提升（Hoisting）被认为是， Javascript中执行上下文 （特别是创建和执行阶段）工作方式的一种认识。在 ECMAScript® 2015 Language Specification 之前的JavaScript文档中找不到变量提升（Hoisting）这个词。从概念的字面意义上说，“变量提升”意味着变量和函数的声明会在物理层面移动到代码的最前面，但这么说并不准确。实际上变量和函数声明在代码里的位置是不会动的，而是在编译阶段被放入内存中。
2023-04-14 14:34:11
950
原创 Vue中.sync语法糖
sync简单来说就是为子组件修改父组件中的数据提供了简便的方式，以后使用子组件修改父组件的某些数据的时候，就可以使用sync了。
2023-04-14 10:37:09
417
原创 作用域&作用域链
简单来说就是作用域就是一个独立的地盘，让变量不会外泄、暴露出去。也就是说作用域最大的用处就是隔离变量，不同作用域下同名变量不会有冲突。ES6 之前 JavaScript 没有块级作用域,只有全局作用域和函数作用域。ES6 的到来，为我们提供了‘块级作用域’,可通过新增命令 let 和 const 来体现。
2023-04-12 08:58:00
96
原创 js如何实现多线程
使用 worker 构造函数创建 worker 线程，需要传递一个同源脚本文件 URL；使用onmessage方法事件进行消息传递；通过onerror事件处理异常，使用close方法关闭线程；worker 线程任务可以是 JS 脚本文件，也可以是内联脚本；
2023-04-12 07:25:03
2016
原创 node事件循环机制
在node当中，代码总是自上而下执行，同步代码依次执行，异步代码被推入异步模块中等待回调，对应异步代码执行完毕后，其回调会被派发到事件循环队列中的相应队列；在同步代码执行完毕后，先执行nextTick中的代码，再执行微任务队列当中的代码，最后开始事件循环，依次执行其中的任务。
2023-04-11 09:50:56
456
原创 z-index的理解
1、首先先看要比较的两个元素是否处于同一个层叠上下文中：1.1如果是，谁的层叠等级大，谁在上面（怎么判断层叠等级大小呢？——看“层叠顺序”图）。1.2如果两个元素不在统一层叠上下文中，请先比较他们所处的层叠上下文的层叠等级。2、当两个元素层叠等级相同、层叠顺序相同时，在DOM结构中后面的元素层叠等级在前面元素之上。
2023-04-10 21:00:00
111
原创 js垃圾回收机制&闭包
垃圾回收机制（GC：Garbage Collection）：执行环境负责管理代码执行过程中使用的内存。JS的垃圾回收机制是为了以防内存泄漏，内存泄漏的含义就是当已经不需要某块内存时这块内存还存在着，没有被释放，导致该内存无法被使用，垃圾回收机制就是间歇的不定期的寻找到不再使用的变量，并释放掉它们所指向的内存。
2023-04-09 15:02:54
106
原创 flex学习
复习到bootstrap的时候，我明显感觉到了栅格化开发的遍历之处，可以直接通过行&列的并行操作来进行样式布局，用起来非常有感觉，很便捷，但是要写很多很多类名，看起来不是很优雅，所以我开始研究另一种布局方式，弹性盒布局(flex)
2023-04-09 14:04:40
85
原创 JQuery学习笔记
在复习过程中，对js和DOM稍微有一点了解之后，我觉得使用监听器来一个一个监听每一个DOM元素实在是太麻烦了，有一大堆的回调和指令要写，所以我开始接触JQuery库。
2023-04-07 18:00:00
139
原创 浏览器の回流&重绘
回流是重新构建渲染树并进行再次布局以及绘制的过程，工程量很大；重绘是改变节点样式的时候会发生的现象，只是调用了构建渲染树的最后绘制阶段的一些工程，开销不是很庞大通常来说，回流一定会引起重绘，重绘不一定会回流；这一点可以从浏览器渲染机制中得到答案。
2023-04-05 19:00:00
117
原创 关于浏览器渲染过程
浏览器会解析收到的HTML文档，对其中内容进行抽离，将结构抽离成DOM节点树，将样式抽离成CSS Rules树，然后根据结构和样式构建渲染树，渲染树的每一个节点都相当于DOM树上的节点对象，对象身上挂载了许多属性；当这个Render树构建完成后，浏览器会确认树中每一个节点的位置和大小，通过浏览器回流来构建基本的布局，布局之后就是将节点对象带有的一些属性绘制到页面上(重绘)，使我们可以看到内容。
2023-04-05 18:00:00
84
原创 关于DOM
BOM是浏览器对象模型，DOM是文档对象模型，BOM包含DOM，DOM可以做的事情BOM都能做到，DOM的主要功能就是操作DOM节点，也就是HTML中的标签，来达到修改文档的目的。
2023-04-05 13:42:10
101
原创 js特性 面向对象
面向过程就像在上帝视角安排每个人该做什么 应该按怎么个流程去做面向对象就是根据自己要做什么 自己去做 自己去完善扩展以上就是我对js面向对象的一些看法。
2023-03-26 16:42:48
78
原创 关于js的设计模式
举个例子 假如现在我们有一个房子 还有一堆杂七杂八的衣服裤子 那我们如果想把衣物保存在这个房子里面 方法有很多 最简单的就是直接放在地上 这样是最简单的方式 但是从另一个维护层面来讲 它又太杂乱了 不好梳理 那么我们可以选择买一个柜子来对这些衣物进行分类处理 虽然会多出买衣柜的钱 但是整理起来更加方便 看起来也更加整洁优雅 这就是两种设计模式。
2023-03-26 16:28:17
128
原创 对象取值.和[]的区别
在学习ts过程中 使用泛型加上keyof约束对象的属性类型时 发现了传入泛型的方法不能直接使用obj.xxx来读取对象的属性 但是obj[xxx]的方式可以 如下图 👇。总结：obj.xxx适合直接访问对象中的静态属性 因为obj.xxx会直接去对象中寻找xxx属性 并不会读取变量。如果我们取的值是一个静态值 那么通常使用obj.xxx 但是如果是动态属性 那么obj[xxx]更好。[ ]运算符可以使用字符串变量的内容作为属性名，点运算符不能。[ ]运算符可以用纯数字作为属性名，点运算符不能。
2023-03-25 10:28:34
210
原创 JS高级 原型链
通过构造函数可以设置对象的公有属性，但实例对象的方法通常是不相同的，但每一次创建对象添加不同的方法就需要不断开辟空间，很浪费内存，所以设置出一个原型对象来存储这些方法：当我们通过实例对象来调用方法时，会先在实例对象中寻找方法名并执行，如果没有，就到实例对象中寻找方法名并执行；那么根据上面的总结，构造函数有prototype属性来指向其原型对象，而每一个对象都有__proto__属性指向其原型对象，那么一定会有一个原型对象：如下图。来指向其构造函数，也就是说，这个原型对象是属于哪一个构造函数的。
2022-08-06 10:27:22
173
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人