Jungle

一、Git1. git 和 svn 的区别 git 和 svn 最大的区别在于 git 是分布式的，而 svn 是集中式的。因此我们不能再离线的情况下使用 svn。如果服务器出现问题，就没有办法使用 svn 来提交代码。 svn 中的分支是整个版本库的复制的一份完整目录，而 git 的分支是指针指向某次提交，因此 git 的分支创建更加开销更小并且分支上的变化不会影响到其他人。svn 的分支变化会影响到所有的人。 svn 的指令相对于 git 来说要简单一些，比 git 更容易上手。 GIT把内容按元数据方式存储，而SVN是按文件：因为git目录是处于个人机器上的一个克隆版的版本库，它拥有中心版本库上所有的东西，例如标签，分支，版本记录等。 GIT分支和SVN的分支不同：svn会发生分支遗漏的情况，而git可以同一个工作目录下快速的在几个分支间切换，很容易发现未被合并的分支，简单而快捷的合并这些文件。 GIT没有一个全局的版本号，而SVN有 GIT的内容完整性要优于SVN：GIT的内容存储使用的是SHA-1哈希算法。这能确保代码内容的完整性，确保在遇到磁盘故障和网络问题时降低对版本库的 ...

一、组件基础1. React 事件机制1<div onClick={this.handleClick.bind(this)}>点我</div> React并不是将click事件绑定到了div的真实DOM上，而是在document处监听了所有的事件，当事件发生并且冒泡到document处的时候，React将事件内容封装并交由真正的处理函数运行。这样的方式不仅仅减少了内存的消耗，还能在组件挂载销毁时统一订阅和移除事件。 除此之外，冒泡到document上的事件也不是原生的浏览器事件，而是由react自己实现的合成事件（SyntheticEvent）。因此如果不想要是事件冒泡的话应该调用event.preventDefault()方法，而不是调用event.stopPropgation()方法。 JSX 上写的事件并没有绑定在对应的真实 DOM 上，而是通过事件代理的方式，将所有的事件都统一绑定在了 document 上。这样的方式不仅减少了内存消耗，还能在组件挂载销毁时统一订阅和移除事件。 另外冒泡到 document 上的事件也不是原生浏 ...

一、CDN—了解即可1. CDN的概念CDN（Content Delivery Network，内容分发网络）是指一种通过互联网互相连接的电脑网络系统，利用最靠近每位用户的服务器，更快、更可靠地将音乐、图片、视频、应用程序及其他文件发送给用户，来提供高性能、可扩展性及低成本的网络内容传递给用户。 典型的CDN系统由下面三个部分组成： 分发服务系统：最基本的工作单元就是Cache设备，cache（边缘cache）负责直接响应最终用户的访问请求，把缓存在本地的内容快速地提供给用户。同时cache还负责与源站点进行内容同步，把更新的内容以及本地没有的内容从源站点获取并保存在本地。Cache设备的数量、规模、总服务能力是衡量一个CDN系统服务能力的最基本的指标。 负载均衡系统：主要功能是负责对所有发起服务请求的用户进行访问调度，确定提供给用户的最终实际访问地址。两级调度体系分为全局负载均衡（GSLB）和本地负载均衡（SLB）。全局负载均衡主要根据用户就近性原则，通过对每个服务节点进行“最优”判断，确定向用户提供服务的cache的物理位置。本地负载均衡主要负责节点内部的设备负载均衡 运营管理 ...

一、数据类型1. JavaScript有哪些数据类型，它们的区别？JavaScript共有八种数据类型，分别是 Undefined、Null、Boolean、Number、String、Object、Symbol、BigInt。 其中 Symbol 和 BigInt 是ES6 中新增的数据类型： Symbol 代表创建后独一无二且不可变的数据类型，它主要是为了解决可能出现的全局变量冲突的问题。 BigInt 是一种数字类型的数据，它可以表示任意精度格式的整数，使用 BigInt 可以安全地存储和操作大整数，即使这个数已经超出了 Number 能够表示的安全整数范围。 这些数据可以分为原始数据类型和引用数据类型： 栈：原始数据类型（Undefined、Null、Boolean、Number、String、Symbol、BigInt） 堆：引用数据类型（对象、数组和函数） 两种类型的区别在于存储位置的不同： 原始数据类型直接存储在栈（stack）中的简单数据段，占据空间小、大小固定，属于被频繁使用数据，所以放入栈中存储； 引用数据类型存储在堆（heap）中的对象，占据空间大、大 ...

一、CSS 基础1. CSS 选择器及其优先级 选择器 格式 优先级权重 id 选择器 #id 100 类选择器 #classname 10 属性选择器 a[ref=“eee”] 10 伪类选择器 li:last-child 10 标签选择器 div 1 伪元素选择器 li::after 1 相邻兄弟选择器 h1+p 0 子选择器 ul>li 0 后代选择器 li a 0 通配符选择器 * 0 对于选择器的优先级： 标签选择器、伪元素选择器：1 类选择器、伪类选择器、属性选择器：10 id 选择器：100 内联样式：1000 注意事项： !important 声明的样式的优先级最高； 如果优先级相同，则最后出现的样式生效； 继承得到的样式的优先级最低； 通用选择器（*）、子选择器（>）和相邻同胞选择器（+）并不在这四个等级中，所以它们的权值都为 0 ； 样式表的来源不同时，优先级顺序为：内联样式 > 内部样式 > 外部样式 > 浏览器用户自定义样式 > 浏览器默认样式。 2. CSS 中可继 ...

版本号的正确打开方式版本号广泛运用于开发的各种场景：NPM 包的版本定义、对 NPM 包的特定版本的依赖指定、git 的 daily 版本号分支…… 面对如此多的场景，版本号的命名却存在很大问题。举些例子： 开始写一个新项目 / 模块时，不管三七二十一，都从 0.0.1 起版本，直到项目不再维护时，版本还停留在 0.0.48，前两位永远都是 0。 API 变化巨大，而版本号雷打不动一步一个脚印。一个二方包从 0.0.8 升级到 0.0.9就引起了整个项目的崩溃。 依赖二方 / 三方包时，不知道该依赖哪个版本，有时随便指定了一个，有时则直接依赖了 *。 版本号的命名SemVer根据国际主流的惯例，我们使用「语义化版本（Semantic Versioning）」的命名方式，有时简称 SemVer。 语义化版本号（以下简称「版本号」）的格式是：<major>.<minor>.<patch>。即使用三位非负整数，以点号 . 连接。 如：1.4.15、6.2.0。 每一位版本号的含义 <major> 即主版本号，俗称大版本升级。改动到主版 ...

1. src 和 href 的区别src 和 href 都是用来引用外部的资源，它们的区别如下： src： 表示对资源的引用，它指向的内容会嵌入到当前标签所在的位置。src 会将其指向的资源下载并应⽤到⽂档内，如请求 js 脚本。当浏览器解析到该元素时，会暂停其他资源的下载和处理，直到将该资源加载、编译、执⾏完毕，所以⼀般 js 脚本会放在页面底部。 href： 表示超文本引用，它指向一些网络资源，建立和当前元素或本文档的链接关系。当浏览器识别到它指向的⽂件时，就会并⾏下载资源，不会停⽌对当前⽂档的处理。 常用在 a、link 等标签上。 2. 对 HTML 语义化的理解语义化是指 根据内容的结构化（内容语义化），选择合适的标签（代码语义化）。通俗来讲就是用正确的标签做正确的事情。 语义化的优点如下： 对机器友好，带有语义的文字表现力丰富，更适合搜索引擎的爬虫爬取有效信息，有利于 SEO。除此之外，语义类还支持读屏软件，根据文章可以自动生成目录； 对开发者友好，使用语义类标签增强了可读性，结构更加清晰，开发者能清晰的看出网页的结构，便于团队的开发与维护。 常见的语义化标签： ...

前言先对自己来个自我坦白，没写过总结，更没写过年度总结，得写😣！写下这篇总结最主要的缘由，可能是因为在“回头”时，突然看不到自己曾走过的路👣，实属惭愧。如果要用一句话来介绍一下自己，那么： “一个毫不起眼的菜鸡小前端”罢了。 我的2021如果要按照时间去划分区块的话，校园生活和实习生活很平均的分割了我的这过去的365天📅。 校园生活📖课程之内2021年的主要校园生活也就是“生产性实训”了吧，现在想想那时候的时间可真的珍贵，每天都是大把大把的自由时间，有一个全能的老师“手摸手”带着做项目，也没有好好的“汲取”到整个开发的精髓。可能总觉得依旧是课堂，依旧是老师授课，所以态度也一直是”校园叛逆风”（课堂上执拗性的不好好听，课下忙里偷闲逐字恶补）吧😭。 唯一庆幸的就是自己在实训过程中，提前确定下来了发展方向，拨开了”乱花渐欲迷人眼“的各种技术栈，选择了Vue，从各方面吸收别人的开发经验补充自己，也感谢自己当时可以不厌其烦的一直去“啃”它，虽然进展现在看起来挺慢挺笨的。从另一个角度去看，也没有完整的”Java全栈”这堂较为完善的实训路线（抱歉各位老师了😖）。 最后还有一个小惊喜，或者 ...

一、如何通过HR⾯HR通常是程序员⾯试的最后⼀⾯,讲道理刷⼈的⼏率不⼤,但是依然有⼈倒在了这最后⼀关上，我们会从HR的⻆度出发来分析如何应对HR⾯. 1. HR⾯的⽬的HR⾯往往是把控⼈才质量的最后⼀关,与前⾯的技术⾯不同,HR⾯往往侧重员⼯⻛险的评估与基本的员⼯素质。 录⽤⻛险评估****，这部分是评估候选⼈是否具备稳定性,是否会带来额外的管理⻛险，是否能⻢上胜任⼯作，⽐如频繁的跳槽会带了稳定性的⻛险，HR会慎重考虑这⼀点，⽐如在⾯试中候选⼈体现出了「杠精」潜质，HR会担⼼候选⼈在⼯作中会难以与他⼈协作或者不服从管理，带来管理⻛险，再⽐如，虽然国家明确规定在招聘中不得有性别、年龄等歧视，但是⼀个⼤龄已婚妇⼥会有近期产⼦的可能性，可能会有⻓期的产假，HR也会做出评估。 员⼯素质评估****，这部分评估候选⼈是否具备职场的基本素质，是否有基本的沟通能⼒，是否有团队精神和合作意识等等，⽐如⼀个表现极为内向的候选⼈,HR可能会对其沟通能⼒产⽣怀疑. 所以在与HR交流中要尽量保持踏实稳重、积极乐观的态度，切忌暴露出夸夸其谈、负能量、浮躁等性格缺陷。 2. HR⾯的常⻅问题（1）你对 ...

一、面试准备1. 利用脑图来梳理知识点对于统一校招类的面试，要重点梳理前端的所有知识点，校招面试一般是为了做人才储备，所以看的是候选人的可塑性和学习能力；对于社招类面试，则看重的是业务能力和 JD 匹配程度，所以要针对性地整理前端知识点，针对性的内容包括：项目用到的技术细节、个人技能部分需要加强或提升的常考知识点。 所以，不仅仅简历要针对性地来写，知识点也要根据自己的经历、准备的简历、公司和职位描述来针对性地梳理。 基础知识来自于自己平时的储备，一般对着一本系统的书籍或者自己平时的笔记过一遍即可，但是提到自己做到的项目是没有固定的复习套路的，而且围绕项目可以衍生出来各种问题，都需要了解，项目讲清楚对于候选人也特别重要。基础是固定的，任何人经过一段时间都可以学完的，但是项目经历是实打实的经验。 对于项目的复习和准备，建议列思维导图（脑图），针对自己重点需要讲的项目，列出用到的技术点（知识点），介绍背景、项目上线后的收益以及后续优化点。这是第一层，第二层就是针对技术点（知识点）做各种发散的问题。 注：JD（job description），是指职位描述，是其缩写。一般在招聘中，最常用到的意 ...