- 博客(45)
- 收藏
- 关注
原创 V8 GC垃圾回收
V8 的垃圾回收机制是基于 使用策略来管理堆内存,将堆内存划分为和。,因此新生代对象的回收频率较高,而老生代对象存活时间较长,回收频率较低。
2025-02-08 12:05:08
824
原创 大文件上传
断点续传,每次上传之前,将文件md5值、切片数量、每个切片md5传给后台,后台告知该文件是否上传过,上传了哪些切片,已上传的暂不处理(之前上传中的切片认为未上传,所以考虑每个切片的体积较小,为1M)多线程解析,因解析文件耗费较长时间,且会堵塞渲染主线程,需开启多线程解析文件及切片md5。切片上传,获取文件,以及每个切片的md,这一步相对耗时较长,且堵塞渲染主线程。第一步,设计worker,引入md5依赖,解析文件/切片的md5和chunk。
2025-01-10 15:14:59
198
原创 将对象转换为JSON字符串,即手写JSON.stringify
这个stringify不是很完善的一个方法,和原生JSON.stringify还是有一定的差距,JSON.stringify是可以接受两个参数的,我这边暂不支持,后续再加吧。
2023-06-27 11:07:33
480
原创 判断两个完全相等的JSON字符串
上面的两个f是不相等的,因为参数的顺序不一致,且console后面一个有分号,一个没有分号。因为判断两个function比较复杂,所以上述用了一个简单暴力的方式。应该判断function的name、length,以及方法主体内的代码去除空格、注释、符号等,然后再进行判断。
2023-06-26 12:04:23
1011
原创 算法:回文数
所谓回文数,也就是给定一个数字,从左往右,还是从右往左,都是一个数,如:121、1221等。● 通过循环,或者转为数组进行反转,然后与原始值是否相等。
2023-06-25 18:00:24
57
原创 http常见状态码
规范是原请求是post请求,不能进行重定向,原请求是get可以进行重定向,但在浏览器的实际情况下,无论是get还是post,都可以进行重定向,所以由于历史原因,就延伸出了303(原302的实际效果)和307(原302的规范定义)。临时重定向,http1.1的产物,基本上同302相当,但是有一个区别就是,请求的资源URL1 已被指向了新的URL2,但URL2应该使用get方法请求URL2。临时重定向,http1.1的产物,基本上和303相同,区别就是原请求是post请求,不能进行重定向到get上。
2023-06-25 16:09:11
776
原创 浏览器From dist cache和From memory cache区别
e. 优先级低于from memory cache,浏览器规则:浏览器读取命中强缓存资源的顺序为memory cache > disk cache,也就是,先去内存中查找,有的话(暂且不考虑缓存过期问题),直接加载,没有的话,再去磁盘中查找,有的话直接加载,如果还没有的话,那么直接请求资源,得到资源后再进行缓存。d. 像image这种的文件一般存在内存中,同时因为脚本js的执行时机不确定,可能随时都会执行,所以js脚本一般也存在内存中。a. 储存数据量相对较大,所以大文件大概率是缓存在磁盘中。
2023-06-25 14:45:32
164
原创 JS创建函数的方式与区别
● 可以提升,但是和函数式声明区别,就是按照习惯首字母需要大些。● 可以变量提升(优先级高于普通的对象),可以先调用,后声明。● 没有变量提升,必须先声明,才能调用。
2023-06-09 09:49:14
57
原创 TCP三次握手和四次挥手
此时如果网络拥塞或者其他原因导致超时,客户端发送的连接请求迟迟到不了服务端,客户端便超时重发请求,如果服务端正确接收并确认应答,双方便开始通信,通信结束后释放连接。此时,如果那个失效的连接请求抵达了服务端,由于只有两次握手,服务端收到请求就会进入ESTABLISHED状态,等待发送数据或主动发送数据。若客户端发送完确认应答后直接进入了CLOSE状态,那么如果该应答丢失,服务端等待超时后,就会重新发送链接释放请求,但此时客户端应该关闭了,不会作出任何响应,此时服务端永远无法正常关闭。
2023-06-07 16:32:59
58
原创 闭包 && 原型变态真题
根据原型可知,当自身没有没有某个属性/方法时,就会往原型上查找,同时再运用object的get拦截方法,进而从中可找到破解该题的方法。通过以上代码可知,obj是个立即执行函数,内部一个闭包person,该立即执行函数返回了读取person对象的方法。在不修改以下代码的前提下,如何修改person对象。或者,定义对象时候规定对象没有原型。
2023-06-07 11:27:16
73
原创 JS如何判断一个对象是空对象({})
已知一个对象(Object),如何判断是一个空对象,即{ }。很多人会想到采用Object.keys(obj).length === 0,或者JSON.stringify(obj) === “{}”,这些都是不严谨的,甚至for-in都是错误的。如果key为symbol的话,object.keys拿到的长度仍旧为0。综上,最靠谱的方案就是Reflect.ownKeys()。如果对象设置不可枚举,那么for-in进而就成了摆设了。见上图,拿到的仍旧为"{}",所以存在漏洞。
2023-06-06 13:50:33
228
原创 前端埋点方案
当然,除了以上方案之外,其实,像script、link这种的也可以,但是会导致一个很严重的一个问题,需要挂载到html文档流上,否则就不会进行请求该script或link链接,进而导致上报丢失,同时还有就是需要来回操作dom而影响性能。Navigtor.sendBeacon如果业务不考虑极低版本的浏览器的话,这个很不错的方案,否则的话,可以考虑和gif相结合的形式实现前端埋点方案。因为上报埋点,其实也是一种接口调用,调用指定的URL,传递一些指定的参数。● 当业务线增多时,不同的域名,需要解决跨域的问题。
2023-06-05 18:38:15
209
原创 浏览器缓存
当浏览器再次请求时,会优先去缓存里查找,有没有命中的缓存,没有的话,即立即请求。如果有,则判断缓存资源是否过期,这就带来了强缓存和协商缓存。● 标记录资源的上一次修改时间,格式为格林威治时间。● 记录服务器这次响应时间,格式为格林威治时间。● 把这次请求得到的响应体缓存到本地文件中。● 根据服务器返回值,标记缓存(过期)时间。● 标记这次请求的请求方法和请求路径。● 标记录服务器给予的资源编号。
2023-05-06 10:12:57
79
原创 JS求无重复字符的最长字符
b. 定义四个变量,最大长度a1及对应的数组a2,临时最大长度b1及对应的数组b2,循环字符串,判断每个循环体c是否在临时最长数组b2内,在的话就b1+1,同时将c追加到b2内,否则将b1置为1,b2清空,然后追加c。再将a1和a2取最大值,b1和b2取最大值,即得到了最大长度与之对应的数组。a. 基本操作,判断参数类型以及长度。
2023-04-22 22:45:33
178
原创 JS中[] + {} == 0和{} + [] == 0的区别
先说 [] + {},根据之前的数据类型转换文字可知,[]会被转为"",{}会转为{}➡️ [object Object],根据之前文章可知,只要其中一个为字符串,那么就会转为字符串拼接,进而得到的是 [object Object]。再说{} + [],在这里,{}可以大致理解为空代码block,而[]会被转为""➡️0,所以empty+0➡️0,如果避免这个情况,可以将使用()将{}包裹起来,即({}) + [],那么得到的就会等同于[] + {}。
2023-04-22 22:45:13
191
原创 求字符串中连续字符出现最长的字符串及长度
c. 求最大值对应的字符,定义两个变量,一个是临时变量a,每次循环判断是否连续,连续a则进行拼接,否则就a置为当前循环的字符;再定一个临时最大长度字符变量b,每次循环结束之后,将刚才的临时变量a和这个临时最大值b变量取最长长度c,最大长度c即是要求的最大长度对应的字符。b. 求最大值,定义两个变量,一个是临时变量a,每次循环判断是否连续,连续a则+1,否则就a置为1;再定一个临时最大值变量b,每次循环结束之后,将刚才的临时变量a和这个临时最大值b变量取最大值c,最大值c即是要求的最大长度。
2023-04-20 10:37:46
1221
原创 JS如何计算两数之和
使用map(当然对象也可,但是性能相比map稍差些),循环nums,将当前循环下标a作为value,将目标值target减去当前循环项得到的值b作为key,储存到map中。问题在于对于b的理解,b其实就是我们要在nums中寻找的值,因为这个差值b加上刚才的循环项c即等于我们的目标值target,一旦找到这个差值,也就是我们要找的这个差值b所在的下标,另外就是当前循环项d。时间复杂度:O(n),空间复杂度:O(n)当然,如果嵌套两层循环也是可以实现这个需求的,但是时间复杂度:O(n²),空间复杂度:O(n)
2023-04-20 09:24:22
625
原创 函数柯里化
提取公共柯里化函数,接受至少两个参数,一个是处理函数,其余参数是处理函数所需的参数,以下代码为校验的方法。把一个接受多个参数的函数变为接受一个参数的函数,同时返回剩余参数且返回结果的新函数。实现以下这么sum函数,满足一下需求。
2023-04-19 12:31:27
53
原创 理解Map、WeakMap、Set、WeakSet区别
a. 具体用法不同,Map是map.set()、map.get()、map.has()、map.delete(),Object可以直接obj.xx进行设置,in判断是否存在(有bug,可以拿到原型上的)等,Map的key可以重名(后者覆盖前者),Object的Key不可重名。a. 方法不同,Set是set.add(),set.clear(),set.delete(),set.has(),也有size属性等。上图可知,当obj被GC回收后,Map将继续保持引用,但WeakMap却造成了数据丢失。
2023-04-18 17:09:36
94
原创 0.1+0.2 ≠ 0.3
2.45存储为2.4500000…,所以就导致了2.55.toFixed(1)➡️2.5、2.45.toFixed(1)➡️2.5。JS中整数和浮点数统属于数字类型,在计算机中,所有的数字都是采用IEEE754标准的64位双精度浮点数形式存储,进而导致了无论是储存、计算中都会存在精度问题。转为十进制:0 * 1/2 + 1 * 1/4 + 0 * 1/8 + 0 * 1/16 + 1 * 1/32 + 0 * 1/64 …以上是计算时的精度问题,那么接下来看下储存时的精度问题。
2023-04-17 15:50:58
67
原创 Vue的$nextTick
然后,在下一个的事件循环“tick”中,Vue 刷新队列并执行实际 (已去重的) 工作。在外层定义了三个变量,callbacks:队列,timerFunc函数:异步函数(降级判断,promise>mutatition>setImmediate>setTimeout),pending:标记同一时间只能执行一次,flushCallbacks:把callbacks数组复制一份,然后把callbacks置为空,最后把复制出来的数组中的每个函数依次执行一遍;所以它的作用仅仅是用来执行callbacks中的回调函数。
2023-04-17 09:32:51
61
原创 如何理解JS闭包
从上图中可知,由于func3内,访问了外部作用域的a、c、e变量,进而从左侧debug中可以看出形成了三个闭包,而b、d、f没有访问,进而没有形成闭包。如果人为的创建的闭包,垃圾回收机制不会自动回收,需要人为的进行回收,如:将变量置为null。延长变量声明周期,让局部变量持续保存下来,不随着它的上下文环境一起销毁。像上图1中这种自动形成的闭包,垃圾回收机制会进行回收。只要在执行函数内访问外包作用域,即创建了闭包,如;如何让打印1、2、3、4、5。答案: 6、6、6、6、6。
2023-04-16 15:27:42
46
原创 JS中var、const、let区别
d. 声明的时候必须赋值,且值如果是简单数据类型的话,不可以修改。console.log(‘第’ + (i + 1) + ‘个’)声明变量的时候,如果不采用关键字的话,默认为全局变量。a. 没有块级作用域,仅有全局作用域、函数作用域。a. 没有全局作用域,有块级作用域、函数作用域。a. 没有全局作用域,有块级作用域、函数作用域。d. 声明的时候可以不赋值,且值可以修改。d. 声明的时候可以不赋值,且值可以修改。b. 有暂时性死区,不可重复声明。b. 有暂时性死区,不可重复声明。
2023-04-14 09:34:47
71
原创 手写parseInt
接受参数为string的话,第一位为0的话,返回0,一直解析到非number的为止。接受参数非number && 非string的话,返回NaN。支持链式调用,即封装到string的原型上。接受参数为number的话,返回其本身。
2023-04-12 13:32:23
68
原创 如何理解JS执行上下文
分为全局、函数以及eval三种,那么对应了全局函数、eval环境。c. 变量声明(不赋值,见变量提升),字面量函数声明(不赋值)执行上下文是在执行中确立,而不是声明,如函数。b. 初始化arguments并赋值。d. this指向(由调用者确定)a. 函数上下文初始化形参并赋值。上下文遵循栈的规则,先进后出。b. 字面量函数复制。
2023-04-12 08:54:48
33
原创 以下代码执行后,a.x和b.x的结果分别是?
主要考察原型与原型链的问题,如果一个对象 上有一个key,那么就不会往原型上找,如果没有,则去原型上找对应的key。对象实例A与B自身有一个x属性,value值取自实例化传参,A的原型上有个x属性,value值为1;B的原型为A的实例,注意此时没有给传参。delete b.x主要是delete了实例上的x属性,但其原型上继承了A,所以原型上仍有一个x属性,但由于初始化时没有传参,进而导致了value值为undefined。由于A实例上有一个x属性,且new时候初始化了2,所以a.x:2;
2023-04-11 09:21:31
120
原创 js大额数字相加
接受两个字符串,如果接受的是数字,需要将数字转为字符串,但有一个点需要注意,转换过程中,可能会带有e,如1.12e+21,即1.12 * 21个0,需要将1.12 * 2个0,然后padStart(21 - 2个0)。let f = 0;//定义加法过程中需要用到的变量。//取两个数字的最大长度。
2023-04-10 13:43:26
588
原创 ES6的class降级
/ 将子构造函数的__proto__指向父类构造函数,这里的setPrototypeOf方法和create类似,可以看出class继承同时存在两条继承链:子类构造函数的__proto__指向父类,子类原型的__proto__指向父类原型。increase() { // 注意:不可枚举,且只能当作普通方法调用,不能通过new形式(new product.increase(),只能product.increase()来使用)来调用。ES6的方法不可枚举,同时只能当作普通方法调用,不能通过new形式来调用。
2023-04-10 13:41:48
107
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人