- 博客(54)
- 收藏
- 关注
RSS订阅原创 Cookie、sessionStorage和localStorage的区别
Cookie在Html5之前Cookie用于客户端和服务器端的通信，具有本地存储功能，Cookie的存储非常小，只有4k大小，主要用于保存登录信息，Cookie的内容主要包括：名字、值、过期时间、路径和域。localStoragelocalStorage是Html5的一个新特性，主要是用来作为本地存储来使用的，解决了cookie存储控件不足的缺点，localStorage中一般浏览器的支持是5M大小，在不同浏览器中会有所不同。local是“本地”的意思，即本地存储，localStorage会将数据保存
2021-09-15 13:41:19
1842
1
原创 Ajax概述、原生JS实现Ajax及jQuery封装Ajax
什么是Ajax技术?早期浏览器页面向服务器请求数据时，因为返回的是整个页面的数据，所以页面会被强制刷新一下，当我们需要修改页面的部分数据时，但服务器返回的却是整个页面的数据，这对于用户体验无疑很差，并且很消耗网络资源，当我们只需要修改页面部分数据但不希望刷新页面，因此异步网络请求技术就出现了。Ajax全称是async javascript and XML，即异步JavaScript和XML技术，是前后端数据交互的重要工具，并且Ajax是⼀个默认异步执⾏机制的功能,AJAX分为同步（async = fal
2021-09-15 01:25:14
486
原创 Leetcode 盛最多水的容器
盛最多水的容器给你 n 个非负整数 a1，a2，…，an，每个数代表坐标中的一个点 (i, ai) 。在坐标内画 n 条垂直线，垂直线 i 的两个端点分别为 (i, ai) 和 (i, 0) 。找出其中的两条线，使得它们与 x 轴共同构成的容器可以容纳最多的水。说明：你不能倾斜容器思路一 暴力解法通过题目可知要得到盛水最大的结果，就是让图中蓝色区域面积最大，可以通过枚举出所有盛水的面积然后Math.max取出最大面积作为结果，可以使用两重for循环，分别枚举容器左边和右边，找出所有面积取出最大值，
2021-09-05 23:34:25
1364
原创 关于MVVM和MVC架构模式
MVVM架构模式MVVM是一种设计思想，全称是Model-View-ViewModel，由Model、View、ViewModel三部分组成Model：代表数据模型，主要指后端进行的各种业务逻辑和数据处理，对于前端来讲就是后端提供的API接口，可以在Model中定义数据修改和操作的业务逻辑View: 代表视图层，负责数据模型转化成UI展现出来，即用户看到的界面ViewModel:代表视图数据层，是一个同步View和Model的对象在MVVM架构下，View和Model没直接联系，而是通过Vi
2021-09-04 23:00:10
891
6
原创 React页面路由的基本使用
什么是路由？路由就是一种映射关系，前端路由就是根据不同的url去切换不同的组件，简单理解就是可以从一个页面跳转到另一个页面，前端路由就是通过一套url路径 与 组件的对应关系，后端路由就是根据用户不同的请求去返回不同的内容。路由的两种方式hash模式：使用页面定位的方式进行的(锚点) HashRouterhistory模式：可以传递复杂的数据 BrowserRouter路由的基本使用使用步骤：安装 react-router-dom 模块npm install react-rout
2021-09-02 16:29:22
369
原创 关于CSS3弹性盒子的flex布局以及媒体查询
CSS3弹性盒子(Flex Box)弹性盒子是css3中一种新的布局手段，它主要用来代替浮动来完成页面的布局，当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式，换句话来讲就是可以让元素跟随页面大小的改变而改变，引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行排列、对齐和分配空白空间。弹性容器要使用弹性盒子，必须将一个元素设置为弹性容器，我们通过 display：flex 来设置弹性容器，display:inline-flex 设置为行内的弹性容器弹
2021-08-29 00:52:33
1084
原创 React事件处理及事件流
React事件处理React事件处理是通过将事件处理器绑定到组建上处理事件，事件触发的同时更新组建的内部状态，内部状态更新会触发组件的重绘React 元素的事件处理和 DOM 元素的事件处理很相似，但语法上的略有区别在React中事件的命名采用驼峰命名法，即事件名的首字母为大写，而不是原生DOM中的小写响应事件的函数要以对象的形式赋值，而不是以DOM字符串的形式React方式<button onClick={clickMe()}>提交</button>DOM方式&
2021-08-27 21:58:16
625
2
原创 React组件三大属性props state refs以及组件的生命周期
props属性React组件可以通过JavaScript函数方式实现， 那么React组件就可以接受参数的传入。React框架定义了一个Props的概念， 主要用来实现React函数组件接受参数的输入。props属性:从组件外部向组件内部传递变化了的数据，在组件内部不能改变它的值，props除了可以传字符串、数字，还可以传数组，对象、甚至是回调函数，它的主要作用是从父组件向子组件传递数据，它是不可改变的。读取props属性值: this.props.属性名向props中传值: <组件名 属性名
2021-08-26 02:03:29
590
原创 同源和跨域问题及解决方案
同源策略同源策略最早由Netscape公司提出并引入浏览器，同源策略是为了浏览器安全性考虑而实施的安全政策，不同源的客户端脚本在没明确授权的情况下，不能读写对方的资源。简单理解同源即三个相同协议相同域名相同端口号相同如果两个URL以上三点都满足即两个URL同源，当其中一个不满足时，我们的请求即会发生跨域问题看下面的例子http://a.xyz.com/text/other.html 成功 http://a.xyz.com/text2/inner/another.html 成功 htt
2021-08-24 23:07:41
348
原创 React项目创建报错解决方案npm ERR! code 1 npm ERR! path E:\Node1\untitled5\node_modules\fibers npm ERR! command
在用webstorm创建React项目时发现一个巨离谱的错误(node:15528) ExperimentalWarning: The fs.promises API is experimentalInstalling packages. This might take a couple of minutes.Installing react, react-dom, and react-scripts with cra-template...(node:21848) ExperimentalWar
2021-08-24 18:18:04
13249
18
原创 React概述、JSX语法、虚拟DOM及React组件
什么是React？React是一个功能强大的JS库，可以简化可视化界面的开发，由Facebook团队于2013发布上线，React基于JSX语法，使用xml标记的方式去直接声明界面，特点是支持html、js混写。React特点：声明式设计：React 采用声明范式，可以轻松描述应用高效：React通过对DOM的模拟,最大限度地减少与DOM的交互灵活：React可以与已知的库或框架很好地配合JSX语法：JSX是JavaScript语法的扩展，可以极大地提高JS运行效率React虚拟DOM机制
2021-08-24 09:15:45
223
原创 TypeScript归纳整理
什么是TypeScript？TypeScript 是一种由微软开发的自由和开源的编程语言。它是 JavaScript 的一个超集，而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程，可以理解TypeScript是JavaScript的super版本，JavaScript能做的，TypeScript能做，JavaScript做不了的，TypeScript也能做。TypeScript基本操作安装TypeScript npm install -g typescript使用方法：创建.
2021-08-22 01:53:00
307
原创 CSS实现垂直居中的5种方法
第一种 position定位+margin负距离前提是知道居中元素的宽高，首先给居中元素定位，之后设置margin的负距离为具体宽高的一半便可达到垂直居中效果 <style> .box1 { height: 300px; width: 300px; border: 10px solid pink; position: relative; } .
2021-08-20 00:34:24
20107
2
原创 Node.js Express开发框架
Express简介Express是最小的，灵活的Node.js Web应用程序框架，它提供了一套强大的功能来开发Web和移动应用程序。 它有助于基于Node Web应用程序的快速开发。Express框架的核心功能:中间件: 允许设立中间件 响应HTTP请求路由表：响应用户的不同请求根据参数动态的渲染页面Express安装全局安装 npm install -g express-generator上面的命令在本地node_modules目录保存安装，并创建一个目录express在node_
2021-08-18 16:07:02
202
1
原创 Node.js关于ORM框架以及sequelize模块的使用
什么是ORM框架ORM（Object Relational Mapping）即对象关系映射，是一种为了解决面向对象与关系数据库存在的互不匹配的现象的技术，通过描述对象和数据库之间映射的元数据，把程序中的对象自动持久化到关系数据库中。作用：是在关系型数据库和对象之间作一个映射，这样，我们在具体的操作数据库的时候，就不需要再去写复杂的SQL语句，只要像平时操作对象一样操作它就可以了 。持久化（Persistence）：即把数据（如内存中的对象）保存到可永久保存的存储设备中（如磁盘），持久化的主要应用是将内
2021-08-17 01:37:50
515
原创 Leetcode 链表题目整合
leetcode-2 两数相加给你两个 非空 的链表，表示两个非负的整数。它们每位数字都是按照 逆序 的方式存储的，并且每个节点只能存储 一位 数字。请你将两个数相加，并以相同形式返回一个表示和的链表。你可以假设除了数字 0 之外，这两个数都不会以 0 开头。思路对于两数相加的题目首先找出两个低位上的和，之后不断求高位上的和进行叠加，由于一个节点只可以存储一位数字，所以要设置进位，下面是具体代码执行:/* * * Definition for singly-linked list. * f
2021-08-16 18:10:49
168
原创 用JS实现栈、队列、二叉树遍历等操作
栈的基本运算 后进先出，在一端进行插入和删除的数据结构，表尾端称为栈顶（top），表头端称为栈底（bottom），因为栈限定在表尾进行插入或者删除，所以栈又被称为后进先出的线性表// 栈的构造函数function Stack(){ var items = []; // 将元素送入栈，放置于数组的最后一位 this.push = function(element){ items.push(element); } // 弹出栈顶元素 thi
2021-08-15 21:01:17
353
2
原创 Node.js fs文件系统相关操作
Node.js文件系统在Node.js中fs模块提供一组文件操作API用于文件系统进行交互，fs模块支持FS常量，包括文件可访问性、文件复制、文件打开、文件类型和文件模式的常量。fs模块共有五大类fs.Dirent 指示文件类型fs.FSWatcher 监视文件fs.ReadStream 读取流fs.WriteStream 写入流fs.Stats 文件的信息fs基本操作...
2021-08-14 17:51:27
329
原创 Node.js 模块以及npm包的管理和使用
Node.js模块系统Node.js的模块系统是将可重用代码封装在各种模块中，减少了应用程序的代码量，模块系统提高了开发效率和代码的可读性，并且模块打包代码的方式不会改变全局作用域，开发人员可以在被载入的模块文件中选择要对外暴露的方法和变量，并且模块可以发布到npm仓库中与他人共享。Node.js主要用于服务器端编程，无须考虑非同步加载的方式，选择CommonJS规范，按照CommonJS规范要求，模块必须通过module.exports对象导出对外暴露的变量或接口，通过require()方法将其他模块
2021-08-11 22:22:24
887
3
原创 MySQL多表连接查询 内连接 外连接 子查询
多表连接查询表与表之间的连接分为内连接和外连接内连接：仅选出两张表互相匹配的记录外连接：既包括两张表匹配的记录，也包括不匹配的记录，同时外连接又分为左外连接（左连接）和右外连接（右连接）内连接首先准备两张表学生student表分数score表内连接：在每个表中找出符合条件的共有记录查询student表中的学生姓名和分数第一种写法：只使用whereselect a.s_name, b.s_score from student a,score b where a.s_id = b.
2021-08-09 22:06:30
1579
4
原创 MySQL基本指令
MySQL基本指令登录mysqlmysql -u root -p输入密码完成登录修改MySQL的登录密码set password for 用户名@localhost = "新密码";alter user "root"@"localhost" identified by "新密码"操作数据库显示所有数据库show databases; 切换数据库 use 数据库名;显示数据库下的所有表格show tables;注意：使用该指令前需要先切换数据库注意：使用该指令前需
2021-08-09 21:03:45
145
原创 简单理解TCP三次握手四次挥手（看一遍你就懂）
什么是TCP协议？TCP( Transmission control protocol )即传输控制协议，是一种面向连接、可靠的数据传输协议，它是为了在不可靠的互联网上提供可靠的端到端字节流而专门设计的一个传输协议。面向连接：数据传输之前客户端和服务器端必须建立连接可靠的：数据传输是有序的 要对数据进行校验TCP三次握手为了保证客户端和服务器端的可靠连接，TCP建立连接时必须要进行三次会话，也叫TCP三次握手，进行三次握手的目的是为了确认双方的接收能力和发送能力是否正常。举个栗子公安局长王
2021-08-08 13:09:36
155995
14
原创 SQL基础语法操作详解
MySQL基本使用什么是SQL?SQL（Structured Query Language）是“结构化查询语言”，它是对关系型数据库的操作语言，它可以应用到所有关系型数据库中，例如：MySQL、Oracle、SQL Server等。
2021-08-07 01:59:05
254
2
原创 数据库基础知识归纳
什么是数据库？数据库(Database)是一个有组织的、可共享的、统一管理的相关数据的集合，也可以理解为保存有组织数据的容器。数据库管理系统（DBMS）数据库怒管理系统是用于建立和管理数据库的一套软件，介于应用程序和操作系统之间。DBMS功能及组成功能：数据库定义功能，数据存取功能，数据库运行管理功能，数据库的建立和维护功能，数据通信功能。组成：语言编译处理程序，系统运行控制程序、系统建立、维护程序、数据字典。数据库系统的组成数据库系统（DBS）由以下四部分组成1.数据：数据是数据库系统的
2021-08-03 21:51:51
740
原创 MySQL安装配置超详细教程
下载及其安装1.首先进入MySQL官网https://www.mysql.com/下载最新版MySQL，点击download开始下载2.下载完成后开始安装，双击安装文件进行安装，此时会弹出MySQL安装向导界面，选择我接受后点击Next之后显示的是三种可选的安装类型Typical（典型安装）：只安装MySQL服务器、MySQL命令行客户端和命令行使用程序Custom（自定义安装）：自定义安装的软件和安装路径Complete（完全安装）：安装软件包内所有组件作为学习MySQL的同学我们建议
2021-08-03 17:57:11
1503
原创 jQuery事件处理 事件对象 动画效果
jQuery事件绑定事件绑定语法: $(selector).bind('事件类型',function(){ 函数体语句 });或 $(selector).事件类型(functiong(){ 处理代码 });注意:这里的事件类型不加前缀on,并且同一个对象的同一类型事件可以绑定多个程序事件的反绑定反绑定是指取消元素上绑定的事件,即事件监听不到语法:$(selector).u
2021-08-02 01:41:51
163
原创 jQuery概述 选择器及其相关操作
jQuery是什么，它有什么作用？jQuery是JavaScript的一个库，是把JavaScript的相关函数和方法进行封装，兼容css3和各大浏览器，提供了dom、events、animate、ajax等简易的操作，理念是“写的少，做的多”，可以让我们在开发时更加便捷操作，提高开发效率。jQuery的使用方式可以在官网下载最新的jQuery文件 官网：http://jquery.com/引入jQuery库 <script src="./jquery-3.4.1.js"></s
2021-08-01 17:41:42
192
原创 多多数字组合——拼多多面试题（JS方法）
多多数字组合(拼多多面试题)给定一个整数N，求一个最小值，要求： (1)各个数位的数字之和等于N (2)各个数位的数字各不相同由题目要求可知，每个数位上的数字不能相同，数位共1-9，所以输入的N最大值不能大于1+2+3+4+…+9=45，从这里入手，我们可以把给定的整数N拆分，每次都用最大的数，可以从9开始一直到1，最后在反转数组作为结果返回，下面是代码实现： var num = function (N) { var str = ''; //
2021-08-01 15:41:10
267
原创 JavaScript BOM及其相关对象
BOMBOM(Brower Object Model) 即浏览器对象模型，它是js访问浏览器窗口的一个接口，提供了独立于内容而与浏览器窗口进行交互的对象，核心对象是window,所有 JavaScript 的全局对象、函数以及变量都会自动成为 window 对象的成员，全局变量是window对象的属性，全局变量是window对象的属性，在调用全局变量和函数时可以省略window。BOM的构成window对象的常见事件window.onload:是窗口（页面）加载事件，当文档内容（包括图像,CSS
2021-07-27 22:49:57
210
原创 JavaScript DOM事件进阶及相关练习
事件事件：事件是指可以被JavaScript侦测到的行为，是一种“触发-响应”的机制。这些行为指的就是页面的加载、鼠标单击页面、键盘输入等具体的动作，是实现页面交互的方式。事件的三要素事件源：触发事件的元素 (谁触发了事件)事件类型：如click单击事件 (触发了什么事件)事件处理程序: 事件被触发后所执行的代码(函数形式)，也称为事件处理函数<body> <button type="button" id="btn">单击事件</button>
2021-07-26 22:42:44
726
8
原创 JavaScript DOM节点概述及相关操作(获取节点 创建节点 插入节点 深拷贝 浅拷贝）
节点一个HTML文档可以看作是一个节点树，网页中的所有内容都是节点，每一个节点都是一个对象，DOM节点有三个重要的属性：nodeName 节点的名称nodeType 节点的类型 1表示元素节点(标签) 2表示属性节点(标签的属性) 3表示文本节点(标签的内容)nodeValue 节点的值<body id="p1"> <h3>3号标题</h3> <b>加粗文本</b>
2021-07-25 19:07:46
327
原创 关于JavaScript中this指向问题
关于JS中this指针解析器在调用函数时每次都会向函数内部传递进隐含参数，这个隐含的参数就是this，this指向得到是一个对象，这个对象称为函数执行的上下文对象。根据函数的调用方式的不同this会指向不同的对象1.以函数的形式调用时 this指向全局对象window2.以方法(obj.sayName())的形式调用时 this就是调用方法的那个对象3.构造函数内部的this指向新创建的对象 function fun(){ console.log(this.
2021-07-19 01:04:04
237
4
原创 用JS实现单向链表
链表链表是数据的一种存储结构，一个链表包含若干个节点，每个节点至少包含一个数据域和指针域，指针域指向下一个节点。第0个节点称为头节点，头节点中存放第一个节点的首地址，头节点中没有数据域不存放数据，只是一个指针变量，头节点之后的节点都包含两个域数据域 存放各种数据指针域 存放下一个节点的首地址链表的分类单向链表每个节点都只有一个指向其下一个节点的指针域双向链表每个节点都有一个指向其前一个节点的指针域和指向其下一个节点的指针域 // 定义节点类 cl
2021-06-26 17:59:43
279
3
原创 JavaScrit构造函数、原型对象作用意义
构造函数构造函数就是一个普通函数，创建方式和普通函数没有区别，构造函数和普通函数区别就是调用方式不同，普通函数直接调用，而构造和函数需要使用new关键字来调用。构造函数执行的流程：1.立刻创建一个新的对象2.将新建的对象作为函数中的this 在构造函数中可以使用this来引用新建的对象3.逐行执行函数中的代码4.将新建对象作为返回值返回如下例子 function Person(name,age,gender){ this.name = name; //
2021-06-21 13:46:23
243
4
原创 JavaScript面向对象、ES6类的语法、静态成员与实例成员
面向对象面向对象的主要思想就是把需要解决的问题分解成一个个对象，建立对象不是为了实现一个步骤，而是为了描述每个对象在解决问题中的行为，面向对象的核心是对象。面向对象的优势：模块化更深，封装性强更容易实现复杂的业务逻辑更易维护、易复用、易扩展面向对象的特征：封装性: 对象是属性和行为的结合体多态性: 同一消息被不同的对象接收后 会产生不同的效果继承性: 子类可以继承父类的信息ES6面向对象语法ES6：ES是ECMAScript的简写，它是JavaScript的语法规范。ES6是在
2021-06-19 23:04:18
733
5
原创 JavaScript正则表达式详解
正则表达式概述正则表达式（Regular Expression）由一些普通字符和特殊字符组成，是描述字符串规则的表达式，用于匹配字符串组合的规则，同时正则表达式本身也是一个对象。正则表达式特点：非常灵活逻辑性强可以用简单的方式对字符串进行复杂的控制如何创建正则表达式字面量创建 - var 变量名 = /表达式/[模式修饰符]使用new RegExp创建 var reg = new RegExp('正则表达式','匹配模式')test()方法使用这个方法可以检测一个字符
2021-06-18 00:30:03
773
3
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人