m0_61478092的博客

原创 前端工程化-什么是构建工具

了解构建工具之前，我们首先要知道的是浏览器只认识html、css、js，而我们开发时用的vue，react框架都只是为了方便我们开发而使用的工具。

原创 原型链继承

2.关键：在子类型构造函数中通过call()调用父类型构造函数。（7）创建子类型的对象：可以调用父类型的方法、（4）创建父类型的对象赋值给子类型的原型。（5）将子类型原型的构造属性设置为子类型。1.利用原型链实现对父类型对象的方法继承。（3）在子类型构造函数中调用父类型构造。方式二：借用构造函数继承（假的）子类型的原型为父类型的一个实例对象。（2）给父类型的原型添加方法。（3）定义子类型的构造函数。（6）给子类型原型添加方法。（1）定义父类型构造函数。（1）定义父类型构造函数。（2）定义子类型构造函数。

原创 函数和执行上下文

执行栈，也就是在其他编程语言中所说的“调用栈”，是一种拥有LIFO（后进先出）数据结构的栈，被用来存储代码运行时创建的所有执行上下文。当该函数执行结束时，执行上下文从栈中弹出，控制流程到达当前栈中的一个上下文。（1）在调用函数，准备执行函数体之前，创建对应的函数执行上下文对象（虚拟的，存于栈中）（2）在全局执行上下文（window)确定后，将其添加到栈中（压栈）（3）在函数执行上下文创建后，将其添加到栈中（压栈）（4）在当前函数执行完后，将栈顶的对象移栈（出栈）（3）开始执行函数体代码。

原创 原型与原型链

javascript常被描述为一种基于原型的语言（每个对象都拥有一个原型对象）当访问一个对象的属性时，它不仅在该对象上寻找，还会寻找该对象的原型，以及该对象原型的原型，层层向上，直到找到或者到达原型链的末尾函数可以有属性，每个函数都有一个特殊的属性叫做原型prototype// 控制台输出/* {*/上面的这个对象，就是大家常说的原型对象可以看到，原型对象有一个自有属性constructor，这个属性指向该函数，如下图关系展示。

原创 JS闭包的应用场景

js闭包的应用场景:节流防抖、函数柯里化、链式调用等

原创 手写实现call、apply、 bind

call，apply，bind是Javascript中用于改变普通函数this指向（无法改变箭头函数this指向）的方法，这三个函数实际上都是绑定在function构造函数的prototype上，而每一个函数都是Function的实例，因此每一个函数都可以直接调用call,apply,bind

原创 前后端身份认证

身份认证（Authentication）又称“鉴权”，是指通过一定的手段，完成对用户身份的确认。例如：在Web开发中，涉及到用户身份的认证，例如：各大网站的手机验证码登录、邮箱密码登录，二维码登录等。Cookie是存储在用户浏览器中的一段不超过4KB的字符串。它由一个名称，一个值和其他几个用户控制Cookie有效期，安全性，适用范围的可选属性组成不同域名下的Cookie各自独立，每当客户端发起请求时，会自动把当前域名下的所有未过期的Cookie一同发送到服务器。

原创 详解Pinia和Vuex

1.什么是vuex？为什么要使用vuex?Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式 + 库。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。

原创 删除链表的倒数第N个节点-双指针法

双指针的经典应用，如果要删除倒数第n个节点，让fast移动n步，然后让fast和slow同时移动，直到fast指向链表末尾。(2)fast首先走n + 1步 ，为什么是n+1呢，因为只有这样同时移动的时候slow才能指向删除节点的上一个节点（方便做删除操作）输入：head = [1,2,3,4,5], n = 2。(1)定义fast指针和slow指针，初始值为虚拟头节点。输入：head = [1,2], n = 1。输入：head = [1], n = 1。输出：[1,2,3,5]

原创 HTTP协议

http协议相关总结！！！

原创 TCP连接的三次握手与四次挥手【重点】

TCP是面向连接的协议，它基于运输连接来传送TCP报文段TCP运输连接的建立和释放是每一次面向连接的通信中必不可少的过程TCP运输连接有以下三个阶段TCP的运输连接管理就是使运输连接的建立和释放都能正常的进行。

原创 TCP与UDP协议详解！！！

基于连续ARQ协议，在某些情况下，重传的效率并不高，会。可以很方便地在TCP连接上实现对发送方的流量控制。，TCP协议使用滑动窗口实现流量控制。拥塞控制与流量控制的区别：流量控制考虑。重复传输部分已经成功接收的字节。让发送方发送速率不要太快。慢开始算法+拥塞避免算法。点对点的通信量的控制。

原创 计算机网络-网络层总结

计算机网络-网络层知识总结

原创 【Vue3组件通信方式】

vue3组件通信方式

原创 【Js+Vue考核总结】

JS+Vue知识点

原创 数据库的基本操作

数据库的基本操作

原创 【JS基础知识总结1】

js总结

原创 【Dom查询】

一、获取元素节点方法通过document对象调用1.getElementById()-通过id属性获取一个元素节点对象2.getElementsByTagName()-通过标签名获取一组元素节点对象3.getElementByName()-通过name属性获取一组元素节点对象二、通过具体元素节点调用1.getElementsByTagName()-方法，返回当前节点的指定标签名后2.childNodes()-属性，表示当前节点的所有子节点3.firstChild()-属性，

原创 【数组的方法】

方法一：push1.该方法可以向数组的末尾添加一个或对各元素，并返回数组的新的长度2.可以将要添加的元素作为方法的参数传递3.这些元素将会自动添加到数组的末尾var arr=["孙悟空","猪八戒","沙和尚"];var result=arr.push("唐僧","白骨精","玉兔精");console.log(arr);console.log("result ="+ result);方法二：pop该方法可以删除数组的最后一个元素,并将被删除的元素作为返回...

原创 【JS-数组相关知识】

数组数组也是一个对象它和我们普通对象的功能类似，也是用来存储一些数值的不同的是普通对象是使用字符串作为属性名而数组时使用数字来作为索引操作元素索引： 从0开始的整数数组的存储性能比普通对象好，在开发中我们经常使用数组来存储一些数据一、创建数组1.使用对象字面量创建数组使用字面量创建数组时，可以在创建时就指定数组中的元素 var arr=[1,2,3,4,5,10];2.使用构造函数方法创建数组使用构造函数创建数组时，也可以同时添加元素，将要添加的元素作为构造函数的参数传递

原创 【创建对象的几种方式】

1.使用new关键字调用的函数，是构造函数的constructor.构造函数是专门用来创建对象的函数使用typeof检查一个对象时，会返回objectvar obj=new Object();obj.name="吴世勋";obj.sex="男";obj.age="28";console.log(obj);2.使用对象字面量创建对象在书写时应该注意如果一个属性后没有其他的属性，就不再用逗号分隔开 var obj={ name:"xix.

原创 强制类型转换

强制类型转换为其他数据类型类型转换主要指：将其他的数据类型转换为String、Number、Boolean1.将其他的数据类型转换为String方式一：调用被转换数据类型的toString()方法调用a的toString()方法 语法：a=a.toString()；注：null和undefined这两个值没有toString方法​ var a=100; a=a.toString(); var b=true; .

原创 【Flex布局】

Flex布局教程语法篇：布局的传统解决方法基于盒子模型，依赖display属性+position属性+float属性。但对于特殊布局非常不方便，如：垂直居中较不容易实现‘因此出现了一种新的布局flex布局一、什么是flex布局？Flex布局是css3新增的一种布局方式，意为弹性布局，用来为盒状模型提供最大的灵活性，任何一个容器都可以指定为flex布局。我们可以通过将一个元素的display属性设置为flex从而使它成为一个flex容器，它所有子元素都会成为他的项目。一个容器有两个轴，一个是水平的

原创 【实验室考核（下）】

1.画一条0.5px的线：div { width: 200px; height: 1px; background-color:pink; transform:scaleY(0.5); }在浏览器中，理论上1px已经是最小的单位，此时我们可以缩放的方式，使其变为原来的0.5倍2.使用css实现淡入淡出 动画效果.donghua { width: 200px;

原创 【实验室考核（上）】

第一次前端小组考核一、常见的块级元素和行内元素有哪些？说说行内元素和块级元素的主要区别块级元素：p,div,table,ul ,dl,ol,h1~h6等行内元素：img,a,input,span,strong,em,i等块级元素特点：1.总是在新行开始2.高度，行高，内边距外边距都可控3.可以容纳内联元素（文本元素），与其他块级元素行级元素特点：1.相邻元素在一行上显示多个2.高，行高，内边距与外边距不可改变3.内联元素只能容纳文本或其他内联元素二、去点ul li前面的小点，需要使用

原创 【css3动画】

1.css3动画动画是css3中具有颠覆性的特征之一，可通过设置多个节点来精确控制一个或一组动画，常用来实现复杂的动画效果相较过渡：动画可以实现更多变化更多控制，连续自动播放效果制作步骤：先定义动画在使用（调用）动画1）用keyframes定义动画（即定义选择器）@keyframes 定义动画 { 0% { width:100px; } 100% { width:200px; }注：百分比是总的时间的划分2）元素使用动画div {

原创 【html5新增多媒体标签】

html5新增多媒体标签html5在不使用插件的情况下，也可以原生的支持音频格式文件的播放：一、video标签作用：播放视频格式一：<video src=" " autoplay="autoplay"controls="controls"poster=""><video>video标签属性：autoplay：视频就绪是否自动播放controls：是否需要显示控制条width ：设置播放器宽度height：设置播放器高度，高度或宽度只推荐其中一种，否则容易变形

原创 【 清除浮动总结】

清除浮动总结一、为什么需要清除浮动?由于浮动元素不再占有原来的文档流的位置，所以会对后面的元素排版产生影响1.父级没高度2.子盒子浮动了3.影响下面布局，我们就应该清除浮动二、清除浮动的本质：清除浮动本质是清除浮动元素造成的影响如果父盒子本身有高度，则不需要清除浮动清除浮动之后，父级就会根据浮动盒子自动检测盒子三、清除浮动的方法：策略：闭合浮动1.方式一：额外标签法即隔墙法步骤：在浮动元素末尾添加一个新的盒子即一个空标签为盒子添加其clear属性其他写法：&lt

原创 【css3-2D转换】

css3-2D转换转换是css3具有颠覆性的特征之一，可以实现元素的位移、旋转、缩放等效果一、2D转换之移动translate2D移动是2D转换里面的一种功能，可以改变元素在页面中的位置，类似定位1.语法：transform:translate(x,y);transform:translateX(n);transform:translateY(n);2.重点定义2D转换中的移动，沿着X和Y轴移动元素translate最大的优点：不会影响到其他元素的位置translate中的百分比

原创 【css高级技巧】

css高级技巧一、精灵图核心：精灵技术主要针对于背景图片使用，多个小图片组合成一张大图片大图片也称为Sprietes精灵图二.字体图标（icon-font)1.字体图标使用1）字体图标使用场景：主要用于显示网页中通用、常用的一些小图标2)字体图标可以为前端工程师提供一种方便高效的图标使用方式，展示的是图标，本质属于字体3）优点：轻量级、灵活性、兼容性2.总结：简单的小图标字体图标是一些网页常见的小图标，即分为：1）字体图标的下载2）字体图标的引入（引入到html页面）3

原创 【元素的显示与隐藏】

元素的显示与隐藏本质：让一个元素在页面中隐藏或显示出来1.display属性display属性用于设置一个元素应如何显示display: none;//隐藏对象display: block;//除了转换为块级元素之外，同时还有显示元素display 隐藏元素后，不再占有其原先位置（搭配js做网页设计特效）2.visibility可见性visibility: visible;//元素可视visibility: hidden; //元素隐藏visibility隐藏元素后，继续占有原来的位

原创 【css网页布局总结】

css网页布局总结通过盒子模型，我们清楚知道html标签就是一个盒子。 通过css浮动、定位可以让每个盒子排列成为网页。一个完整的网页，是标准流、浮动、定位一起完成布局的，每个都有自己的专门用法。1.标准流可以让盒子上下排列或者左右排列，垂直的块级盒子显示就用标准流布局2.浮动可以让多个块级元素一行显示或者左右对齐盒子，多个块级盒子水平显示就用浮动布局3.定位定位最大的特点是有曾层叠的概念，就是可以让多个盒子前后叠压来显示，如果元素自由在某个盒子内移动就用定位布局...

原创 【css定位】

一、为什么需要定位当标准流或浮动都无法快速实现，此时需要定位来实现浮动可以让多个块级盒子一行没有缝隙排列显示经常用于横向排列盒子定位则是可以让盒子自由的在某个盒子内移动位置或固定在屏幕某个位置二、定位的组成定位：将盒子定在某一个位置，所以定位也在摆放盒子，按照定位的方式移动盒子定位=定位模式+边偏移定位模式用于指定一个元素在文档中的定位方式，边偏移则决定了该元素的最终位置1.定位模式定位模式决定元素的定位模式，它通过css的position属性来设置，其值可以分为四个2.边偏移边

原创 【css盒子模型】

盒子模型页面布局主要学习三大核心：盒子模型、浮动、定位1.看透网页布局的本质：利用css摆盒子网页布局过程：1）准备好相关的网页元素，网页元素基本都死盒子box2) 利用css设置盒子样式，然后放到相应位置3）往盒子里面装内容2.盒子模型的组成盒子模型：把html页面布局元素看作是一个矩形的盒子，也就是一个盛装内容的容器css盒子模型本质是一个盒子，封装周围的html元素，包括：边框、外边距、内边距和实际内容元素元素border边框content

原创 【 CSS的三大特性】

CSS的三大特性1.层叠性相同选择器给设置相同的样式，此时一个样式就会覆盖另一个冲突的样式，层叠性主要解决样式冲突问题。层叠性原则：样式冲突遵循就近原则，哪个样式离结构近就执行哪个样式样式 不冲突不会层叠2.继承性css中的继承子标签会继承父标签的某些样式，如文本颜色和字号，简单理解就是子承父业理解：恰当的使用继承可以简化代码，降低css样式的层叠性子元素可以继承父元素的样式（text-,font-,line-)这些元素开头的可以继承以及color属性行高的继

原创 【css的背景属性】

css的背景属性背景属性可以设置背景颜色、背景图片、背景平铺、背景图片位置、背景图像固定等 背景颜色 背景图片 背景平铺 背景位置 背景图像固定 背景复合写法 背景色半透明一、背景颜色语法格式：background-color :颜色值颜色的默认值是：transparent(透明）二、背景图片语法格式：background-image :none/url();属性说明：属性说明none无背景url()图片绝对相对路径三、背

原创 【css复合选择器】

css的学习有关emmet语法Emmet语法的前身是HTML结构语法，来提高HTML/css编写速度1）快速生成HTML结构语法2）快速生成css样式语法一、css的复合选择器的介绍1.什么是css的复合选择器在css中，可以根据选择器的类型把选择器分为基础选择器和复合选择器，复合选择器是建立在基础选择器之上的，对基本选择器进行组合形成。2.复合选择器的特点复合选择器可以更准确，更高效的选择目标元素（标签）复合选择器是由两个或多个基础选择器，通过不同的方式组合而成常

原创 【前端学习之HTML总结】

原创 算法题：螺旋矩阵

螺旋矩阵问题描述一个 nnn 行 nnn 列的螺旋矩阵可由如下方法生成：从矩阵的左上角（第 111 行第 111 列）出发，初始时向右移动；如果前方是未曾经过的格子，则继续前进，否则右转；重复上述操作直至经过矩阵中所有格子。根据经过顺序，在格子中依次填入 111, 222 , 333, … , nnn ，便构成了一个螺旋矩阵。下图是一个 n = 4 时的螺旋矩阵。输入格式输入共一行，包含三个整数 n,i,jn,i,jn,i,j ，每两个整数之间用一个空格隔开，分别表示矩阵大小、待求的数

原创 程序设计：轻重搭配

n 个同学去动物园参观，原本每人都需要买一张门票，但售票处推出了一个优惠活动，一个体重为 xxx 的人可以和体重至少为 2x2x2x配对，这样两人只需买一张票。现在给出了 nnn 个人的体重，请你计算他们最少需要买几张门票？输入格式第一行一个整数 nnn，表示人数。第二行 nnn 个整数，每个整数 aia_iai​ 表示每个人的体重。输出格式一个整数，表示最少需要购买的门票数目。样例解释111 和 999 配对，777 和 333 配对，剩下 5,55,55,5 单独，一共买四.