自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(125)
  • 收藏
  • 关注

原创 如何5分钟创建和部署一个个人博客

关于如何搭建个人博客以及如何通过github部署的教程

2022-11-19 13:48:46 1184 5

原创 搭建一个基于Vue3+Vite+TypeScript的项目

最近准备搭建工作室的官方网站,在这里记录一下项目搭建的过程。

2022-08-12 21:22:15 2768

原创 LeetCode刷题笔记 - JavaScript(十七)

前缀和+二分,首先,计算出前缀数组的一个前缀和数组,而前缀和数组的最后一个值,也就是整个权重数组的总权重,而每一项权重和总权重的比值,就是该权重所代表下表的“概率”,然后总权重值作为随机数范围,然后二分随机值的位置,即可按照权重生成相应的随机数。例如,对于 w = [1, 3],挑选下标 0 的概率为 1 / (1 + 3) = 0.25 (即,25%),而选取下标 1 的概率为 3 / (1 + 3) = 0.75(即,75%)。也就是说,选取下标 i 的概率为 w[i] / sum(w)。

2023-07-10 23:56:25 539

原创 一周总结(3.20)

大厂面试更加注重考察一个人的思维能力和实际项目经验,所以平常的积累和思考是很重要的,在实现一个功能之前,需要想想清楚为什么要做这个功能,它的目的?作用?以及你后续如何去优化这个功能等等。

2023-03-20 01:02:19 411 2

原创 一周学习总结(2022.3.13)

很长一段时间没写总结了,最近一段时间都在笔试面试,算是对上周的一个总体回顾吧。

2023-03-13 12:12:20 408

原创 第五届字节跳动青训营 前端进阶学习笔记(十一)跨端技术概述

跨端技术概述小程序详解小程序实战小程序性能优化本节课主要对跨端技术和小程序开发相关知识进行了相应的介绍。

2023-02-02 17:14:48 683 1

原创 LeetCode刷题笔记 - JavaScript(十六)

对于会相撞的元素,只有当它本身是负数,且它前一个是正数时,即前面的元素向右移动,本身向左移动时,两个元素就会相撞。这时,若当前元素比前一个元素小,当前元素被摧毁,即不被加入stack;否则,前一个元素比较小,或两元素相等,两个元素都被摧毁(弹出栈,和不入栈),若当前元素未被摧毁,则继续向左移动,直到被加入到存活栈或被摧毁。:给定一个包含正负数的数列,正数表示向右移动,负数表示向左移动,同一方向的元素永远不会相撞,不同方向的元素较小的,或相等的都会摧毁,求最后剩余的数列。维护的过程中,计算距离。

2023-02-02 14:18:21 281

原创 LeetCode刷题笔记 - JavaScript(十五)

基础做法就是将字符串中的字符排序,然后以排序后的字符串为键,值为以当前字符组成的字符串集合。在此之上的优化写法是用计数法替代排序,用O(n)的时间和空间复杂度,优化掉排序的时间复杂度。给定一组用外星语书写的单词 words,以及其字母表的顺序 order,只有当给定的单词在这种外星语中按字典序排列时,返回 true;:将n个时间排序,则最小时间差必然出现在相邻两个/首位时间中,然后根据鸽巢原理,只有1440中时间情况,当时间的情况超过1440时,则最小时间差为0.:求n个时间中的最小时间差。

2023-02-01 12:52:29 487

原创 LeetCode刷题笔记 - JavaScript(十四)

这样,每当元素被访问时,将元素移动到链表首部,删除元素时,从链表尾部删除。优化写法:使用一个map计数,先统计第一个字符串每个字母出现的次数,然后统计第二个字符串,当字符串某一位的计数值

2023-01-31 23:02:59 451

原创 第五届字节跳动青训营 前端进阶学习笔记(十)Webpack基础

什么是WebpackWebpack打包核心流程本质上是一种前端资源编译、打包工具多份资源文件打包成Bundle支持Babel、Eslint、TS、CoffeeScript、Less、Sass支持模块化处理css、图片等资源文件支持HMR + 开发服务器支持持续监听、持续构建支持代码分离支持Tree-shaking支持Sourcemap本节课程对Webpack的历史和发展过程进行了介绍,主要说明了,为什么会有Webpack,它是做什么的,为什么选择它。

2023-01-31 01:18:18 930

原创 第五届字节跳动青训营 前端进阶学习笔记(九)Node.js 与前端开发实战

Node.js的应用场景Node.js的运行时结构Node.js实战本次课程主要介绍了Node.js的一些历史背景、应用环境和运行时结构,同时还从零开始搭建了一个基本的http服务器和静态资源服务器,并对SSR的原理和应用进行了相应的讲解和实现。

2023-01-30 22:08:31 1828

原创 LeetCode刷题笔记 - JavaScript(十三)

多级双向链表中,除了指向下一个节点和前一个节点指针之外,它还有一个子链表指针,可能指向单独的双向链表。给定循环单调非递减列表中的一个点,写一个函数向这个列表中插入一个新元素 insertVal ,使这个列表仍然是循环升序的。给定位于列表第一级的头节点,请扁平化列表,即将这样的多级双向链表展平成普通的双向链表,使所有结点出现在单级双链表中。如果有多个满足条件的插入位置,可以选择任意一个位置插入新的值,插入后整个列表仍然保持有序。给定的可以是这个列表中任意一个顶点的指针,并不一定是这个列表中最小元素的指针。

2023-01-30 09:11:11 350

原创 LeetCode刷题笔记 - JavaScript(十二)

双指针分别遍历两个链表,则两个指针一定会在n+m步后,达到同一个结点。如果两个链表有重合点,那么n+m步后,p和q指向的就是该重合点,否则p和q都会指向null。给定两个 非空链表 l1和 l2 来代表两个非负整数。将这两数相加会返回一个新的链表。给定两个单链表的头节点 headA 和 headB ,请找出并返回两个单链表相交的起始节点。如果两个链表没有交点,返回 null。给定单链表的头节点 head ,请反转链表,并返回反转后的链表的头节点。:求两个链表的第一个重合节点。:求链表反转的结果。

2023-01-29 11:47:47 515

原创 CSS权威指南(十二)Flexbox

Flexbox是一种简单而强大的布局方式,通过flex可以指明空间的分布方式、内容的对齐方式和元素的视觉顺序,把不同的组件放置在页面中。Flexbox依赖父子关系,在元素上声明display:flex | inline-flex后,这个元素随之成为弹性容器,负责在所占空间内布置子元素(flex-item)。取值:flex-start | flex-end | center | space-between | space-around | space-evenly | stretch。

2023-01-28 13:19:07 1032

原创 LeetCode刷题笔记 - JavaScript(十一)

为了表示给定链表中的环,我们使用整数 pos 来表示链表尾连接到链表中的位置(索引从 0 开始)。从链表的头节点开始沿着 next 指针进入环的第一个节点为环的入口节点。:快慢指针,因为如果链表中有存在环,则快慢指针必定会相遇,而当快慢指针相遇时,慢指针到环入口的距离 = 链表head到环入口的距离。:双指针,让一个指针先走n步,另一个指针从头开始,然后两个指针一起走,这样后一个指针的位置就是倒数第n个指针的前一个了。给定一个链表,删除链表的倒数第 n 个结点,并且返回链表的头结点。

2023-01-28 11:38:24 694

原创 CSS权威指南(十一)定位

绝对定位的元素完全从文档流中移除,其位置相对容纳块确定,外边距的边界使用偏移属性划定。绝对定位的元素不围绕其他元素的内容流动,而其内容也不围绕定位元素流动。绝对定位元素的容纳块是position属性不为static的最近祖辈元素。如果position属性的值是relative或static,其容纳块由最近的块级、单元格或行内块级祖辈元素框体的内容边界划定。取值: static | relative | sticky | absolute | fixed。适用于:块级元素和置换元素。初始值:visible。

2023-01-27 15:16:02 732

原创 LeetCode刷题笔记 - JavaScript(十)

使用两个分别存储两个字符串中各字符出现的次数,然后维护满足条件的最短子串。输入一个正整数 target ,输出所有和为 target 的连续正整数序列(至少含有两个数)。给定一个字符串 s ,验证 s 是否是 回文串 ,只考虑字母和数字字符,可以忽略字母的大小写。给定一个非空字符串 s,请判断如果 最多 从字符串中删除一个字符能否得到一个回文字符串。构造一个只有字母和数字的字符串,然后比较翻转后的字符串和原字符串是否相等。:判断一个字符串中的字母和数字部分是否是回文的。(2)双指针(正经写法)

2023-01-27 14:36:24 641 1

原创 CSS权威指南(十)浮动

适用于:浮动元素当该属性的值为图片URL时,如果图片有透明部分,那么内容将按照透明部分填充。但是不是完全填充透明部分,而是填充与内容直接接触那一边的透明部分。取值:初始值:0.0适用于:浮动元素这个属性用于指定透明度为多少时,运行内容流入。

2023-01-26 19:28:34 578 1

原创 LeetCode刷题笔记 - JavaScript(九)

最基本的做法是使用滑动窗口,维护长度为s1.length的滑动窗口,统计每个字母出现的次数,只要出现s1的子序列,就直接返回结果。但是这个过程可以使用双指针优化,我们不去比较两个序列,而是判断是否有和s1中字母出现次数相同的子数组的长度===n。:在上一题的基础上,增阿一个记录答案的数组res,当找到一个子序列时,不直接返回结果,而是将该结果的起始下标l加入到答案数组res中,最后返回结果。给定两个字符串 s 和 p,找到 s 中所有 p 的 变位词 的子串,返回这些子串的起始索引。

2023-01-26 15:47:47 814

原创 一周学习总结(2022.1.25)

年前给自己定下了一组学习计划,安排了每天需要完成的事情。这里主要记录一下每周任务的完成情况。本周定制的任务主要围绕着《Vue.js的设计与实现》和《计算机网络:自顶向下方法》这两本书的阅读和学习、组件库项目的搭建、青训营课程学习和日常的刷题训练进行。本周任务完成情况整体来说还算在预期之内,完成的比较不好的是组件库方面,总会因为其他事情而搁置,希望这周可以按照日程完成。

2023-01-26 01:24:40 855

原创 深入学习Vue.js(十四)同构渲染

而SSR则是服务端渲染,数据的获取和拼接都是在服务端进行,服务器直接返回拼接好的HTML文件,因此加载速度很快。同构渲染在首次渲染时与SSR是一样的,即直接返回静态HTML文件,但是有一点不同的是,同构渲染返回的文件中,不会包含已经处理好的数据。在CSR中,我们对于全局状态的使用和我们在SSR中是不一样的,因为CSR中的全局状态只在CSR环境中运行,而SSR中的全局状态确实当前所有访问的用户共用的,因此要避免因为一个用户修改全局状态,而其他用户得到与预想结果不同的操作这种情况。在Vue3中,提供了组件。

2023-01-26 01:23:58 910

原创 LeetCode刷题笔记 - JavaScript(八)

int sumRegion(int row1, int col1, int row2, int col2) 返回左上角 (row1, col1) 、右下角 (row2, col2) 的子矩阵的元素总和。当后面出现重复前缀和时,可以取出第一次出现该前缀和的下标,计算出子数组长度。给定一个二进制数组 nums , 找到含有相同数量的 0 和 1 的最长连续子数组,并返回该子数组的长度。数组 中心下标 是数组的一个下标,其左侧所有元素相加的和等于右侧所有元素相加的和。:求一个二维矩阵的子矩阵和。

2023-01-25 11:50:05 1059

原创 深入学习Vue.js(十三)编译优化

很明显,与直接替换标签中的内容相比,传统diff算法需要做很多无意义的操作,如果能够去除这些无意义的操作,将会省下一笔很大的性能开销。其实,只要在模板编译时,标记出哪些节点是动态的,哪些是静态的,然后再通过虚拟DOM传递给渲染器,渲染器就能根据这些信息,直接修改对应节点,从而提高运行时性能。因此,我们可以使用“静态提升”,即将静态节点,提取到渲染函数之外,这样渲染函数在执行的时候,只是保持了对静态节点的引用,而不会重新创建虚拟节点。然后,我们在创建虚拟节点的时候,对动态节点进行收集。

2023-01-25 09:52:44 856

原创 从零搭建一个组件库(二)创建代码规范

上节我们搭建了组件库的基本环境架构,这节我们来对项目的代码规范和git提交规范进行配置。BEM分别指的是Block、Element和Modifier。其中,Block描述的是一个元素本身,比如table、button;Element指的是元素的一部分,比如table__item、button__inner;Modifier则是描述了元素的外观、状态和行为,比如button–success、input–disabled。通过对代码规范的配置,极大地提升了我们开发的效率和体验。正所谓,工欲善其事必先利其器。

2023-01-24 17:09:55 1279 2

原创 LeetCode刷题笔记 - JavaScript(七)

找出该数组中满足其和 ≥ target 的长度最小的 连续子数组 [numsl, numsl+1, …给定一个正整数数组 nums和整数 k ,请找出该数组内乘积小于 k 的连续的子数组的个数。维护一个小于target的值,当值>=target时,更新res。给定一个整数数组和一个整数 k ,请找到该数组中和为 k 的连续子数组的个数。给定一个含有 n 个正整数的数组和一个正整数 target。:求和>=target的最短子数组的长度。:求乘积小于k的所有连续子数组。:求和为k的所有子数组。

2023-01-24 11:21:02 907 1

原创 LeetCode刷题笔记 - JavaScript(六)

先考虑去重的问题,首先,对于原数组排序,在三层循环中,需要判断当前循环变量与上一个循环变量的值不相等,否则跳过当前循环。因为数组是升序排序,因此只需要使用两个指针l和r,分别指向数组的首部和尾部,若当前首部和尾部的和>target,使尾指针向左移动,否则,若和

2023-01-23 14:39:21 1050

原创 从零搭建一个组件库(一)项目环境搭建

组队大项目选择了组件库开发,一开始决定选题时候,大家都觉得这个题目会很难写,等到实际上手开发的时候,才发现这个项目确实没那么好写。开发组件库的第一步就是要确定组件库的整体架构和技术选型,这方面我主要参考了Element-plus。架构方面使用基于pnpm实现的monorepo架构,对项目的代码进行组织和管理;css预处理器选择了Sass,定义了classname的BEM规范、cssvar变量的一系列utils和一些其他的样式处理工具;测试工具采用vitest;组件库文档采用vitepress。

2023-01-23 00:58:41 2530 2

原创 第五届字节跳动青训营 前端进阶学习笔记(八)React框架入门

课程重点React的历史React的设计思路React的实现原理React的状态管理库React应用级框架科普组件是组件的组合/原子组件组件内部拥有的状态,外部不可见父组件可以将状态传递给子组件。

2023-01-22 22:22:29 849

原创 LeetCode刷题笔记 - JavaScript(五)

本题要求使用32位整数,因此在写题过程中,不使用超过32位整形的特性。:使用Brian Kernighan算法,该算法的核心概念是通过n & (n-1),可以消除一个数二进制中最右1位1。给定两个整数 a 和 b ,求它们的除法的商 a/b ,要求不得使用乘号 ‘*’、除号 ‘/’ 以及求余符号 ‘%’。给定一个非负整数 n ,请计算 0 到 n 之间的每个数字的二进制表示中 1 的个数,并输出一个数组。给定两个 01 字符串 a 和 b ,请计算它们的和,并以二进制字符串的形式输出。

2023-01-22 13:52:59 1399

原创 深入学习Vue.js(十二)编译器

编译器实际上是一段程序,他用来将一种语言A翻译为另一种语言B。其中,A被称为源代码,B被称为目标代码。编译器将源代码翻译为目标代码的过程被称为编译。完整的编译过程通常包含词法分析、语法分析、语义分析、中间代码生成、优化、目标代码生成等步骤。而整个编译过程通常分为编译前端和编译后端,其中编译前端包括词法分析、语法分析和语义分析,编译前端通常与目标平台无关,仅负分析源代码。编译后端则通常与平台有关,设计中间打吗生成、优化和目标代码生成。但是,编译后端不一定会带有中间代码和优化这两个环节,这取决于具体实现。

2023-01-21 20:41:24 1302

原创 LeetCode刷题笔记 - JavaScript(四)

你需要设计一个算法来实现二叉树的序列化与反序列化。这里不限定你的序列 / 反序列化算法执行逻辑,你只需要保证一个二叉树可以被序列化为一个字符串并且将这个字符串反序列化为原始的树结构。例如,字符串"aaa"与模式"a.a"和"ab。如果相同继续判断后面是否还有*通配符,如果有,分别判断匹配n次和匹配0次的情况。模式中的字符’.‘表示任意一个字符,而’a"匹配,但与"aa.a"和"ab*a"均不匹配。请实现两个函数,分别用来序列化和反序列化二叉树。:模拟二叉树的序列化和反序列化。:dfs的序列化和反序列化。

2023-01-21 12:43:32 2340 1

原创 第五届字节跳动青训营 前端进阶学习笔记(七)HTTP协议入门

课程重点HTTP协议基本概述HTTP协议场景分析HTTP协议实战。浏览器处理输入信息发起请求接收响应渲染网页HTTP/2的每条连接都是永久的,每个来源仅需要一个连接流控制:阻止发送方向接收方发送大量数据的机制服务器推送经过TSL/SSL加密。

2023-01-21 11:09:07 2392 5

原创 计算机网络学习笔记(六)数据链路层

在链路层中,任何设备均为节点。节点包括主机、路由器、交换机和Wifi接入点。沿着通信路径连接相邻节点的通信信道称为链路。为了将一个数据报从源主机传输到目的主机,数据报必须通过沿端到端路径上的各段链路传输。在通过特定链路时,传输节点将数据报封装在链路层帧中,并将该帧传送到链路中。

2023-01-20 21:37:42 1606 1

原创 深入学习Vue.js(十一)内建组件和模块

在之前的KeepAlive组件实现中我们设置的缓存是只要一个组件存在于缓存中,就直接返回该组件,否则将该组件添加到缓存中。默认情况下,KeepAlive组件会对所有组件进行缓存。KeepAlive组件本身不会渲染额外内容,它的渲染函数最终只返回需要被KeepAlive的组件,我们把需要被KeepAlive的组件称为“内部组件”。shouldKeepAlive标记的作用就是在组件卸载函数中,判断被卸载的是否是一个KeepAlive组件,如果是,调用KeepAlive组件的deActive方法进行组件的隐藏。

2023-01-20 20:44:19 857

原创 LeetCode刷题笔记 - JavaScript(三)

规律一:n位数上总的1的个数为n*(10^(n-1)),如1位数1的总和为1,2位数的1的总和为20,3位数的总和为300;规律二:求1~n之间的所有数上的1的数量总和就是求n上的每一个数位区间上的1的数量的总和。设f(n)是可以求出1-n之间所有1的数量的函数,假如n=234,那么1-n之间所有1的数量就等于:f(200)+f(30)+f(4);输入一个整数 n ,求1~n这n个整数的十进制表示中1出现的次数。:求1~n中每个数字出现的1的数量的和。:求每个滑动窗口的最大值。

2023-01-20 19:04:31 2247

原创 第五届字节跳动青训营 前端进阶学习笔记(六)什么才是好的JavaScript代码

课程重点代码规范相关事项如何优化代码本节课主要介绍了有关JavaScript代码规范和优化相关的问题。跟着月影大佬学习代码优化的过程非常的丝滑。

2023-01-20 16:47:56 1268

原创 第五届字节跳动青训营 前端进阶学习笔记(五)CSS进阶

CSS特性CSS布局规则flexgrid本节课主要介绍了CSS的几个很重要的特性:继承、特指度和初始值。然后,介绍了有关CSS布局的相关概念:行级盒子LFC、块级盒子BFC、FLexBox、Grid布局和浮动的相关概念。

2023-01-20 15:35:02 1940

原创 计算机网络学习笔记(五)网络层 - 控制层面

每台路由器都包含转发和路由选择功能。每台路由器中都包含转发和路由选择组件,用于与其他路由器中的路由选择组件通信,以计算其转发表的值。

2023-01-18 22:40:27 1249

原创 LeetCode刷题笔记 - JavaScript(二)

设dp[i][j]为投掷i个骰子时,点数和为j的概率。请定义一个队列并实现函数 max_value 得到队列里的最大值,要求函数max_value、push_back 和 pop_front 的均摊时间复杂度都是O(1)。即字符串是否为空或全空格,去除空格后的首字符是否是有效整数字符,以及是否超出32位整数边界。把n个骰子扔在地上,所有骰子朝上一面的点数之和为s。输入n,打印出s的所有可能的值出现的概率。:实现一个求队列最大值的均摊时间复杂度为O(1)的队列。:求n个投掷n个骰子可能出现的所有和的概率。

2023-01-18 19:49:05 694

原创 深入学习Vue.js(十)异步组件和函数式组件

除了超时导致加载组件失败之外,我们还需要对异步组件的加载错误做更加细粒度的处理,比如说加入组件加载过程中,出现报错信息,我们可以将报错信息传递给error组件,来进行更加细粒度的错误提示;异步组件受网络影响较大,加载过程可能时快时慢,当加载缓慢的时候,可能会给用户带来一种“卡死”的感觉,而加载过快则可能出现闪烁的情况。同时它也可以接收props参数。异步组件本质上是通过封装手段来实现友好的用户接口,从而降低用户的使用复杂度。除了基本的加载异步组价需求外,我们还需要处理组件的超时和加载失败的情况。

2023-01-18 16:45:57 1469

空空如也

空空如也

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

TA关注的人

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