自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(33)
  • 资源 (1)
  • 收藏
  • 关注

原创 地址栏输入URL浏览器会发生什么?

这两者的区别为,async 不会保持原脚本的顺序,适用于一些需要在首屏用到的script,则defer则会保持原脚本顺序。(衍生问题 1 为什么要用IP,有多少位(网易)2 既然mac是唯一的,那为什么不用mac地址(字节)3 DNS递归详细讲讲, 使用到的网络协议(阿里)) =>这个问题如果要展开讲的话,能讲个半小时,所以我们侧重于浏览器的渲染上。解析完了html css js,也生成了dom树后,浏览器还干了什么呢?(衍生问题, 各大版本的http,1.0 , 1.1, 2.0 )

2024-12-22 02:08:54 368

原创 去除字符串中非数字和字符串的正则

用好 [ ] 和 ^ 其实就能处理很多的场景了。

2024-12-20 14:43:34 266

原创 进程以及浏览器的进程

详细解释就是,启动一个程序的时候,操作系统会为该程序创建一块内存,用来存放代码、运行中的数据和一个执行任务的主线程,我们把这样的一个运行环境叫进程。比如之前的 IE 浏览器,支持很多插件,而这些插件很容易导致内存泄漏,这意味着只要浏览器开着,内存占用就有可能会越来越多,但是当关闭浏览器进程时,这些内存就都会被系统回收掉。主要负责页面的网络资源加载,之前是作为一个模块运行在浏览器进程里面的,直至最近才独立出来,成为一个单独的进程。在渲染进程和网络进程通信中,它们会通过预先定义好的消息格式进行通信。

2024-12-11 10:58:55 382

原创 Vue 组合式API路由守卫

【代码】Vue 组合式API路由守卫。

2024-12-02 20:24:14 217

原创 小鹏汽车前端一面 animation

写一个旋转的轮盘试试。

2024-11-07 11:43:09 132

原创 百度/小鹏/网易 秋招面试——Vue的响应式原理深挖

对每个对象用Object.defineProperty() 劫持 对这个对象的每个属性用get()和set()进行劫持,让这个属性在每次读写的时候触发对应函数 / 数组的处理则是重写数组可改变自身内容的7种方法(push。: 谁用到了这个数据,谁就是依赖, 就为谁创建一个watcher实例,谁用了数据,get()函数就调用了,这个watcher实例就到数组Dep中了。此外,如果是一个数组的时候,只要是通过数组原型上的方法对数组进行操作就都可以侦测到,但是还可以通过数组的下标来操作数据,

2024-11-05 20:43:44 403

原创 跨境电商字节面试题,详细讲讲React调度的问题

这是一个面很广的问题,你可以一直说个15分钟,把你对react是如何实现响应式或者react的重新渲染内部发生了什么,useState发生什么,diff,虚拟dom,fiber等等都讲一遍,但是一定要有联系。主要从调用function 组件之后,react内部调度的流程,生成虚拟树啊,生成fiber树啊,任务调度啊,fiber解决了什么问题呀,调和时候的diff呀,commit到Dom上啊等等方面回答这个问题。

2024-11-05 20:03:42 210

原创 React的重新渲染问题

我们点击父组件的click2 我们惊奇的发现 子组件重新渲染了,原来我们多传了一个changeName函数导致的,memo对changeName函数也缓存了,所以当父组件点击button,父组件重新渲染,重新创建changeName函数,changeName函数的引用发生改变,memo就会导致子组件重新渲染!结果发现只有点击 click 的时候改变num的值的时候,也就是memo的依赖的时候,子组件才会重新渲染,当点击click2的时候,并没有改变memo的依赖的时候,子组件并没重新渲染。

2024-09-25 14:43:44 562

原创 promise.retry

【代码】promise.retry。

2024-09-24 10:16:24 249

原创 HTTP1.0、1.1、2.0的讲解

默认使用非持久连接(non-persistence),每个请求/响应后连接都会关闭,如果需要并发传输,则需要同时打开多个连接。:引入了持久连接(persistence),使得同一连接可以传输多个请求和响应,减少了连接建立和关闭的开销。:HTTP/1.0 规定了请求和响应的格式,包括状态行、请求或响应头部、一个空行和消息体。:使用HPACK算法压缩请求和响应的头部信息,减少了冗余头部信息的传输。:增强了缓存机制,引入了更多的缓存相关的头部字段,如。:引入了缓存相关的头部字段,但规则相对简单。

2024-07-12 01:17:39 299

原创 关于React 6个你需要注意的地方

最后是一个自定义钩子,也是面试官爱问的东西。笔者在面试小米的时候就有被问到平时是否有自己写过自定义钩子,返回值是什么之类的。}, [url])亮点在于当url输入时候导致频繁改变的时候,会触发 controller.abort() 清理副作用,取消请求,也就是只有最后一次请求被完全处理。例如在处理实时搜索时,你可能只关心用户最后一次输入的搜索词。然而,在其他情况下,你可能想要在useEffect的依赖数组中包含更多的变量,以确保每次这些变量发生变化时都触发请求。

2023-10-06 01:27:24 148

原创 Redux-Toolkit

使用redux仓库:useSelector useDispatch 钩子。一套能满足中小型项目的代码案例。

2023-08-02 08:37:37 86

原创 Event Loop

主线程任务执行完后,先检查微任务队列是否有任务,有的话则按照先入先出的顺序将先放进来的微任务放入调用栈中执行,并将该任务从微任务队列中移除,直到把所有为微任务清空时,查看宏任务队列,有的话则按照先进先出的顺序执行,将任务放入调用栈并将该任务从宏任务队列中移除,这一个任务执行后继续查看微任务队列,有任务执行微任务队列,没任务继续执行宏任务队列的任务。JS单线程任务从时间上分为同步任务和异步任务,而异步任务又分为宏任务和微任务。首先我们要对宏任务和微任务进行了解。important)

2023-07-19 21:42:35 92

原创 一些面试题

Content-Type(内容类型):该头部指定了实体主体(如请求或响应的正文)的媒体类型。常见的值包括"application/json"(JSON数据)、"text/html"(HTML网页)等。常见的值包括"no-cache"(不缓存内容)和"max-age"(缓存的最大有效时间)等。User-Agent(用户代理):该头部用于标识发起HTTP请求的用户代理(例如浏览器、爬虫等)。HTTP的头部(Headers)是在HTTP请求和响应中传递附加信息的字段。它允许接收方知道何时接收到完整的消息体。

2023-07-10 08:46:29 89

原创 DOM操作 节点操作

通过函数定时器 让标签属性改变 是一步一步的完成 不是瞬时完成的 执行效果看上去就像是 运动效果。不能使用 标签.innerhtml 或者 标签.innertext。appendChild. 在某元素中 内部 添加节点。获取节点(实际项目中一般不使用 了解就好。多次写入 写入的位置是 最后一次写入的位置。odiv.children 所有标签节点。写入节点. 标签节点本质是一个标签对象。odiv.childlist 所有节点。一个创建标签节点只能写入一个位置。必须使用 标签节点专门的写入语法。

2023-07-04 09:46:28 58

原创 git的一些指令

git initgit add .git commit -m '随便写'git remote add x(变量/名称) url. git remote -v查看连接到的远程仓库git push -u url/x(变量/名称) 分支. git fetch 获取远程仓库最新分支消息 下载到本地:git clone git pull查看本地和远程仓库分支git branch -a 查看本地分支git branch 查看远程分支git branch -rgit branch

2023-06-30 20:27:12 92 3

原创 npm的一些命令

只在 项目开发阶段 使用的依赖包 等项目正式上线运行 就不再使用的依赖包。项目 开发 测试 正式运行 等所有步骤 都要使用的依赖包。npm install --global 包名@版本号。自动安装 package.json文件中 存储的依赖包。npm install --save-dev 包名。npm uninstall --global 包名。查看项目/开发依赖包 安装路径 版本信息。只安装 项目依赖包 不会安装 开发依赖包。npm ls 包名 --global。npm install 依赖包名。

2023-06-03 16:49:04 80

原创 jsonp 跨域

jsonp 和ajax没有任何关系 不是通过ajax发送请求 通过 script 标签 src属性 发送跨域请求。不管文件类型是什么类型 只要文件内容 符合js语法 就会按照 js程序效果 执行导入文件内容。2,src属性 导入文件的路径 如果是跨域路径 浏览器 不会阻止src属性导入外部文件。用script 导入 还需要一个函数 携带参数 获取后端返回的数据。script标签 和 src属性的特殊性。1,src属性 作用是 导入外部文件内容。

2023-05-31 20:00:55 64

原创 前后端数据交互与http

该文一部分内容来源于维基百科 chatgpt mdn 掘金等大网站之杂糅学习前端开发中关于 HTTP 的内容,你需要掌握以下几个方面:HTTP协议的基本概念和工作原理:包括HTTP请求和响应的格式、状态码、头部信息等。HTTP请求方法和常用响应状态码:包括GET、POST、PUT、DELETE、200、404、500等。HTTP Cookie和Session的应用:理解Cookie和Session的基本概念、原理和使用方法。HTTP缓存机制:掌握浏览器缓存、服务器缓存的工作原理和使用方法。

2023-05-26 11:48:58 259

原创 根本不懂什么是闭包

对于闭包 说白话就是一个函数通过return出一个函数 ,这个函数可以在全局中访问父函数中的数据,通过其他方法不行。因为数据是存储在函数中 函数执行时数据是存储在函数的执行空间中 函数执行结束 执行空间被销毁 数据就被销毁。使用闭包的语法形式 调用 函数中定义的数据 必须要生成一个 不会被销毁的空间。销毁和释放内存 中的无用数据 这样的操作称为 数据回收机制 垃圾回收机制 内存释放机制 内存回收机制。原理 保证执行空间中的数据 在 函数外部 被使用 函数的执行空间 函数执行结束不会被销毁。

2023-05-23 21:35:29 81

原创 Js正则表达式

正则表达式.exec(字符串)(一般用字符串方法的match捕获)let 变量=newRegExp(正则表达式)str.search() //支持正则表达式。正则表达式 作用是 验证字符串 内容格式。为满足部分粉丝要求 附上较为详细的代码。若从头到尾都是汉字 则 首尾加上^$标识符 是写在 正则表达式外的内容。正则表达式.test(字符串);{数字,数字} 表述数字到数字个。let 变量=/正则表达式/;正则表达式捕获字符串内容。{数字,}数字到正无穷个。{数字} 表示数字个。配合字符串函数一起用。

2023-05-22 20:34:15 73 1

原创 JS面向对象编程

面向过程:按照逻辑 一步一步的编写程序代码 重点关注的是 步骤过程 使用变量存储程序执行需要的代码。1,在对象中 绑定的事件函数尽量用箭头函数 这样this指向就是父级程序的this指向。创建一个公共的函数 所有的实例化对象 都可以用这些函数 减少代码重复。es6用class 的具体语法 会在总结后 发布 重要!面向对象编程 对于具有相同属性和方法的抽象类的描述。面向对象 :使用对象,函数 存储程序需要的数据。1,在函数中自动创建 并且return这个对象。2,改变函数的this指向。

2023-05-17 22:03:58 63 2

原创 ES6的一部分特性

箭头函数 this 指向父级程序 若无父级程序 则this指向为window 箭头函数本身是没有this指向的。参数一是新的this指向 其他参数 是原始调用 调用时需要的实参数据。循环结束 调用循环变量i 也就是调用对应的作用域中存储的独立的i的值。let声明的循环变量i 每次循环都相当于一个独立的作用域。参数一是新的this指向 其他参数用数组 输入。每次循环生成的新数值会覆盖之前生成的循环数值。解构赋值[x,y]=[100,200];每次循环 都会生成一个独立的循环变量i。

2023-05-17 08:47:25 58

原创 浏览器和DOM的一些东西

2,一般是给整个文档绑定事件 document.addeventlistener('keydown',fn)document.documentElement.currentWidth 有文档声明!获取标签样式 window.getComputedStyle(标签对象).css样式。事件对象.which. 兼容低版本火狐浏览器。低版本ie : 标签对象.currentStyle.css样式。标准浏览器:事件对象.stoppropagation();2,通过 事件对象.target 判断 触发事件的标签。

2023-05-12 09:21:30 68

原创 DOM和BOM操作

标签对象.setattribute('属性','属性值') 覆盖设置 把原来的覆盖。onclick 语法 事件绑定本质是 赋值存储的形式。事件处理函数 以回调函数的语法形式绑定事件处理函数。所谓的bom操作必须是浏览器兼容的 支持的函数方法。标签对象 和标签父级 有不同的css样式设定。标签对象.布尔属性=true/false。标签本身 有定位 父级标签没有定位。回调函数的本质 是 赋值函数的存储空间。后赋值的事件 会覆盖之前的赋值的事件。= 等于赋值 执行的是 覆盖写入。标签支持的布尔属性的操作方法。

2023-05-11 21:17:48 98 2

原创 延时器与定时器

语法返回值都是定时器 延时器的编号清除器两个 都能清除单线程是计算机程序的一种方式 所有程序按照顺序一个一个执行 同一个时间内 只能有一个程序被触发执行,上一个程序没有别执行结束,下一个程序就不会执行。js是典型的单线程多线程可以同时触发执行多个程序java py等同步程序,异步程序是js特有的程序执行方式大部分程序都是同步程序特殊的程序是异步程序js同步程序 异步程序执行原理先执行所有的同步程序 等所有的同步程序执行完 再执行异步程序。

2023-05-08 22:29:29 396 1

原创 Math 对象和时间对象

设置时间戳 demo:(验证码实现):发送短信时 会有一个 获取时间戳 然后 再次点击 又会有个获取时间戳 如果小于一分钟则不实现。所谓时间戳是当前时间距离格林时间1970年一月一号0分0秒的时间 时间戳一般用于时间差。Math.random 随机数。Math.round 四舍五入保留整数。Math.min/max 最小最大值。Math.floor 舍弃取整。Math.SQRT2 根号2。Math.ceil 向上取整。Math.arqt 平方根。Math.abs 绝对值。Math.PI 圆周率。

2023-05-08 11:00:49 67 1

原创 数组的函数方法总结

还有一些较简单数组函数 如 在数组头部添加数据的 unshift 在尾部添加 push,中间添加可以使用. 在i后面加元素 : splice(i,1,arr[i],num) 或者splice(i+1,0,num)splice(index,num, exchange)参数三设定的数据 会替换删除的数据单元 在删除的数据单元位置会整体一次性写入 (替换,插入 ) 会改变原始数组。若无50 则自动赋值给 prev 且少循环一次。ps:注意不是地图数据类型。

2023-05-05 20:53:30 184 1

原创 弹性盒子布局

1:设置弹性盒 display:flex块级弹性盒inline-flex 行内弹性盒弹性子元素如果没有设置宽高 就是内容的宽高弹性子元素的总宽度超过父元素 会收缩并在一行显示直到溢出2:是否允许弹性子元素换行显示wrap-reverse 允许并且翻转3:弹性子元素行的对齐方式(注意:弹性子元素必须存在换行 align-content(控制多行)必须与align-content连用。

2023-05-03 11:14:08 92 2

原创 三大布局总结

margin 塌陷(重要):第一个子元素的margin-top和最后一个子元素的margin-bottom会传递给父元素 解决方法:1:给外层父元素加边框2 :给父元素加overflow:hidden 3:给父元素加padding 4:给父元素加float 5:给子元素加float/display:inline-blockinline-block。5: 浮动的元素会脱离正常的文档流,导致后面的上来,浮动的元素会占据自身的空间,导致文字环绕。:bfc区域在计算高度的时候float的元素也会参与计算。

2023-05-02 10:13:26 64 2

原创 表单的基础总结

get:该请求会将请求参数的名和值转换成字符串,然后拼接到URL 之后,因此在地址栏等地方可以看到请求的参数;但是安全性差,并且安全性差,传输的数量比较小,在URL中的最大长度是2048个字符。post:该请求方式通过HTTP的post 机制,将所有的请求参数的名和值放在HTML的header 中传输;其中:get 是默认值,表单中的数据被传送到action 属性指定的URL,然后这个新的URL 被传送到处理程序上。_top: 表示页面载入到包含该链接的窗口,取值在当前的窗口中的所有页面。

2023-04-27 21:04:52 92 3

原创 js第二天

2.堆是存放在二级缓存中,生命周期由虚拟机的垃圾回收算法来决定(并不是一旦成为孤儿对象就能被回收)。栈(stack):由操作系统自动分配释放 ,存放函数的参数值,局部变量的值等。堆(heap):一般由程序员分配释放, 若程序员不释放,程序结束时可能由OS回收,分配方式倒是类似于链表。1, 预解析:js引擎会把 js 里面所有的 var function 提升到当前作用域的最前面。1.栈使用的是一级缓存, 他们通常都是被调用时处于存储空间中,调用完毕立即释放;对象里可以放函数,数组,基本数据类型;

2023-04-27 19:30:06 83 1

原创 前端学习记录与分享

分享并记录自己的前端学习,希望能够帮助到一起学前端的伙伴,也能够对自己的知识体系做到总结与提升。

2023-04-23 23:01:40 47 1

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除