自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(129)
  • 资源 (4)
  • 收藏
  • 关注

原创 使用ES5,ES6实现哈希表(散列表)

1.哈希表1.哈希表通常是基于数组实现的,但是相对于数组,他存在更多的优势2.哈希表可以提供快速的插入-删除-查找操作3.插入和删除的时间复杂度为O(n);4.哈希表的速度比树还要快5.哈希表结构是数组,原理在于下标值的一种变换6.将大数字转化为数组范围内下标的过程,称为哈希化7.哈希函数:将单词转化成大数字,把大数字进行哈希化,转化成数组下标8.哈希表,对最终插入的数组进行整个结构的封装,得到的就是哈希表2.哈希表的缺点1.哈希表中的数据是没有顺序的,所以不能以某种方式来遍历其中的

2021-11-16 11:29:25 1370

原创 使用JS实现双向链表

1.双向链表双向链表和普通链表的区别在于,在链表中,一个节点只有链向下一个节点的链接,而在双向链表中,链接是双向的,一个链向下一个元素,另一个链向前一个元素2.双向链表的优缺点每次在插入或删除某个节点时,都需要处理四个引用,而不是两个,实现起来会困难些相对于单向链表,所占内存空间更大一些;但是,相对于双向链表的便利性而言,这些缺点微不足道。3.双向链表的常见操作:append(element):向链表尾部添加一个新的项;inset(position,element):向链表的特定位置插入

2021-11-09 16:57:01 1324

原创 使用ES5,ES6实现链表数据结构

1.链表介绍1.存储多个元素最常用的数据结构是数组,数组有一个缺点,(大多数语言中)数组的大小是固定的,从数组的起点或中间插入或移除项成本很高,需要移动元素(我们所学的JavaScript有来自Array类的方法可以帮我们做这些事,但背后的情况同样如此)2.链表存储有序的元素集合,不同于数组,链表中的元素在内存中并不是连续放置的,每个元素由一个存储元素本身的节点和一个指向下一个元素的引用(也称指针或链接)组成3.链表类似于火车头,一节车厢载着乘客(数据),通过节点连接另一节车厢head属

2021-11-08 16:15:50 1237

原创 使用javascript实现双端队列

1.双端队列双端队列是一种允许我们同时从前端和后端添加和移除元素的特殊队列2.双端队列的应用一个刚买了票的入如果只是还需要再问一些简单的信息,就可以直接回到队伍头部,另外队伍末尾的人如果赶时间也可以直接离开队伍3.双端队列的方法addFront(element):该方法在双端队列前端添加新的元素addBack(element):该方法在双端队列后端添加新的元素(实现方法和 Queue 类中的enqueue 方法相同)。removeFront():该方法会从双端队列前端移除第一个元素remov

2021-11-02 16:08:05 756

原创 用javascript封装队列数据结构,优先队列实现,击鼓传花

1.队列数据结构 1.队列是一种受限的线性表,特点先进先出(FIFO) 2.受限之处在于它只允许在表的前端进行删除操作, 在表的后端进行插入。 3.队列的实现:基于数组实现,基于链表实现队列的常见操作:enqueue(element):向队列尾部添加一个(或多个)新的项dequeue () : 移除队列的第一项(即排在队列嘴前面的)项,并返回被移除的元素front () : 返回队列中第一个元素——最先被添加,也将是最先被移除的元素,队列不做任何变动(不移除元素,只返回

2021-10-26 11:09:49 336

原创 用js实现栈结构

封装栈:// Method:和某个对象实例有联系的,称为方法 // function: // 栈封装类 function Stack(){ // 栈中的属性 this.items = []; // 栈的相关操作 // 1.将元素压入栈 // this.push = function (){ // } //使每个实例都有一个方法

2021-10-09 17:14:56 278

原创 在Promise中存在setTimeout,执行顺序

console.log(1); new Promise((resolve,reject)=>{ console.log(2); setTimeout(()=>{ console.log(3) new Promise((resolve)=>{ console.log(4); re...

2021-10-09 10:26:03 658

原创 将数组中对象key值相同的value值合并

1.push()方法在数组的末尾添加一个或多个元素,返回新数组的长度2.pop()方法是删除数组末尾的最后一个元素,返回删除的元素3..在堆栈中,push为入栈操作,pop为出栈操作。4.shift()方法用于把数组中的第一个元素删除,返回删除的元素5.unshift()方法用于向数组的开头添加一个或多个元素,但会新数组的长度6.push ,pop , shift ,unshift都会改变原数组。7.concat用于连接两个数组或多个数组,返回连接数组的副本。该方法不会改变原数组。8.inde

2021-09-24 14:27:56 1897

原创 对象式的setState和函数式的setState

1.对象式的setStatesetState(stateChange, [callback]) 1.stateChange为状态改变对象(该对象可以体现出状态的更改) 2.callback是可选的回调函数, 它在状态更新完毕、界面也更新后(render调用后)才被调用import React,{Component} from 'react';export default class Demo extends Component{ state = {count:0}; add =

2021-09-23 17:22:45 439

原创 React扩展hooks

1.React Hooks1.hook是React 16.8.0版本增加的新特性/新语法2.可以让你在函数组件中使用state以及其他的React特性3.三个常用的Hook State Hook:React.useState() Effect Hook: React.useEffect() Ref Hook : React.useRef()2.State Hook1.State Hook让函数组件也可以有state状态,并进行状态数据的读写操作2.语法:const [xx

2021-09-23 16:42:00 203

原创 Context的使用(生产者消费者模式)以及组件通信方式总结

1.Context 1.一种组件间的通信方式,常用与【祖组件】与【后代组件】间的通信 2.开发中用的少,封装少见是用的多2.Context的使用步骤 1.创建Context容器对象: const XxxContext = React.createContext() 2.渲染子组件时,外面包裹Provider,通过value属性给后代组件传递数据: <XxxContext.Provider value={数据}> <XxxContext.Provider&gt

2021-09-22 14:48:07 477

原创 Array.from()的使用方法(数组去重,伪数组转为数组,数组浅克隆),Set和Map数据结构

1.Array.from()介绍???? Array.from()方法从类似数组或可迭代对象创建一个新的(浅拷贝)的数组实例Array.from(arrayLike,mapFn,thisArg)arrayLike:必选,想要转换成数组的伪数组对象或可迭代对象mapFn:可选,如果指定了该参数,新数组中的每个元素会执行该函数thisArg:可选,执行回调函数mapFn时this对象可迭代的对象包括ES6新增的数据结构Set和MapArray.from可以通过以下方式来创建数组对象 1. 伪

2021-08-30 15:40:16 31097 5

原创 Redux(状态管理JS库)的使用

1.redux是什么 ☀️???? redux是一个专门用于状态管理的JS库1.作用范围:它可以用在react,angular,Vue等项目中,但基本与react配合使用,(Vue一般使用Vuex)2.作用:集中式管理react应用中多个组件的共享状态2.什么时候用redux ????1.某个组件的状态,需要让其他组件可以随时拿到(共享)2.一个组件需要改变另一个组件的状态 (通信)3.总体原则:能不用就不用,如果不用比较吃力才考虑使用4.一般使用消息订阅与发布机制3.redux的基

2021-08-25 11:37:45 1006 1

原创 React路由的理解与使用

1.什么是路由?1.一个路由就是一个映射关系(key:value)2.key为路径value可能是function或者component2.路由的分类前端路由: 1.浏览器路由,value是component,用于展现页面内容 2.注册前端路由:<Route path="/test" component={Test} /> 3.工作过程:当浏览器的path变为/test时,当前路由组件就变为Test后端路由: 1.理解:value是function,用来处理客户端提交的

2021-08-05 11:23:23 260

原创 html,css相关面试题

1. DOCTYPE 有什么作用?怎么写? 1.它不是html标签,没有结束标签,是一种标记语言的文档类型声明,即告诉浏览器当前 的html使用什么版本编写的,DOCTYPE的声明必须是HTML文档的第一行,位于html 标签之前, 2.DOCTYPE可声明三种DTD类型:严格,过渡以及框架集的HTML文档 3.标准模式(CSS1Compat):浏览器使用W3C标准解析渲染页面,在标准模式中,浏览器以其支持的最高标准呈现页面 怪异模式(BackCompat):浏览器使用自己的怪异模式渲染页面,在

2021-08-03 17:05:30 215

原创 消息订阅与发布机制(兄弟或不同组件间的通信)

组件间传递数据1.在React中父子组件可以通过props加回调函数的形式进行通信2.兄弟组件间可以将数据传递给共同的父组件,再通过父组件传给子组件,这样比较繁琐3.于是有了消息订阅与发布机制使用步骤1.引入库npm i pubsub-js2.页面中引入import PubSub from 'pubsub-js'3.在使用数据的地方发布PubSub.publish("频道","频道发布的消息")例如 : PubSub.publish('ygy',{ isFi

2021-08-03 16:58:40 252

原创 使用AntD实现按需引入,更改项目主题色,出现TypeError: this.getOptions is not a function

1.安装依赖yarn add react-app-rewired customize-cra babel-plugin-import less less-loaderreact-app-rewired:重写脚手架配置customize-cra:修改webpack配置babel-plugin-import:将 import 的写法自动转换为按需引入的方式less:使用lessless-loader:将less文件转化为csscreate-creact-app项目,如果需要手动修改配置,需

2021-08-03 15:41:34 454 3

原创 使用jsonp和CORS解决跨域问题

1.创建本地服务端// 1.引入expressconst { response } = require('express');const express = require('express');// 2.创建应用对象const app=express();// 3.创建路由规则// request是对请求报文的封装// response是对响应报文的封装app.get('/home',(request,response)=>{ // 响应一个页面 respons

2021-07-19 10:46:26 286

原创 用jQuery,axios,fetch发送Ajax请求

1.用jQuery发送Ajax请求<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">

2021-07-19 10:08:51 234

原创 ajax请求的实现,响应json数据,ie浏览器缓存请求超时和网络异常,取消重复请求

1.AJAX请求实现步骤<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &lt

2021-07-19 09:58:51 320

原创 安装React脚手架出现问题(不是内部或外部命令)

‘create-react-app’ 不是内部或外部命令,也不是可运行的程序或批处理文件在cmd中使用 npm config get prefix //查看node模块的路径然后将查看到的绝对路径写入path环境变量中,重启cmd就好了最后一项就是node模块的绝对路径...

2021-06-20 18:58:47 438

原创 React组件生命周期新旧对比

React旧版生命周期1.组件从创建到死亡它会经历一些特定的阶段2.React组件中包含一系列的钩子函数(生命周期回调函数),会在特定时刻调用3.我们在定义组件时,会在特定的生命周期回调函数中,做特定的工作4.render(),被调用1+n次,1是页面初次渲染,n是页面更新的次数初始化阶段:由ReactDOM.render()触发——初次渲染constructor()componentWillMount()render()componentDidMount()更新阶段:由组件

2021-06-18 21:43:54 135

原创 React中的事件处理,受控组件,高阶函数和函数柯里化

1.事件处理1.React官网说我们要尽量不要过度使用ref2.自身的事件,自身改变可以使用事件处理3.通过onXxx属性执行事件处理函数(注意大小写) a.React使用的是自定义(合成)事件,而不是使用的原生DOM事件 b.React中的事件是通过事件委托方式处理的(委托给组件最外层的元素)——为了高效 4.通过event.target的到发生事件的DOM元素对象——不要过度使用ref<!DOCTYPE html><html lang="en"><h

2021-06-18 16:53:07 176

原创 React中组建实例的三大属性(state,props,refs)

1.state描述: 1.state是组件对象最重要的属性,值是对象,(可以包含多个,key-value的组合) 2.组件被称为“状态机”,通过更新组件的state来更新对应的页面显示(重新渲染组件)

2021-06-17 00:13:37 176 2

原创 nginx下部署node.js服务器

1.先在linux中下载node cd /usr/local

2021-06-10 17:41:26 2688 5

原创 React第一次的笔记整理

1.简介:1.用于动态构建用户界面的JavaScript库(只关注与视图)2.由FaceBook开源3.采用组件化模式,声明式编码,提高开发效率及组件复用率4.在React Native中可以使用React语法进行移动端开发5.使用虚拟DOM+优秀的diffing算法,尽量减少与真实DOM的交互1.1.原生DOM的缺点1.原生JavaScript操作DOM频繁,效率低(DOM-api操作UI)2.使用JavaScript直接操作DOM,浏览器会进行大量的重绘重排3.原生JavaScrip

2021-06-05 23:07:46 198 3

原创 Nginx的使用和作用(反向代理,负载均衡,静态网站部署,动静分离,虚拟主机)上篇

1.Nginx的简介:1.nginx是一款轻量级的web服务器和反向代理服务器,也可以作为邮件代理服务器2.占用内存少,并发处理能力强,cpu,内存等资源消耗非常低,运行非常稳定(Nginx官方测试为5万并发请求)3.与Nginx的并发处理能力在同类型的web服务器有Apache(阿帕奇,世界使用排名第一的web服务器软件),Lighttpd(德国的),Tengine(阿里巴巴的)4.Nginx的并发处理能力在同类型的Web服务器中表现极好,在全世界范围内大量网站使用了nginx,国内的互联网中也大

2021-05-24 22:49:58 474 2

原创 微信小程序自定义组件传参

组件传参1.父组件通过属性的方式给子组件传参2.子组件通过事件的方式向父组件传参父组件给子组件传参:1.父组件中,在组件标签名中,将属性名和要传递的数据进行绑定,用于传递数据2..在自定义组件(子组件)中有properties属性,里面存放要从父组件接收的数据,用于接收数据3..格式为:属性名:{ type: 数据类型 //要接收的数据的类型 value: 默认值 //value默认值,没传时的默认值}4.此时就完成了父组件向子组件的传参,子组件引

2021-05-19 21:32:01 3841 2

原创 前端html,css面试题总结

1.HTML5 ①.语义化标签类 ②.音视频处理 ③.canvas/webGL ④.historyAPI ⑤.requestAnimationFrame ⑥.地理位置 ⑦.web scoket2.CSS3 1.常规语法 2.动画 3.盒子模型 4.响应式布局3.面试题什么是标签语义化?:合理的标签,干合适的事都有哪些标签,都是啥意思?:块级标签,行内标签,行内块标签,块级标签 :div p h1-h6 ul ol li

2021-05-08 19:33:30 104

原创 微信小程序搜索框

效果:.wxml文件:<view class="search_input" > <navigator url="/pages/search/search" open-type="navigate" class="navigator"> <text class="iconfont icon-guanbi"></text> 搜索 </navigator></view> text中

2021-04-30 21:13:41 282 3

原创 git(分布式版本控制系统)的用法

1.git,github,gitee,gitlab,的区别: git是一种分布式版本控制系统,是一种工具,有点类似于cmd(命令行工具) github是一个基于git实现的在线代码托管仓库,向互联网开放,企业版要收费 gitlab类似于github,一般用于在企业内搭建git私服,要自己搭建环境 gitee是码云,是OSChina免费给企业用的,不用自己搭建环境,可以建立自己的私有仓库2.安装git是的注意事项...

2021-04-20 00:29:59 223

原创 运用swiper来实现点击切换登录

效果:实现步骤: ①给两个view选择项分别设置两个current属性,用来区分页面,一个值为0,一个为1 ②给两个view选项都设置一个样式的属性判断,双向数据绑定currentTab,currentTab初始为0, 第一个view中当currentTab为0时为选中状态,否则不选中,第二个view为1时为选中状态,否则不选中 ③给两个选项都设置一个点击事件,如果currentTab等于current说明选中第一个,退出程序 如果currentTab不等于current,说明选择第二个vie

2021-04-04 18:22:44 708

原创 ·操作系统的综述

1.操作系统的目标OS(操作系统简称OS)的目标:方便性,有效性(提高系统资源的利用率,提高系统的吞吐量),可扩充性,开放性方便性和有效性是设计OS时最重要的两个目标可扩充性的好坏与OS结构有着十分紧密的联系操作系统的结构:无结构–>模块化结构–>层次化结构–>微内核结构,操作系统的定义:管理硬件,提供用户交互的软件系统2.操作系统的发展过程人工操作方式(无操作系统):人工操作,用户独占,cpu等待人工操作,资源利用率很低批处理系统:批量输入任务,无需等待人工

2021-03-18 21:23:46 345

原创 在用Vue做项目时导入图片出现[object module],已解决

使用4.3.0以上版本的file-loader,需设置esModule: false { test: /\.(png|jpg|gif|jpeg)$/, use: [{ loader: 'url-loader', // loader: 'file-loader', 也可以 options: { esM

2020-12-22 00:00:27 702 2

原创 Bootstrap轮播插件,代码步骤

轮播插件:Bootstrap轮播插件是一种灵活的响应式的向站点添加滑块的方式轮播的内容可以是,图像,内嵌框架,视频或者其他想要放置的任何类型的内容使用该插件必须引入bootstrap.js或者压缩版的bootstrap.min.js轮播图实现主要有三部分构成:①.轮播的图片②.轮播图片的计时器③.轮播图片的控制器1.设计轮播容器:使用.carousel类设计轮播图片的容器,并为该容器添加id,方便后面的使用 <div id="slidershow" class="

2020-12-15 23:23:34 1043

原创 Bootstrap制作胶囊标签页

胶囊标签页:1.使用一个完整的标签页可以分为页头选择卡和内容两部分2.页头使用ul标签在ul标签中能够添加.nav和.nav-tabs类,将会应用Bootstrap标签页样式,添加.nav和.nav-pills类会应用胶囊标签样式3.需要几个标签项就添加几个li4.在li标签中添加a标签,a标签的href的值直接跟标签页下面的内容div的id关联,十分重要5.在a标签中添加data-toggle="tab"或data-toggle="pill"<!DOCTYPE html>&l

2020-12-15 22:32:38 1138

原创 Bootstrap按钮,按钮样式,大小设置

按钮样式:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible"content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&

2020-12-15 21:49:20 9565

原创 Bootstrap创建表单,垂直表单,内联表单,水平表单

按照布局的不同,分为三类表单:垂直表单(默认),内联表单和水平表单垂直表单:垂直表单又称基本表单,制作步骤如下1.向父form标签添加role="form"2.把标签和控件放在一个类名为form-group的div中,获得最佳间距3.向所有的文本标签input,textarea,select添加.form-control类<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"

2020-12-15 21:31:07 1123

原创 Bootstrap常用样式,导航栏,响应式导航栏

1.基础导航栏:1.添加一个容器nav或div标签,使用.navbar类和.navbar-default类,并且添加role="navigation",增加可访问性2.向div标签添加一个标题使用.navbar-header类,内部包含带有.navbar-brand类的a标签,用于定义品牌图标3.为了向导航栏添加链接,只需要简单地添加带有.nav类,.navbar-nav类的无序列表就行<!DOCTYPE html><html lang="en"><head&gt

2020-12-15 20:37:54 2438

原创 Bootstrap简介,以及常用布局,栅格系统

Bootstrap简介:Bootstrap之所以受到广大前端开发人员的欢迎,是因为可以构建出非常优雅的前端页面,而且占用资源小 优点: 1.移动设备优先 2.浏览器支持:主流浏览器都支持Bootstrap,包括IE 3.响应式设计:Bootstrap的响应式CSS能够自适应于台式机,平板计算机和手机的屏幕大小 4.良好的代码规范:为开发人员创建接口提供一个简介统一的解决方案,减少了测试的工作量 5.组件:Bootstrap包含了功能强大的内置组件 6.定制:Bootstrap还提供了基于we

2020-12-15 18:57:29 1494 4

react依赖包.zip

分为新版和旧版

2021-06-05

微信小程序菜谱.zip

微信小程序菜谱首页.zip

2021-04-30

Bootstarp包和jQuery包,html5shiv和respond包

HTML5 Shiv和Respond.js用于让低于IE9版本的浏览器支持HTML5元素和媒体查询,

2020-12-15

我的家乡网站.rar

用html + css + javascript制作而成,主要有首页面,商城和购买页面,前端代码,缓动动画,自动轮播图,等效果,作者自己创作,希望读者给予指导,继续改正

2020-09-24

空空如也

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

TA关注的人

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