- 博客(41)
- 收藏
- 关注
RSS订阅原创 【TypeScript入门学习】
TypeScript 是一种由微软开发的自由和开源的编程语言。它是 JavaScript 的一个超集，而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。
2022-09-04 22:23:37
755
1
原创 【React事件+表单的使用+函数组件】
自定义Hooks：在应用中可以将一些需要重复使用的逻辑自定义成Hook示例：自定义一个Hook，返回一个和滚动条位置实时同步的stateimport {//获取window窗口的垂直滚动条 setScrollY(window . scrollY) } useEffect(() => {//注册监听 return() => {window . removeEventListener('scroll' , scroll) //注销监听 } } , [ ]);{{
2022-08-24 16:47:55
876
原创 【跨级组件的通信+组件的生命周期+React的常用特性】
获取ref时，需要通过ref的current属性来获取ref中具体存储的内容。：根据新的props和新的state生成新的虚拟DOM，将新的虚拟DOM和原来旧的虚拟DOM进行比对找到更新点，更新真实DOM。：当组件发生了更新，从组件更新开始一直监测到组件更新完成并重新渲染到真实DOM中。在父组件更新后子组件接收到新的props时触发。：从组件的初始化开始，到组件创建完成并渲染到真实的DOM中。：组件已经挂载完成，虚拟DOM已经添加到真实的DOM中。组件的生命周期：React组件的生命周期分为三个阶段。
2022-08-21 15:55:32
283
原创 【vue2和vue3使用v-model双向绑定的区别】
在 Vue2 中， v-model其实是一个语法糖，它背后本质上是包含两个操作：1.v-bind绑定一个value属性2.v-on指令给当前元素绑定input事件在 Vue3 中, 在自定义组件上使用v-model, 相当于传递一个modelValue属性， 同时触发一个。...
2022-08-18 16:46:49
552
原创 【Axios与Vue.axios请求模块】
npm install cors（在express服务器端进行此模块的安装，因为浏览器会将js代码跨域模块的访问进行拦截，出于安全考虑，所以为了进行跨域访问，需要安装这个cors模块）(2)支持PromiseAPI：请求的返回值是Promise对象(resolve、reject)请求时传参的方式、服务器端获取数据的方式与post请求类似。a、类似于get方式：服务器端以’req.query.参数名’的格式获取请求数据。== 服务器端：‘req.query.参数名’ (格式接收)==(4)拦截请求和响应。..
2022-08-12 17:25:43
94
原创 【Vue的插槽+Vue的过渡动画】
(1)匿名插槽(默认插槽)： ，有且只能有一个。☀举例：Son.vue代码段：Father.vue代码段：App.vue代码段：(2)具名插槽：当子组件的功能复杂时，子组件的插槽可能并非是一个。每个插槽给个名称。 比如封装一个导航栏的子组件，可能就需要三个插槽，分别代表左边、中间、右边。那么，外面在给插槽插入内容时，如何区分插入的是哪一个呢?这时候，就需要给slot指定一个name属性，也就是具名插槽。☀举例：Father.vue代码段：Son.vue代码段：App.vue代码段同上：(
2022-08-12 16:44:15
186
原创 【Vue组件之间的三种通信】
在子组件中通过props属性，来获取父组件中v-bind绑定的那个属性。在父组件中使用子组件时，需要通过v-bind指令绑定一个属性。name：是属性名。必须和provide的属性名相同。②创建两个兄弟组件，每个组件上都挂载监听器和触发器。父组件向子组件传值：子组件通过。子组件向父组件传值：通过。跨级组件之间的通信：使用。default：可选参数。①创建事件触发器并导出。Brother2代码段。...
2022-08-09 21:26:41
237
原创 Vue的深入学习（重点：限流函数）
Vue实例：又称为Vue组件（1）Vue2.0创建组件的方法 < script src = " https://cdn.jsdelivr.net/npm/vue@2.6.14 " > < body > < div id = " app " > {{msg}} < script > var app = new Vue({
2022-08-03 18:27:15
385
原创 详解“Node实现数据加密”过程
1）安装crypto模块(2)使用创建加密对象(3)使用加密对象的update(明文)进行加密，然后调用，然后调用返回定长的十六进制字符串。
2022-08-01 17:02:38
879
原创 Vue的认识与介绍
当数据发生变化是，vue自动更新视图Vue2.0的原理是利用了 Object.definedProperty 中的setter/getter 代理数据，监控对数据的操作。（这也是为什么vue不支持ie8 以及更早的ie浏览器的原因）Vue3.0原理：通过ES6的新特性proxy来劫持数据，当数据改变时发出通知Vue提供了 MVVM数据绑定和一个可组合的组件系统,具有简单、灵活的API。从技术上讲，Vue.js集中在MVVM模式上的视图模型层,并通过双向数据绑定连接视图和模型。具体了解请参考我的上一篇博
2022-07-31 16:39:18
1140
原创 Vue的架构模式
MVC是一个框架模式，它强制性的使应用程序的输入、处理和输出分开。最典型的MVC就是JSP+servlet+javabean的模式。不管是哪个，让Model和View不能直接通信是非常关键的限制。让Model和View直接通信在系统变得复杂时会成为灾难，Model和View直接耦合，会使得系统失控。核心关注Model的变化，让MVVM框架利用自己的机制去更新DOM，让开发者从操作DOM的繁琐解脱。）、视图（View）、主持人（Presenter）的缩写，分别代表项目中3个不同的模块。...
2022-07-31 10:55:43
2032
原创 Node.js异步编程
其中，resolve和reject是函数带的两个参数，其本质也是函数，在执行成功时，会在promise.then函数里接收resolve的返回值作为参数，失败则在.catch函数里接收reject的返回值作为参数。异步函数是异步编程语法的终极解决方案，它可以让我们将异步代码写成同步的形式，让代码不再有回调函数嵌套，使代码变得清晰明了。同步API会阻塞后面代码的执行，需要从上往下依次执行，异步API不会阻塞后面代码的执行。函数队列，等待所有同步代码完成后，再回调异步代码执行。...
2022-07-24 16:58:51
284
原创 HTTP Connection 头（header）说明：keep-alive和close的区别
在http请求时，我们一般会在requestheader或responseheader中看到”ConnectionKeep-Alive”或“Connectionclose”，这里具体的含义是有关http请求的是否保持长连接，即链接是否复用，每次请求是复用已建立好的请求，还是重新建立一个新的请求。而在实际生产环境中，可能会受到ECS/VM（云服务器/虚拟机）的连接数限制而会对该配置项进行选择调配。...
2022-07-20 18:19:38
4913
原创 HTTP与HTTPS的区别
HTTP页面响应速度比HTTPS快，主要是因为HTTP使用TCP三次握手建立连接，客户端和服务器需要交换3个包，而HTTPS除了TCP的三个包，还要加上ssl握手需要的9个包，所以一共是12个包。，如果攻击者截取了Web浏览器和网站服务器之间的传输报文，就可以直接读懂其中的信息，因此，HTTP协议不适合传输一些敏感信息，比如信用卡号、密码等支付信息。HTTP明文传输，数据都是未加密的，安全性较差，HTTPS（SSL+HTTP）数据传输过程是加密的，安全性较好。...
2022-07-20 17:56:26
75
原创 Set集合与Map集合
Set集合是一种数据结构，类似于数组。不能存放重复的值，通常用来做数组去重或字符串去重创建set集合及常用方法：二、Map集合
2022-06-28 17:06:27
209
原创 浅谈JavaScript的执行机制
浅谈JavaScript的执行机制首先我们先来了解一下关于js的以下两点1、JS是单线程语言2、JS的Event Loop （线性循环）是JS的执行机制。(1) JS为什么是单线程的？JS最初被设计用在浏览器中，那么想象一下，如果浏览器中的JS是多线程的。场景描述：那么现在有2个进程，process process1，由于是多进程的JS，所以他们对同一个dom，同时进行操作。 process 删除了该dom，而process1 编辑了该dom，同时下达2个矛盾的命令，浏览器究竟该如何执行呢？这样想，JS
2022-06-24 18:10:46
122
原创 原生JavaScript中NodeList和HTMLCollection的区别
主要不同在于HTMLCollection是元素集合而NodeList是节点集合（即可以包含元素，也可以包含文本节点）。
2022-06-06 11:49:24
268
原创 原型对象及原型链的理解
构造函数是一种特殊的函数，要用来初始化对象，即为对象成员变量赋初始值，它总是和new运算符一起使用，我们可以将对象中的一些公共的属性和方法抽取出来，然后封装到这个函数里。在构造函数中，其属性和方法我们称为成员。同时根据添加的方式不同，成员又分为：实例成员和静态成员。静态成员：在构造函数本身上添加的成员【静态成员只能通过构造函数来访问，不能通过实例化对象访问】实例成员：就是构造函数内部通过this添加的成员，uname,age,sing就是实例成员【实例成员只能通过实例化对象来访问，不可以通过构造函数类访问】
2022-06-01 12:30:07
167
原创 JavaScript浅拷贝与深拷贝的区别
JavaScript有两种数据类型，基础数据类型和引用数据类型。基础数据类型都是按值访问的，我们可以直接操作保存变量中的实际值，而引用类型如Array，我们不能直接操作对象的堆内存空间，引用类型的值都是按引用访问的，即保存在变量对象中的一个地址。一.深拷贝和浅拷贝的区别浅拷贝(shallow copy)：只复制指向某个对象的指针，而不复制这个对象本身，新旧对象共享一块内存。深拷贝(deep copy)：复制并创建一个一模一样的对象，不共享内存，修改新对象旧对象不会变。如何区分深拷贝与浅拷贝，简单点来
2022-05-23 17:44:29
3868
原创 JavaScript---part 4 闭包函数
闭包一个函数和对其周围状态（lexical environment，词法环境）的引用捆绑在一起（或者说函数被引用包围），这样的组合就是闭包（closure）。也就是说，闭包让你可以在一个内层函数中访问到其外层函数的作用域。在 JavaScript 中，每当创建一个函数，闭包就会在函数创建的同时被创建出来。我们首先知道闭包有3个特性：①函数嵌套函数②函数内部可以引用函数外部的参数和变量③参数和变量不会被垃圾回收机制回收词法作用域请看下面的代码：function init() { var n
2022-05-17 23:23:41
94
原创 JavaScript的三种排序算法比较
文章目录一、冒泡排序优点缺点二、选择排序优点缺点三、插入排序优点缺点一、冒泡排序冒泡排序原理：1.比较相邻的两个元素，如果前一个比后一个大，则交换位置。2.第一轮的时候最后一个元素应该是最大的一个。3.按照步骤一的方法进行相邻两个元素的比较，这个时候由于最后一个元素已经是最大的了，所以最后一个元素不用比较。图例：举例：<script> var arr=[23,11,32,43,24,78,46,13] console.log('排序前的数组：',
2022-05-17 16:13:55
576
原创 JavaScript---part 2
文章目录一、JS条件语句1、if语句2、if...else 语句3、if...else if...else 语句4、switch 语句二、JS循环语句1. for循环2. while循环3. do/while 循环三、break和continue语句1.break语句2. continue 语句四、作业1.输出1000以内的水仙花数2.输出100以内的所有完数3.计算a+aa+aaa+…+aa…aa一、JS条件语句1、if语句if语句的语法： if(条件表达式) { 代码段
2022-05-12 11:54:30
149
原创 JavaScript---part 1
文章目录一.Javascript的含义二.JavaScript的主要特点三.JavaScript的组成四.JavaScript的三种引入方式五、JaveScript的语法5.1 基本语法规则5.2 注释符号5.3 输入输出语句5.4 定义变量5.5 变量的数据类型5.6 数字型变量5.7 字符串型变量5.8 数据类型的检测5.9 将其他类型的数据转换成字符串5.10 将字符串转换为数字型的方式5.11 转换为Boolean六、各类运算符6.1 算术运算符：+、-、*、/、%6.2 关系运算符(比较运算符)
2022-05-06 10:05:20
206
原创 CSS之弹性盒子模型（Flex布局）
文章目录一、Flex布局是什么？二、基本概念三、容器的属性3.1 flex-direction属性3.2 justify-content属性3.3 flex-wrap属性3.4 align-items属性3.5 align-content属性3.6 flex-flow属性四、项目的属性4.1 flex属性4.2 align-self属性4.3 order属性五、相关案例5.1 案例1：flex设置主轴上的子元素排列方式5.2 案例2：flex-wrap子元素是否换行5.3 案例3：flex子项和flex份数
2022-04-26 17:41:59
2171
原创 CSS之盒子定位
文章目录定位导读1.1 为什么需要定位1.2 定位组成1.3 静态定位1.4 相对定位（==重要==）1.5 绝对定位（==重要==）1.6 子绝父相的由来1.7 固定定位fixed（==重要==）1.8 定位叠放次序 z-index1.8 定位的拓展1.9 定位案例元素的显示与隐藏2.1 display 属性2.2 visibility 属性2.3 overflow 溢出属性2.4 仿土豆网显示隐藏遮罩案例定位导读1.1 为什么需要定位定位可以让盒子自由地在某个盒子内移动位置或固定屏幕中的某个位置
2022-04-20 10:26:09
4228
1
原创 CSS-盒子浮动
文章目录一、浮动导读1.1 什么是浮动1.2 浮动特性1.3 网页布局准则二、清除浮动2.1 清除浮动的本质2.2 消除浮动影响（副作用）的方法一、浮动导读1.1 什么是浮动float属性用于创建浮动框，将其移动到一边，直到左边缘或右边缘及包含块或另一个浮动框边缘语法：选择器 { float ： 属性值 ；}属性值描述left元素向左浮动right元素向右浮动none元素不浮动（默认值）1.2 浮动特性①设置了浮动（float）的元素最重要特性：
2022-04-19 22:39:34
4628
2
原创 CSS--笔记1
文章目录CSS简介CSS引入方式CSS选择器基础选择器复合选择器CSS字体属性设置字体系列设置字体大小设置字体粗细设置文字样式字体复合属性CSS文本属性文本颜色对齐文本装饰文本文本缩进行间距CSS简介CSS——层叠样式表(Cascading Style Sheet)CSS3是新版本的CSS，与老版本(CSS2.1)相比在性能和成本上有大的提升。CSS最大价值：由HTML专注去做结构呈现，样式交给CSS。即结构(HTML)与样式(CSS)相分离。CSS引入方式内部样式表内部样式表（内嵌样式表
2022-04-13 13:49:43
336
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人