去宇宙给你摘星-CSDN博客

原创 Ajax、Fetch、Axios的区别

相同点：都是用于发送网络请求不同点：Ajax：全称为Asynchronous javaScript And XML,翻译过来就是“异步的javaScript 和 XML”，Ajax其实是一个技术统称，是一个概念模型，它概括了很多技术，并不是指某一技术，它的特征就是让网页实现局部刷新。简单来说，Ajax是一种思想，XMLHttpRequest只是实现Ajax的一种方式，其中XMLHttpRequest模块就是实现Ajax的一种很好的方式。利用XMLHttpRequest模块实现Ajax functio

2022-04-21 18:10:43 887

原创 Vue之v-if与 v-show指令的异同

1、v-show：根据表达式的真假值来显示和隐藏元素<div id="app"> <p>hi</p> <p v-show="temp">小明</p>  <p v-show="ok">贝贝</p> </div> <script> var vm = new Vue({

2022-03-19 13:59:59 1071

原创 MVC、MVP、MVVM三种区别

mvvmmvcmvvp

2022-03-16 19:50:29 3062

原创 css 常见面试题

一、css盒子模型有哪些1、标准盒子模型：margin、border、padding、content四个模块2、IE盒子模型：margin、content两个模块，其中content包括（border + padding + content）注意：padding值不可以超过width,否则总宽度需要加上border值通过CSS如何转换盒子模型：使用box-sizing属性box-sizing:content-box; //标准盒子模型box-sizing:border-box； //IE

2022-03-15 13:12:46 616

原创 css小问题汇总（持续更新）

小div盒子在大div盒子中如何水平垂直居中关于如何设置小盒子在大盒子里面水平垂直方向同时居中的实现方法有很多种，下面列举了常用的几种。基础代码样式html代码// 大盒子嵌套小盒子小盒子水平垂直居中<div class="parent"> <div class="child"></div></div>css代码.parent{ height:600px; width:600px; background-color:red;

2022-03-10 19:36:22 216

原创 react 实现图片上传功能

图片上传

2022-03-09 20:08:21 4681

原创浅析React Hooks

host 了解

2022-03-04 18:53:50 646

原创 React 中的发布订阅模式

发布订阅模式

2022-03-03 17:27:31 3308

原创 React 中的diff 算法

虚拟DOM 和 Diff 算法问题：我们知道state 更新组件的时候，只要state 变化就重新渲染视图，如果组件中只有一个DOM 元素需要更新时，也需要将整个组件内容重新渲染到页面中吗？回答：不是，虚拟DOM 和 Diff 算法可以达到部分更新虚拟DOM：本质上是个 js 对象，用来描述页面UI （React 元素就是虚拟DOM）执行过程React组件配合 state 创建一个虚拟DOM树根据虚拟DOM树，生成一个真正的 DOM 树，再渲染到页面中当 state 或者 pro

2022-03-02 21:55:07 2159

原创 token 验证和 H5 中的页面存储技术

token

2022-02-27 19:23:44 2609

原创 React 之redux 学习加求和案例

一、redux 是什么Redux 是一个专门用于做状态管理的JS 库(不是react 库)它可以用在react、angular 、vue 等项目中，但基本与react 配合使用作用：集中式管理react 应用中多个组件共享的状态二、什么情况下需要使用redux某个组件的状态需要让其他组件可以随时拿到（共享）一个组件需要改变另一个组件的状态（通信）...

2022-02-27 12:00:47 546

原创 React 之路由的基本使用和执行过程

路由的基本使用和执行过程1、路由介绍2、基本使用3、路由组件4、执行过程5、编程式导航6、默认路由7、匹配模式7.1 模糊匹配7.2 精确匹配1、路由介绍现代前端应用都是 SPA （Single Page Application 单页应用程序）, 就是只有一个html页面的应用程序。为了有效使用单个页面管理原来的多页面功能，前端路由就产生了前端路由的功能：让用户从一个页面导航到另一个页面前端路由是一套 ur l路径与组件的对应关系使用React 路由就是配置路径和组件2、基本使用

2022-02-26 21:47:09 627

原创 React之组件性能优化方式

组件性能优化方式、虚拟DOM和diff算法一、组件更新数据二、组件性能优化1、减轻 state2、避免不必要的渲染2.1 利用state阻止不必要的更新2.2 利用 props 阻止不必要的更新3、纯组件三、虚拟DOM 和 Diff 算法一、组件更新数据三种组件更新的情况：setState() 是异步更新数据结构注意：使用setState() 方法时，后面的setState() 不要依赖于前面的setState()可以多次调用setState() ，但只会触发一次重新渲染this.stat

2022-02-26 17:34:21 984

原创 React 之鼠标移动显示实时位置

核心思路：通过鼠标移动事件，获取实时鼠标位置信息，再将位置信息更新在页面上鼠标位置实现思路：要设置 state，用来保存鼠标的横纵坐标要注册mousemove事件，实时获取鼠标当前的位置，并保存到state中mousemove事件要注册给window （在 componentDidMount 方法中进行注册）将 state 的值设置页面要显示鼠标位置的地方...

2022-02-25 21:39:23 1053

原创 React 之组件的生命周期

组件的生命周期一、生命周期概述二、生命周期的三个阶段1、创建阶段2、更新阶段3、卸载阶段一、生命周期概述生命周期：组件从创建到加载运行再到不用卸载的整个过程就是生命周期（创建 --> 加载运行 --> 卸载）掌握组件生命周期有助于我们理解组件的运行方式，完成更复杂的功能，分析组件错位u原因以及解决错误生命周期的每个阶段中都有一些方法调用，这些方法就是生命周期的钩子函数，钩子函数能够实现更多的功能只有类组件才有生命周期二、生命周期的三个阶段1、创建阶段执行时机：只要页面一经

2022-02-24 19:02:08 1257

原创 React 之组件通讯

一、组件通讯介绍组件是独立封闭的单元通常一个完整的页面是由多个组件组合而成的为了实现组件之间共享一些数据的功能，所以就需要组件之间能够通讯，这个过程就是组件通讯二、组件的props1、props的作用：用于接收外界向组件中传递的数据传递数据：渲染组件时，在组件标签中使用自定义属性向组件内部传递数据接收数据：组件内部可以使用 props 来接收自定义属性传递的数据函数组件通过参数props 接收数据类组件通过 this.props 接收数据2、props的特点：除了字符串之

2022-02-24 17:03:48 625

原创 React 受控组件中不同域数据的获取方式

一、受控组件1、什么是受控组件受控组件通常指的是表单，因为HTML中的表单是可输入的，也就是有自己的可变状态React中可变状态通常保存在state 中，并且只能通过setState()方法来修改React 将 state与表单的 value值绑定到一起，给表单元素绑定change事件，将表单元素的值设置为state的值，接收表单值变化2、核心步骤第一步：在state中设置数据 state = { txt:'' }第二步：表单域中将 state中的数据与value绑定 &

2022-02-23 18:25:20 581

原创 React状态(state)组件、this指向问题

state与this指向一、有状态组件和无状态组件1、概念2、state的基本使用2.1 在构造函数中定义 state2.2 在类中直接定义state2.3 获取状态：this.state3.使用setState()方法修改数据二、this 的指向1、this 的指向2、利用箭头函数解决this指向问题3、利用bind()方法解决this指向问题4、利用class实例方法总结一、有状态组件和无状态组件1、概念函数组件叫做无状态组件；类组件叫做有状态组件状态（state），组件中使用的数据都保存在

2022-02-22 19:43:09 969

原创 React 组件的创建与事件处理

React组件一、React 组件基本介绍二、创建组件2.1 使用函数创建组件2.2 使用类创建组件2.3 抽离组件三、React事件处理3.1 事件绑定3.1.1 通过类组件绑定事件3.1.2 通过函数组件绑定事件3.2 事件对象一、React 组件基本介绍组件是React中最重要的技术，使用React 就是在用组件组件表示页面中的部分功能通常一个完整的页面功能是由多个组件组合而成的特点：可复用、独立、可组合二、创建组件2.1 使用函数创建组件使用JS函数（或箭头函数）创建的组件叫做

2022-02-22 18:16:40 633

原创 React 基本概述和JSX语法

一、React 概述1、概述React 是一个用于构建用户界面的JavaScript 库React 主要用来写HTML页面，或构建web应用。基于JSX的语法，JSX是React的核心组成部分，它使用xml标记的方式去直接声明界面，和html、js混写。React核心是组件，组件的设计提高了代码的复用率，降低了测试的难度和代码复杂度。组件将数据和逻辑进行封装。2、React 的特点声明式（只需要描述UL（html）看起来是什么样，就跟写HTML一样）基于组件（组件是React 最重要的内容

2022-02-22 13:25:50 317

原创 Typescripe对象

1 、面向对象一切的操作都要通过对象，就是所谓的面向对象。简而言之，程序之中的所有操作都需要对象来完成。举例：操作浏览器使用 window 对象操作网页使用 document 对象操作控制台使用 console 对象那么对象是什么？就需要先了解程序是什么？计算机程序的本质就是对现实事物的抽象，比如：照片是对一个具体的人的抽象，汽车模型是对具体汽车的抽象。程序也是对事物的抽象，在程序中可以表示一个人，一颗子弹等等所有的事物，一个事物到了程序中就变成了一个对象。在程序中所有对象被分成了两个部分：

2022-02-20 23:19:05 663

原创 TypeScript 函数

TypeScript 基础一、TypeScript 基础类型二、TypeScript 变量声明三、循环语句1、for 循环2、for...in 循环3、for...of 循环4、forEach 循环5、every 循环一、TypeScript 基础类型任意类型（any）：声明为 any 的变量可以赋予任意类型的值。数字类型（number）：双精度 64 位浮点值。它可以用来表示整数和分数。字符串类型（string）：一个字符系列，使用单引号（’）或双引号（"）来表示字符串类型。反引号（`）来定义

2022-01-26 13:25:30 1150

原创 jQuery 选择器

一、 jQuery概述1.1 javascript库即library,是一个封装好的特定的集合（方法和函数）。从封装一大堆函数的角度解读，就是在这个库中，封装了很多预先定义好的函数在里面，比如动画animate,hide,show,比如获取元素等。简单理解：就是一个js文件，里面对我们原生js代码进行了封装，存放到里面，这样我们就可以快速高效的使用这些封装好的功能了。比如 jQuery，就是为了快速方便的操作DOM，里面基本都是函数（方法）。1.2 jQuery的优点轻量级。核心文件才几十kb,

2022-01-22 15:29:12 478

原创 Nodejs连接mongoDB数据库（实现增删改查）

一、连接mongoDB数据库在我们安装配置完成之后，连接MongoDB数据库先要开启MongoDB的服务。要开启MongoDB数据库服务，我们先进入MongoDB数据库安装目录的bin目录：进入后我们执行以下命令：打开可视化工具连接（这里我使用的是Robomongo）此时数据库便连接成功了，然后就是实现在nodejs中连接数据库了。首先了解一下 MongooseMongoose是在node.js环境中对MongoDB数据库操作的封装，一种对象模型工具，可以将数据库中的数据转换为javasc

2022-01-20 17:44:45 12156 3

原创 Bootstrap 之栅格系统与常用样式

一、Bootstrap简介Bootstrap来自Twitter(推特)，是目前最受欢迎的前端框架，Bootstrap是基于HTML,CSS和JavaScrpit 的，它简洁灵活，使得web开发更加快捷。中文官网：http://www.bootcss.com/官网：http://getbootstrap.com/优点标准化的html+css编码规范提供了一套简洁、直观、强悍的组件有自己的生态圈，不断的更新迭代让开发更简单，提高了开发的效率二、Bootstrap 栅格系统1、栅格系统

2022-01-19 14:33:15 4527

原创 Nodejs 之promise对象详解

在了解promise之前，我们先学习几个概念回调函数：当一个函数作为参数传入另一个参数中，并且它不会立即执行，只有当满足一定条件后该函数才可以执行，这种函数就称为回调函数。我们熟悉的定时器中就存在有回调函数： function fn(){ console.log('你好，anni'); }setTimeout(fn,2000) 在满足2秒之后才会执行 fn 函数中的内容，此时 fn 就是回调函数。在了解了回调函数之后，与之相对应的概念是“同步任务”。同步任务在主线程上排队执行，只

2022-01-16 18:41:30 4443

原创 ES6方法合集

一、解构赋值ES6允许从数组中提取值，按照对应位置，对变量赋值，对象也可以实现赋值。1、数组解构：允许我们按照一一对应的关系从数组中提取值然后将值赋值给变量。数组变量和值分为两种情况（1）数组中变量和值数量一致let ary = [1,2,3];let [a,b,c] = ary; //等号左边中括号就表示从数组中提取值console.log(a) //1console.log(b) //2console.log(c) //3（2）数组中变量和值数量不一致l

2022-01-14 16:49:45 1711

原创 Node+MySQL 实现数据库连接池

mysql一、使用mysql模块操作MYSQL数据库1、下载mysql模块2、配置mysql 模块3、测试mysql模块能否正常工作4、查询数据5、插入数据6、更新数据7、删除数据8、标记删除二、数据库连接池？1、应用程序直接获取数据库连接的缺点2、数据库连接池概念3、连接池的作用是什么？4、Node + MySQL 实现数据库连接池一、使用mysql模块操作MYSQL数据库1、下载mysql模块npm install mysql2、配置mysql 模块在使用mysql数据库之前，必须先对mys

2022-01-14 09:10:30 1187

原创 Nodejs 之学习Ajax 附(实现用户登录案例）

要求：当用户输入错误的用户名时提示用户名错误，输入错误的密码时提示密码错误，当用户输入用户名和密码都正确时提示合法用户。1、编写html文件触动按钮之后前端所发生的工作<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta n

2022-01-13 18:34:02 1028

原创同源策略与跨域

一、同源二、跨域

2022-01-12 18:47:44 2721

原创 Nodejs之学习Express 路由与中间件

一、路由的概念1、路由就是映射关系生活实例：在我们拨打10086客服电话时，对应的每个按键有不同的功能，比如按键1-> 服务查询，按键2-> 手机充值，在这里，路由是按键与服务之间的映射关系。在Express中，路由指的是客户端的请求与服务器处理函数之间的函数关系。Express中路由由3部分组成，分别是请求的类型、请求的URL地址、处理函数，格式如下：app.method(path,handler)express中路由的例子//匹配 get 请求，且请求URL为/app.get

2022-01-12 11:07:36 1114 1

原创 Nodejs之初始Express

Express一、Express简介1、概念2、Express 的本质3、Express 能做什么4、Express框架核心特性：5、安装Express二、创建基本服务器三、Express 的基本使用1、监听get 与 post 请求1）监听get 请求2）监听post 请求3）把内容响应给客户端2、获取URL中携带的查询参数3、获取URL中的动态参数四、托管静态资源1、express.static()2、托管多个静态资源目录3、挂载路径前缀一、Express简介1、概念express是基于 Node

2022-01-10 16:57:02 811

原创 Nodejs之Buffer模块（缓冲流）

一、node.js Buffer（缓冲区）JavaScript 语言自身只有字符串数据类型，没有二进制数据类型。但在处理像TCP流或文件流时，必须使用到二进制数据。因此在 Node.js中，定义了一个Buffer类，该类用来创建一个专门存放二进制数据的缓存区。举一个简单的场景：当我们观看腾讯视频时，红线会超过观看点：也就是下载数据的速度比查看数据的速度快，且浏览器会对数据进行缓冲。Buffer类存在的意义Buffer 类是随 Node 内核一起发布的核心库。Buffer 库可以存储原始数据，让No

2022-01-10 10:10:47 1866

原创 GET与POST请求区别和编写GET、POST接口

一、什么是getGET就是从某个地方获取一些数，获取的过程可以理解为一个简单的查询，没有造成什么影响，专业名词叫做幂等。意思是在编程中一个函数幂操作的特点是其任意多次执行所产生的影响均与一次产生的影响相同。所以这种类型的请求可以被缓存，下次有同样的请求就可以直接从缓存中读取，不用浏览器再次发送请求。get 请求一般是通过url,url里面拼接上参数。正是因为get 与 head 不会产生什么动作，意味着get 和 post 的 HTTP 请求不会在服务器上产生任何结果。但是安全方法并不是什么动作都不会产生

2022-01-07 11:14:30 4902

空空如也

空空如也