自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 【TypeScript语法基础】

数组中元素的数据类型都一般是相同的(any[] 类型的数组可以不同),如果存储的元素数据类型不同,则需要使用元组。(5) map.delete() – 删除 Map 中的元素,删除成功返回 true,失败返回 false。(8) map.values() – 返回一个新的Iterator对象,包含了Map对象中每个元素的值。(1)变量的值会动态改变时,比如来自用户的输入,任意值类型可以让这些变量跳过编译阶段的类型检查。(2) pop() 从元组中移除元素(最后一个),并返回移除的元素。

2022-09-02 13:46:12 534 1

原创 【React Hooks&Redux--学习小结】

示例:自定义一个Hook,返回一个和滚动条位置实时同步的state。

2022-09-02 09:33:11 483

原创 【React的特性&事件&表单的使用&函数组件】

3、非受控组件:组件的状态和表单控件状态不同步(只是表单控件的初值和组件的state一致)。1、将组件的状态(state)与表单的状态进行绑定:当组件的state发生改变时修改表单的状态,或者表单的状态被改变时通过setState修改组件的状态,这样就形成了组件对表单控件的控制—受控组件。该数组的第一个元素(索引为0的元素)是state的具体值,该数组的第二个元素(索引为0的元素)是一个方法,用来更新state值,然后引起视图的更新。函数组件 :一个函数就是一个组件(简易组件)。一般作为纯展示组件使用。.

2022-09-01 17:31:27 427

原创 【跨级组件的通信&组件的生命周期&React的常用特性】

(1)constructor(props):构造函数,在函数中会初始化该组件。在父组件更新后子组件接收到新的props时触发。(4)render():根据新的props和新的state生成新的虚拟DOM,将新的虚拟DOM和原来旧的虚拟DOM进行比对找到更新点,更新真实DOM。(2)sholdComponentUpdate(nextProps,nextState):用于判断是否要进行组件的更新。(3)render:根据return中的值生成虚拟DOM,然后提交个ReactDOM,渲染到真实的DOM中。

2022-08-20 22:33:59 315

原创 【React的组件&组件间的通信(父向子,子向父,同级组件通信)】

什么是组件:是视图的抽象。

2022-08-20 20:51:50 682

原创 【命令式编程和声明式编程】

显而易见,你只是想要吃糖醋排骨,至于糖醋排骨是你妈妈忙活一番做出来的,还是你妈妈点了外卖,外卖小哥冒着风雪送来的,只要糖醋排骨能让你满意,其它的你也许都不关心。操作DOM时,你关注的是结果,而js操心的是怎么把你要的结果都找到和拿回来,你是在做声明式编程,而js引擎是在做命令式编程。在家时,你关注的是糖醋排骨,妈妈操心怎么给你弄来糖醋排骨,你是在做声明式编程,而你妈妈是在做命令式编程。在公司时,领导关注的是业绩,你操心的是怎么把业绩做到上千,领导是在做声明式编程,而你是在做命令式编程。

2022-08-19 21:10:34 1119

原创 【React函数组件&类组件的props属性】

React框架规定Props是不能被修改的, 也就是说Props是个只读的参数。3、可以通过’组件名.defaultProps={ default: 值 }’ 方式来设置类组件的props属性值。2、在类组件的构造方法中必须使用super(props)完成父类的构造。注意:'属性名’就是参数名,会封装到props中。1、用于React函数组件的参数的输入。1、类组件默认含有props属性。3、props属性是只读的。// 1、获取页面的元素。// 2、定义函数组件。

2022-08-19 17:49:43 1435

原创 【React框架&JSX语法&React的组件】

1)是一个JavaScript库,用于简化用户界面的设计。(2)美国的Facebook公司2013年发布(3)基于jsx(JavaScript XML)语法.使用XML标记将html、JavaScript混写。是React的核心。(4)组件:是数据和逻辑的封装,提高了代码的复用率,便于测试和维护。...

2022-08-18 17:31:42 157

原创 【双向数据绑定原理 vue2.0 与 vue3.0】

vue的人都知道 vue2.x实现双向数据绑定的原理是利用Object.defineProperty() 这个方法重新定义了对象获取属性值(get)和设置属性值(set)的操作来实现的,当数据发生改变发出通知。在MDN上对该方法的说明是:Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象。它接收三个参数,要操作的对象,要定义或修改的对象属性名,属性描述符。属性描述符是一个对象,主要有两种形式:数据描述符和存取描述符。......

2022-08-18 09:08:45 127

原创 【Vuex---状态管理器的使用】

④ 如果有计算属性(get函数写在getters里面),则状态通过getters的$store.getters()或mapGetters()来更新组件;反之就通过$store.state()或者mapState()的方式来更新组件。简单来说,就是对Vue的应用中多个组件的共享状态进行集中式的管理(读/写)① 在组件(页面)中,通过dispatch()或mapActions()这个函数分发给actions的函数去处理。:此时传参的方法对于多层嵌套的组件将会非常繁琐,并且对于兄弟组件间的状态传递无能为力。...

2022-08-16 23:05:06 133

原创 【Vue的路由】

routes,在路由表中包含多个route。

2022-08-10 18:11:44 1443

原创 【axios、vue-axios请求模块】

npm install cors(在express服务器端进行此模块的安装,因为浏览器会将js代码跨域模块的访问进行拦截,出于安全考虑,所以为了进行跨域访问,需要安装这个cors模块)put请求:用于对数据更新时使用.请求时传参的方式、服务器端获取数据的方式与post请求类似。a、类似于get方式:服务器端以’req.query.参数名’的格式获取请求数据。b、类似于post方式:服务器端以’req.body.参数名’的格式获取请求数据。axios模块:是一个基于promise的http客户端请求工具。..

2022-08-09 22:04:11 333

原创 【Vue的插槽&Vue的过渡动画】

(1)匿名插槽(默认插槽):有且只能有一个☀️举个例子:Son.vue代码段:Father.vue代码段:App.vue代码段:(2)具名插槽:当子组件的功能复杂时,子组件的插槽可能并非是一个。每个插槽给个名称。 比如封装一个导航栏的子组件,可能就需要三个插槽,分别代表左边、中间、右边。那么,外面在给插槽插入内容时,如何区分插入的是哪一个呢?这时候,就需要给slot指定一个name属性,也就是具名插槽。☀️举个例子:Father.vue代码段:Son.vue代码段:App.vue代码段同上:(

2022-08-08 18:20:23 325

原创 【Vue组件之间的三种通信】

(1)父组件向子组件传值:子组件通过props属性获取父组件中的值☀️举个例子:Father.vue代码段:Son.vue代码段:App.vue代码:(2)子组件向父组件传值:通过触发事件的方式传递(使用$emit触发自定义的事件)☀️举个例子:FatherOne.vue代码段:SonOne.vue代码段:App.vue代码段:(3)在组合式API(setup)中使用this所出现的问题(子传父)获取proxy的方法C、强调:1、创建事件中心:创建事件触发器并导出event.js代码段:2、

2022-08-07 11:43:16 619

原创 【使用工具在Vs-code/WebStorm构建Vue项目】

使用App.vue创建Vue组件,将该组件挂载到index.html的div上。(5)Vue3的setup语法糖:不需要使用exports default进行组件的默认导出。(1)public目录:静态资源文件夹.index.html是vue项目启动的首页。② components目录:存放Vue组件(组件扩展名是.vue)a、是一个函数,可以返回对象,对象的属性和方法可以在模板中直接使用。(3)构建响应式数据方法:reactive。(2)初始化函数:ref。③ App.vue组件:主组件(启动组件)...

2022-08-05 20:39:05 1539

原创 【Vue的事件类型&组件中数据和事件的传递】

组件中数据和事件的传递,给组件添加外部属性:在组件的对象模板中使用props来定义组件的外部属性

2022-08-05 17:48:46 307

原创 Vue组件的计算属性和普通属性区别、属性侦听器的作用

computed 属性是vue的计算属性,是数据层到视图的数据转化映射;计算属性是基于他们的依赖进行缓存的,只有在相关依赖发现改变时,他们才会重新求值,也就是说,只要他的依赖没有发生变化,那么每次访问的时候计算属性都会立即返回之前的计算结果,不在执行函数。只要计算属性依赖的数据项不发生改变,计算属性只会执行一次,方法会调用几次执行几次。Vue内watch侦听器详解:分类解析vue中watch的用法:(1). 普通数据类型:缺点:(2) 对象类型:当需要监听对象的改变时,此时就需要设置deep为tr

2022-08-03 22:08:44 398

原创 【Vue组件的样式绑定&事件监听和处理】

1、为Html标签绑定class属性:v-bind,为class属性绑定一个对象,在对象中可以设置对象是否可用。注意:v-bind可以缩写为: 2、绑定内联样式1、事件监听:是通过v-on指令(用@符号代替)绑定事件处理程序2、多事件的处理:对于同一个用户交互事件,需要调用多个方法进行处理☀️举个例子:3、事件修饰符(1)DOM的事件原理:(2)Vue中使用v-on指令绑定事件时默认监听的是DOM事件的冒泡阶段点击内层,输出为冒泡阶段(内—中—外):(3)...

2022-08-02 19:42:20 793

原创 【Vue的深入学习(重点:限流函数)】

(1)Vue2.0创建Vue组件的方法:☀️举个例子:(2)Vue3.0创建Vue组件的方法:有两种写法:方式一(不太推荐):方式二(推荐,很清晰):(1)存储属性(data):是一个函数。在组件创建时会调用此函数来构建响应性的数据系统。是组件的存储属性。获取该属性值的方式:☀️看个例子:(2)计算属性(computed):通常可以将存储属性的值直接渲染到html的元素上。在有些场景下存储属性的值不适合直接渲染,需要处理之后再进行渲染。在Vue中使用计算属性对数据进行再处理.注意:☀️举个例子:

2022-08-01 22:21:42 423

原创 【Vue的初始--学习小结】

Vue(读音/vjuː/,类似于view)是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue也完全能够为复杂的单页应用提供驱动。总之,是一个JavaScriptMVVM库,是一套构建用户界面的渐进式框架。..................

2022-07-30 23:26:23 461

原创 【三种常见架构开发模式:MVC、MVP、MVVM】

Vue(读音/vjuː/,类似于view)是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue也完全能够为复杂的单页应用提供驱动。............

2022-07-30 17:15:53 2250

原创 【Node实现数据加密】

1)安装crypto模块(2)使用crypto.createHash(‘md5’)32字节/(‘sha256’)64字节创建加密对象(3)使用加密对象的update(明文)进行加密,然后调用digest(‘hex’)返回定长的十六进制字符串。

2022-07-30 15:31:27 367

原创 【Node访问MongoDB数据库】

Mongoose模块是Node访问MongoDB数据库的封装。采用对象模式将数据库中的数据转换成JavaScript中的对象。Model由Schema发布生成的模型,具有抽象属性和行为的数据库操作对。Schema它是一种以文件形式存储的数据库模型骨架(表结构)Entity由Model创建的实体,他的操作也会影响数据库。A、增加使用Model的实例调用save方法(B、删除使用Model操作数据库。C、更新使用Model操作数据库。D、查询使用Model操作数据库。...

2022-07-29 20:49:58 471

原创 【ORM框架:Sequelize的查询】

attributes[[sequelize.fn(‘count’,sequelize.col(‘sid’)),‘记录总数’]],使用sequelize建立模型(类),该模型实现与数据表的orm映射。创建数据库连接的配置对象使用sequelize完成相关配置。例如selectsnamefromstu;持久化将内存中的对象保存到磁盘的数据库中或其他文件中。正如下图证明可得,查询结果正确。............

2022-07-29 19:56:30 1478

原创 【Express连接MySQL数据库】

3)服务器接收到前端的请求数据后,将数据写入数据库,同时给前端发送响应信息。(2)通过jQuery的方法向服务器发起异步请求,将数据提交给服务器。创建一个配置文件用于连接MySQL数据库。(1)在前端页面中使用表单来收集数据。..................

2022-07-28 21:46:15 3367 1

原创 【Ajax异步请求案例&jQuery库对Ajax的封装】

1、Ajax的核心:异步请求对象XMLHttpRequest2、Ajax请求的步骤:(1)创建XMLHttpRequest的对象(2)对异步请求对象进行配置:请求方式、请求的地址(3)向服务器发起请求(4)当请求-响应发生后,会产生一个状态码,客户端可以根据状态码来触发XMLHttpRequest的事件,目的是获取服务器的响应信息(即客户端如何知道服务器的响应)–onreadystatechange☀️案例演示:使用Ajax对象发起登录验证请求。login.html代码:(express框架)lo

2022-07-26 23:16:48 340

原创 【Ajax入门以及跨域和同源的问题】

全称为AsynchronousJavaScriptAndXML,异步JavaScript和XML的一种网页开发技术。是由JavaScript、XML、DOM、CSS等多种已有技术组合而成的一种浏览器端技术。用于实现与服务器进行异步交互的功能。它可以实现页面无刷新更新数据(页面的局部刷新),提高用户浏览网页的体验。相较于传统网页,使用Ajax技术的优势具体有以下几个方面(1)减轻服务器的负担(2)节省带宽(3)用户体验更好。............

2022-07-25 20:15:34 210

原创 【Express接收Get、Post、路由请求参数】

例如请求路径“/find/id”中的“id”是一个参数占位符,当浏览器向“/find/id”地址发送请求时,“id”对应的值就是参数值。在接收参数时,使用req.params8000/params/find/123/西安router.get('/find/id///通过req.query接收Get请求的参数res.send(req.params)console.log('路由参数httpshttpshttpshttpshttpshttpshttps。......

2022-07-25 17:21:17 2915

原创 【Express框架】

Express中间件中间件(Middleware)是指业务流程的中间处理环节.可以把中间件理解为处理客户端请求的一系列方法。Express通过中间件接收客户端发来的请求,并对请求做出响应,也可以将请求交给下一个中间件继续处理。中间件(Middleware)是指业务流程的中间处理环节。可以把中间件理解为处理客户端请求的一系列方法。如果把请求比作水流,那么中间件就是阀门,阀门可以控制水流是否继续向下流动,也可以在当前阀门处对水流进行排污处理,处理完成后再继续向下流动。......................

2022-07-24 10:54:16 834

原创 【Node.js的异步编程】

同步API只有在当前的API执行完成后,才执行下一个API。代码的执行方式是按代码的先后顺序从上到下一行一行的执行。

2022-07-22 22:47:34 783

原创 【HTTP请求和响应的处理】

a、静态资源是指客户端向服务器端请求的资源,服务器端不需要处理,可以直接响应给客户端的资源。b、给请求对象(req)注册’data’事件,用于监听参数的传输,将传输的参数读取出来。a、通过请求对象(req)的url属性获取客户端请求的URL(req.url)③使用path模块对请求路径进行转换(将请求路径转换成静态资源对应的硬盘路径)c、动态资源指的是相同的请求地址可以传递不同的请求参数,得到不同的响应资源。b、使用Node的内置模块url对请求地址进行解析,获取请求参数。②获取用户的请求路径。......

2022-07-21 23:12:47 382

原创 【Node.js服务器端开发--学习小结(3)】

HTTP响应状态码的第一个数字定义了响应的类别,后面两位没有具体的分类,第1位数字有5种可能的取值。在响应消息中,对于客户端的每一次请求,服务器端都要给予响应,在响应的时候我们可以通过状态码告诉客户端此次请求是成功还是失败。(2)HTTP协议基于客户端服务器架构工作,是客户端(用户)和服务器(网站)请求和应答的标准。第一次是客户端发送请求,form表单的请求method方式为post请求方式;第一次是客户端发送请求,form表单的请求method方式为get请求方式;......

2022-07-21 21:12:33 191

原创 【Node.js模块化---学习小结(2)】

1)遵循CommonJS规范,用于服务器端开发,不用考虑非同步方式A、CommonJS是一套代码规范,目的是为了构建JavaScript在浏览器之外的生态系统(服务器端,桌面端)B、CommonJS的主要内容a、模块必须通过module.exports导出对外的变量或接口b、通过require()来导入其他模块的输出到当前模块作用域中(模块一般在文件的顶部导入)。自定义模块demo.js代码(2)exports和module.exports的关系运行结果改造。............

2022-07-21 10:11:46 202

原创 【Node.js初始---学习小结(1)】

简称Node,封装了谷歌的V8引擎,使Javascript可以在服务器端运行。Node.js运行时环境包含执行JavaScript程序所需的一切条件。该引擎会将JavaScript代码转换为更快的机器码。Node.js进一步提升JavaScript的能力,使JavaScript可以访问文件、读取数据库、访问进程,从而胜任后端任务。使用Node.js的最大优点是开发人员可以在客户端和服务器端编写JavaScript,打通了前后端。(4)函数体带有多条语句的箭头函数强调。...............

2022-07-17 11:33:22 172

原创 【MongoDB---学习小结】

NoSQL有时也称作NotOnlySQL的缩写,是对不同于传统的关系型数据库的数据库管理系统的统称。NoSQL用于超大规模数据的存储。(例如谷歌、Facebook每天为他们的用户收集万亿比特的数据)。这些类型的数据存储不需要固定的模式,无需多余操作就可以横向扩展。MongoDB是NoSQL的典型代表,用于web的大容量的数据存储。MongoDB是由C++语言编写的,是一个基于分布式文件存储的开源数据库系统。在高负载的情况下,添加更多的节点,可以保证服务器性能。.........

2022-07-15 22:47:38 258

原创 【数据库--学习小结】

a、count(指定列)统计指定列不为null的行数。--统计emp表中的记录数selectcount(*)as'总记录数'fromemp;--查询emp表中有奖金的人数selectcount(comm)as'奖金人数'fromemp;--列值null和列值0是不同的,0也包含在内--查询emp表中月薪大于2500的人数(查询中带有where子句)selectcount(*)as'大于2500的人数'fromempwheresal>2500;......

2022-07-14 21:08:09 249

原创 【Bootstrap-学习小结】

简介:是一个基于HTML、CSS和Javascript语言编写的框架,具有简单、灵活的特性,拥有样式库、组件和插件。常用来开发响应式布局(1)基本结构:栅格系统(2)丰富的css样式库:只需要改变标签的class属性值,就可以给标签应用不同的样式。(3)布局组件:有丰富的组件库(4)插件:基于jQuery的插件,功能强大。(1)浏览器按照设备类型来划分,主要包括PC端浏览器和移动端浏览器。(2)浏览器内核主要包括Blink、WebKit和Trident等。(3)PC端的浏览器主要包括Google

2022-07-10 18:28:12 900

原创 【JQuery--学习小结】

(1)在页面文件中导入jQuery.js文件(2)在script标签中编写js代码简写(推荐):完整写法:4、jQuery的基本选择器(1)id选择器:#id(1):first:选择第一个元素(2):last:选择最后一个元素(3)not(selector):不是指定的某个元素(4):even:索引为偶数的元素(5):odd:索引为奇数的元素(6):eq(index):索引等于index的元素(7):gt(index):索引大于index的元素(8):lt(index):索引

2022-06-27 16:57:18 203

原创 【ES6的新特性-箭头函数&类的定义&模块化】

(2)箭头函数☀️举例如下:☀️举例如下:☀️举例如下:d、在箭头函数中若要使用隐式返还的功能返回一个对象,则必须用“()”括起来☀️举例如下:ES5类的创建:先定义构造方法,在构造方法中封装类的功能,使用new运算符创建类的对象。ES6类的创建:在ES6中提供了class关键字来定义类,在写法上更简洁,语义化更强。说明:类的成员包括成员变量(属性)和成员方法。A、ES5定义静态成员的方法:a、静态属性:构造方法名.属性名 //该属性是静态的,为所有对象共享b、静态方法

2022-06-27 10:17:19 168

原创 【了解 HTTP 和 HTTPS】

HTTP 传输的数据都是未加密的,也就是明文的,网景公司设置了 SSL 协议来对 HTTP 协议 传输的数据进行加密处理,简单来说 HTTPS 协议是由 HTTP 和 ssl 协议构建的可进行加密传 输和身份认证的网络协议,比 HTTP 协议的安全性更高。区别如下:客户端在使用 HTTPS 方式与 Web 服务器通信时有以下几个步骤,如图所示。 客户使用 HTTPS url 访问服务器,则要求 web 服务器建立 ssl 链接。 web 服务器接收到客户端的请求之后,会将网站的证书(证书中包含了公钥),返回

2022-06-24 18:00:31 80

空空如也

空空如也

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

TA关注的人

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