- 博客(16)
- 收藏
- 关注
RSS订阅原创 手写---前端简单路由
本文路由呈现以hash形式，当URL中的hash值发生变化时，监听hashchange，触发回调函数，再在回调函数中进行不同的操作，进行不同内容的展示。
2022-08-05 18:13:17
317
1
原创 前端性能优化
！减少请求1、减少HTTP请求尽量减少页面的请求数，可以合并css和js，或者使用css精灵图等2、避免重定向301、302这类的状态码就涉及内容的重定向。301永久重定向，是指原来的URI已经永久性的不存在了，今后所有的请求都必须改用新的URI。302临时重定向，是指原URI处于‘临时维护’状态，新的URI是起了顶包的临时工的作用。重定向带来一定“性能损耗”,很明显，重定向的机制决定了一个跳转会有两次请求-应答，比正常访问多了一次。3、缓存资源使用缓存资源，减少向服务器的请求数，节省加载时间，所有静态资源
2022-07-25 15:01:12
636
原创 前端实习周记1---环境配置、静态页面、作品呈现页
一、环境配置刚去公司实习，先配发了电脑，之后导师让自己先配置一下公司域网、配置VS、node、git环境1、node安装node一定要安装低一些的版本，下载地址:https://nodejs.org/en/。官网会有两个版本，工作要选择LTS版本（长期维护版）但最开始建议安装较低版本的node，我当时安装了16.15.0node，结果公司的项目代码跑起来一堆报错，找了很久问题，问了下导师才发现问题，node版本太高，最后降为了10.4.1。node版本可以使用nvm来对版本进行管理控制.
2022-05-30 11:24:31
4416
原创 CSS笔试题整合---不断更新
第一套（50题）1、那个HTML5元素用于显示已知范围内的标量测量？<meter>标签定义一致范围内或分数值内的标量测量，也被称为guage(尺度）。例如：磁盘用量、查询结果的相关性等.注：<meter> 标签不应用于指示进度（在进度条中）。如果标记进度条，请使用 <progress> 标签。2、在 HTML 中，样式表按照应用方式可以分为三种类型，其中不包括（D ）A、内嵌样式表 B、行内样式表 C、外部样式表文 D、类样式表...
2022-05-01 15:40:44
5106
原创 HTTP与HTTPS，HTTPS为什么比HTTP更安全？
一、安全性HTTP在通信中：通信使用明文，不对内容进行加密，容易被窃听 不验证通信方的身份，内容可能被伪装分子窃取HTTPS则解决了上述问题：内容加密，建立一个信息安全通道，来保证数据传输的安全 身份认证，确认网站的真实性 数据完整性，防止内容被第三方冒充或者篡改HTTPS=HTTP+SSL/TLS ，如今SSL已废弃，所以只关注HTTP+TLS，在开始传输数据之前，通过安全可靠的TLS协议进行加密，从而保证后续加密传输数据的安全性。TLS协议：传输层安全性协议，目的是为了保证网络
2022-04-27 15:50:08
1362
原创 JavaScript函数---箭头函数
// 箭头函数let fun = (name) => { // 函数体 console.log(name)};// 等同于let fun = function (name) { // 函数体 console.log(name)};箭头函数语法比普通函数要简单很多一、关于箭头函数的参数：如果箭头函数没有参数，直接写一个空括号即可 若参数只有一个，也可以省去包裹参数的括号 若有多个参数，将参数依次用“，”隔开，包裹在括号中即可// 没有参数.
2022-04-27 10:57:08
3913
原创 排序算法---堆排序
一、堆堆排序是利用堆这种数据结构来设计的一种排序算法，是一种选择排序（每轮排序会选出一个最大/最小值），最坏、最好、平均时间复杂度均为O（nlogn），是不稳定的排序。使用堆排序，可以是一个动态的过程，若题目中只需某个排序位的值，则只需排序置该位置，不用全排序好再去拿，只需要针对部分元素进行排序，这样可以降低复杂度。堆排序过程中，是看不到树的结构的，因为使用完全二叉树的性质，用数组表示对应的树结构，又叫顺序存储。顺序存储二叉树的特点：第n个元素父节点为（n-1)/2 第n个元素左子节点
2022-04-26 22:51:08
2594
原创 HTTP与HTTPS，它们的区别？
一、HTTPHTTP超文本运输协议，是实现网络通信的一种规范，是一个客户端和服务端请求和应答的标准（TCP），使浏览器更加高效，网络传输减少。HTTP协议是以明文方式发送信息，如果黑客截取了传输报文，便可直接获取其中的信息。特点如下：支持客户/服务器模式 简单快捷：客户想服务器发送请求时，只需传送请求方法和路径。HTTP协议简单，使得HTTP服务器的程序规模小，通信速度快 灵活：HTTP运行传输任意类型的数据对象。正在传输的类型由Content-Type来标记 无连接：限制每次连接只处理一
2022-04-26 21:16:44
204
原创 网络传输协议之：Http1、Http2、Http3
一、什么是HTTP？HTTP（HyperText Transfer Protocol），是超文本传输协议，是目前互联网上要用最广泛的一种网络协议，所有的 WWW文件都必须遵守该标准。HTTP又使用了可靠的数据传输协议TCP协议，不会产生数据丢失和损坏。（HTTP协议属于应用层协议）HTTP的工作流程浏览器与服务器建立TCP连接，即三次握手 TCP连接成功，浏览器发出HTTP请求命令 服务端接收请求并返回HTTP响应 服务器关闭连接，即四次挥手 浏览器解析请求的资源connection：
2022-04-25 22:51:23
8077
原创 JavaScript中实现继承的方法（深入学习原型链、盗用构造函数、组合继承、原型式继承、寄生式继承、寄生式组合继承）
一、原型链原型链的基本思想就是通过原型继承多个引用类型的属性和方法。构造函数、原型和实例的关系：每个构造函数都有一个原型对象，原型有一个属性指回构造函数，而实例有一个内部指针指向原型。若原型是另一个类型的实例，就意味着这个原型本身有一个内部指针指向另一个原型，相应的另一个原型也有一个指针指向另一个构造函数。这样就在实例和原型之间构造了一条原型链。function SuperType(){ this.property = true}SuperType.prototype.getSup
2022-04-23 09:27:37
1250
原创 Map、WeakMap的区别
一、Map1、基本API使用new关键字和Map构造函数可以创建一个空映射const m = new Map()如果想在创建的同时初始化实例，可以给Map构造函数传入一个可迭代的对象，需要包含键值对数组。可迭代对象的每个键值对都会按照迭代顺序插入到新映射实例中 。初始化之后，可使用set（）方法再添加键值对。使用get（）和has（）进行查询，通过size属性获得映射中键值对的数量，还可以使用delete（）和clear（）删除值。 const m = new Map()
2022-04-23 08:22:55
2583
原创 js输出一个指定大小的风车
let n = 7 function zi(res,i,t,o){ for (let j = 0; j < t; j++) { if (i == 0 || j == 0 || j == o) { res += '*' } else { res += " " } } ...
2022-04-22 00:54:58
104
原创 深入理解this、call、apply、bind
call、apply、bind作用是改变函数执行时的上下文，就是改变函数运行时的this指向一、thisthis关键字是函数运行时自动生成的一个内部对象，只能在函数内部使用，总指向调用它的对象。this在函数执行过程中，this一旦被确定了，就不可以在更改。1、this默认绑定全局环境中，内部使用this关键字，指向Window对象var name = "Tong"function person(){ return this.name}console.log(person(
2022-04-21 12:09:00
166
原创 JavaScript 变量、作用域与内存
目录一、原始值与引用值1、动态属性2、复制值3、传递参数4、确定类型二、执行上下文与作用域1、作用域链增强2、变量声明三、垃圾回收1、标记清理2、引用计数3、性能4、内存管理一、原始值与引用值原始值就是最简单的数据，引用值则是多个值构成的对象原始值：Undefined、Null、Boolean、Number、String和Symbol。在把一个值赋值给变量时，js引擎必须确定这个值是引用值还是原始值。保存原始值的变量是按值访问，操作的是..
2022-04-21 00:45:34
894
原创 浏览器页面的渲染流程
浏览器的主要功能是将用户需要的Web资源在浏览器上呈现出来，通过用户输入URL来指定所请求的资源位置，从服务器上请求资源，并将其显示在浏览器窗口中1、解析HTML文件，构建DOM Tree自上而下的深度遍历过程，会将当前结点的所有子节点构建完成后，进行当前结点的下一个兄弟结点的构建，直到将所有的标签都遍历完成。遇到任何样式（link、style）与脚本（script）都会阻塞（外部样式不阻塞后续外部脚本的加载）2、解析CSS，构建CSSOM Tree（css规则树）给各个元素..
2022-04-20 15:49:46
3049
原创 本地存储三种方法cookie、localStorage、sessionStorage；扩展IndexedDB
共同点：都保存在浏览器端、且同源区别：1、通信 2、存储大小 3、数据有效期 4、作用域1、通信cookie数据始终在同源的http请求头中携带（即使不需要），即cookie在浏览器和服务器间来回传递。cookie数据还有路径（path）的概念，可以限制cookie只属于某个路径下。 sessionStorage和localStorage是单纯的前端存储，不会主动把数据发送给服务端，仅在本地存储。2、存储大小cookie数据不能超过4KB，因为每次http请求都会携带cookie、所以c
2022-04-20 01:07:02
407
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人