自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 在Windows环境下安装nvm的踩坑记录

前言:以下是本人安装nvm(Windows环境)的一些踩坑记录,希望能帮助你少走弯路。安装路径出现空格或中文可能会导致命令行命令乱码使用nvm install + 版本号安装node之后,输入node --version显示node不是内部或外部命令,也不是可运行的程序或批处理文件。这种情况大概率是你安装完之后忘记输入命令使用对应的node了,记得输入nvm use + 版本号进行使用,输入nvm --list,显示 星号+版本号(例如 * 14.18.0)说明使用成功。出现nvm use [ver

2021-12-22 17:54:32 575

原创 深入理解 JS 闭包的 9 大使用场景

文章目录深入理解 JS 闭包的 9 大使用场景1 返回值(最常用)2 函数赋值3 函数参数4.IIFE(自执行函数)5 循环赋值6 getter和setter7.迭代器(执行一次函数往下取一个值)8 首次区分(相同的参数,函数不会重复执行)9 缓存参考文章深入理解 JS 闭包的 9 大使用场景1 返回值(最常用) //以闭包的形式将 name 返回。function fn(){ let name = "hello" return function(){

2021-09-20 10:28:55 663

原创 【奇怪的输出题】对象引用的问题

题目如下:var a = {n: 1};var b = a;a.x = a = {n: 2};console.log(a.x) console.log(b.x)答案是:undefined{n:2}解析:首先:a和b同时引用了{n:2}对象然后执行a.x = a = {n: 2}语句,尽管赋值是从右到左的但.的优先级比=高,所以这里会先执行a.x,相当于为a所指向的对象{n:1}新增了一个属性x然后执行a={n:2},相当于改变了a的指向,a不再指向对象{n:1},而

2021-08-20 21:16:25 252

原创 【记面试遇到的坑】 对象使用数组的push方法后会发生什么?

奇怪的面试题最近碰到一道奇奇怪怪的面试题,对象使用数组的push方法后会发生什么?题目如下:var obj = { '2':3, '3':4, 'length':2, 'splice':Array.prototype.splice, 'push':Array.prototype.push}obj.push(1) obj.push(2) obj.push(3) console.log(obj);求最后打印出的的obj是什么?答案是:{ '2

2021-08-19 19:12:46 573

原创 JS常用的循环遍历和它们的特性

目录JS常用的循环遍历for、forEach、for ...of for…insome everyfilter、mapfind、findIndexreduce、reduceRight参考文章JS常用的循环遍历for、forEach、for …of for…infor通常用于数组的循环 可以随时跳出循环,用break或者continueconst list = [1, 2, 3, 4, 5, 6, 7, 8, , 10, 11];let len = list.length;for

2021-08-19 12:07:26 459

原创 ES6中展开运算符(...)的几种使用场景

ES6中展开运算符(…)的几种使用场景解构赋值数组的解构赋值:const [arg, arg1, ...arg2] = ['a', 'b', 'c', 'd']console.log(arg);console.log(arg1);console.log(arg2);//a//b//[ 'c', 'd' ]数组中按顺序匹配,将’a’赋值给arg,'b’赋值给arg1,剩下的元素以数组形式赋值给展开运算符作用的变量。对象的解构赋值:明确指出的赋值名字要相对。比如const中的a和b

2021-08-06 10:15:37 536

原创 JavaScript继承的方式

目录JavaScript继承的方式1 原型链继承2 借用构造函数实现继承3 组合继承(最常用)4 原型式继承5 寄生式继承6 寄生组合式继承JavaScript继承的方式一共六种方式原型链继承、借用构造函数继承、组合继承、原型式继承、寄生式继承、寄生组合式继承。这部分可以看红宝书第四版P238-2491 原型链继承 function Animal(){ this.colors = ["black","while"]; } Animal.prototype.ge

2021-08-01 20:13:12 221

原创 setTimeout()的参数问题

setTimeout()的参数问题执行时间setTimeout()方法接收两个参数,第一个参数可以是包含JavaScript代码的字符串,或者是一个函数。第二个参数表示等待多长时间的毫秒数将当前任务添加到队列中。setTimeout(“go()”, 1000); //等待1000毫秒执行go函数setTimeout(go, 1000); //等待1000毫秒执行go函数setTimeout(go(), 1000); //立即执行go函数,这种情况会忽略后面的等待时间带引号

2021-07-29 20:49:22 1830

原创 【leetCode 146】LRU 缓存机制(哈希表+双向链表)

目录思路不使用内置的LinkedHashMap ,使用哈希表+双向链表代码说明使用内置的LinkedHashMap思路具体的思路在LeetCode官方解答中有,里面还有动画和视频,推荐看不懂下面思路的可以去看一下。LRU 缓存机制可以通过哈希表辅以双向链表实现,我们用一个哈希表和一个双向链表维护所有在缓存中的键值对。双向链表按照被使用的顺序存储了这些键值对,靠近头部的键值对是最近使用的,而靠近尾部的键值对是最久未使用的。哈希表即为普通的哈希映射(HashMap),通过缓存数据的键映射到

2021-07-27 22:58:38 748 1

原创 最长回文子序列的两种解法(动态规划和反转字符串)

1 题目链接LeetCode2 动态规划这个主要是用dp二维数组来解,应该是用的最多的方法了,这里就不再写了,有兴趣可以去看题解。题解3 反转字符串法这里是利用回文数的特征:正着读和反着读都是一样的,就可以把原有的字符串str1反转变成一个新的str2,然后求出这两个子序列的最长公共子序列数即可,这里就把问题转换为了最长公共子序列问题。例如:最长公共子序列的题目为:最长公共子序列关于这道题LeetCode里面有详细的解答,这里就不写解答和代码了。反转字符串法代码Java:clas

2021-07-24 22:00:37 316

原创 JavaScript变量提升的坑

var ,未定义,letvarconsole.log(a)var a = 10结果:原因:上面代码在编译阶段变成了下面代码,可以看到var a = 10在编译阶段变成了两句话,一句为声明变量:var a,一句为给变量赋值: a=10。而声明变量提升到了当前作用域(全局作用域)的最前面,赋值变量的语句留在原地。由于变量a在输出前只声明而未定义,所以会输出undefined,而不是报错,也不是输出10。var aconsole.log(a)a = 10未定义console.l

2021-07-23 15:39:48 270 1

原创 【双指针问题】已知链表中含有环,返回这个环的起始位置

双指针双指针一般可以分为两类,一类是快慢指针,一类是左右指针。快慢指针通常是用来解决链表中的问题,比如典型的是判断链表中是否含有环,左右指针主要是用来解决数组/字符串的问题,比如二分搜索等这道题主要是用快慢指针解决快慢指针初始化:两个指针都指向链表头节点head前进:快指针fast在前,慢指针在后判断链表是否有环链表的特点就是每个节点都只知道下一个节点,所以一个指针是无法判断是否有环的,如果链表中不含环,那么这个指针最终会遇到空指针null,这样就知道链表到头了但如果链表中有环,那就会

2021-07-22 10:56:34 309

原创 浏览器渲染原理以及海量数据渲染的方法

目录浏览器的渲染原理为什么操作DOM会慢插入几万个 DOM,如何实现页面不卡顿?浏览器的渲染原理浏览器工作流程:构建DOM -> 构建CSSOM -> 构建渲染树 -> 布局 -> 绘制。首先解析接收到的文档,根据文档定义构建一棵DOM树,DOM树是DOM元素及属性节点组成的然后对CSS进行解析,生成CSSOM规则树根据DOM树和CSSOM规则树构建渲染树,渲染树的节点被称为渲染对象,渲染对象是一个包含有颜色和大小等属性的矩形,渲染对象和DOM元素先对应,但这种对应关系不

2021-07-20 11:31:00 969 2

原创 纯CSS实现轮播图(附代码详细注释)

HTML 部分<!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"> <titl

2021-07-17 21:57:57 3583

原创 [学习笔记]TypeScript学习笔记

文章目录1 前期准备工作1.1 TypeScript的简介1.2 TypeScript与JavaScript的关系1.3 TypeScript的优点1.4 TypeScript开发环境搭建2 基本类型2.1 类型声明2.2 基本类型种类3 编译选项3.1 自动编译文件3.2 自动编译整个项目4 用webpack配置TS5 Babel6 面向对象6.1 前言6.2 类(class)6.3 面向对象的特点6.4 接口6.5 泛型(Generic)项目实战代码地址参考1 前期准备工作1.1 TypeScrip

2021-07-01 21:22:46 924 1

原创 用TypeScript写一个简单的贪吃蛇小游戏

文章目录前言1 项目界面搭建2 完成Food类3 计分盘(ScorePanel)类4 Snake类的编写5 游戏控制器类(GameControl)项目效果项目地址前言这个项目是参考尚硅谷TypeScript教程写的,自己做了一些改进,目的是为了练习TypeScript的写法,学会用TS的思维去写代码。1 项目界面搭建html结构<body> <!--创建游戏的主容器 --> <div id="main"> <!--

2021-07-01 21:21:00 601 1

原创 【学习笔记】Axios学习笔记

文章目录1 axios的理解和使用1.1 axios是什么?1.2 axios的特点1.3 axios常用语法2 axios源码分析2.1 源码目录结构2.2 源码分析2.2.1 axios与Axios的关系2.2.2 instance 与 axios 的区别?2.2.3 响应拦截器的执行顺序问题2.2.4 axios 运行的整体流程?2.2.5 axios 的请求/响应拦截器是什么?2.2.6. axios 的请求/响应数据转换器是什么?2.2.7 response 的整体结构2.2.8 error 的整

2021-07-01 18:51:15 639

原创 【学习笔记】Ajax学习笔记

文章目录1 原生AJAX1.1AJAX简介1.2 XML简介1.3 AJAX的特点1.3.1 AJAX的优点1.3.2 AJAX的缺点1.4 AJAX的原理1.5 AJAX的使用1.5.1 核心对象1.5.2 使用步骤1.5.3 解决 IE 缓存问题1.5.4 AJAX请求状态2 jQuery 中的 AJAX2.1 get 请求2.2 post请求3 跨域3.1 同源策略3.2 如何解决跨域问题3.2.1 JSONP3.2.2 [CORS](https://developer.mozilla.org/zh-

2021-07-01 18:43:31 518

原创 【学习笔记】Promise的学习笔记

文章目录1 Promise的理解1.1 promise是什么1.1.1理解:1.1.2 异步编程的例子1.2 为什么要使用Promise1.2.1 指定回调函数的方式更加灵活1.2.2 支持链式调用,可以解决回调地狱问题1.3 Promise 的状态1.4 Promise 对象的值1.5 promise的基本流程2 Promise的使用2.1 API2.2 Promise的几个关键问题3 自定义(手写)Promise4 async 与 await4.1 MDN文档4.2 async函数4.3 await表达

2021-07-01 18:37:52 509

原创 【学习笔记】React拓展学习笔记

文章目录1. setState2 lazyLoad3 Hooks3.1 React Hook / Hook是什么?3.2 三个常用的Hook3.3 State Hook3.4 Effect Hook3.5 Ref Hook4 Fragment5 Context6 组件优化7 render props8 错误边界9 组件通信方式总结9.1 组件间的关系9.2 几种通信方式:9.3 比较好的搭配方式1. setStatesetState更新状态的2中写法setState(stateChange, [c

2021-07-01 18:32:04 290

原创 【学习笔记】Redux学习笔记

文章目录1 Redux理解1.1 学习文档1.2 Redux是什么1.3 什么情况下需要使用Redux1.4 Redux工作流程2 Redux的三个核心概念2.1 Action2.2 Reducer2.3 Store3 Redux的核心API3.1 createstore()3.2 store 对象3.3 applyMiddleware()3.4 combineReducer()4 redux异步编程4.1 理解4.2 说明5 react-redux5.1 理解5.2 原理图5.2 react-Redux两

2021-07-01 18:27:08 673

原创 【学习笔记】React+React全家桶学习笔记

文章目录1 为什么要使用React2 React的定义3 React的三大特性4 React入门4.1 hello_react4.2 虚拟DOM的创建4.3 JSX4.4 模块与组件,模块化与组件化的理解5 React面向组件编程5.1 基本理解和使用5.2 组件实例的三大核心属性5.2.1 state5.2.2 props5.2.3 ref5.3 React中的事件处理5.4 React中收集表单数据5.4.1 非受控组件与非受控组件5.5 组件的 生命周期5.5.1 效果5.5.2. 挂载与卸载5.5.

2021-06-29 16:49:02 1580

原创 解决idea创建项目没有src或不能新建包问题

右键在根目录下新建一个目录src*这时候右键单击src文件夹若没有新建包的选项,则证明这个src文件不是源根目录,右键该目录,标记目录为源根再次单击src目录就能创建包了

2021-05-30 16:34:34 11663 3

原创 JS实现可调侧栏

实现效果页面分为左右两边,左边放置了一张图片,右边有一段文字。当鼠标移到两边中间的这个分割线位置时,鼠标变成提示可以左右移动的图标,此时可以左右拉动,调整大小。当重新载入页面时,也会保留最后所设定的大小构思用Flexbox建构版面,当鼠标点击中间分割线的时候,记录下鼠标点击时的坐标位置当鼠标移动的时候,通过鼠标新的坐标位置与点击时的坐标位置计算出左边侧栏的新宽度当鼠标放开后,就取消鼠标移动的时间监听,并且将新宽度通过localStorage存储到浏览器中。当下次载入页面时,将左边栏的宽度设

2021-03-19 16:49:55 352

原创 HTML+CSS打勾动画制作

参考网址https://www.bilibili.com/video/BV1ME411F7BG实现效果当某些工作成功执行后,例如支付成功,注册成功,储存成功等,使用户更直观了解操作成功与否。效果如下制作方法使用SVG于HTML内绘制圆形和打勾符号,然后再通过animation控制CSS的stroke-dasharray(控制用来描边的点划线的图案范式)和stroke-dashoffset(指定了dash模式到路径开始的距离)来达到预定的效果参考代码如下<!DOCTYPE h

2021-03-10 11:34:35 2436

原创 HTML+CSS动态显示表单栏位标题

实现效果建构一个模拟的“登入表单”,有一个用户名称和密码两个输入框,输入框里有一个浅灰色的标题,当聚焦到输入框时,该标题就会移动到输入框之外并显示为深色,当失去焦点时,标题回到输入框并恢复浅灰色。而当输入框里有文字时,失去焦点时标题文字就会自动隐藏。当密码输入框内输入密码以后,右边就会出现一个登入的按钮实现方法建构表单的HTML代码与CSS代码处理输入框标题在聚焦与失焦的位置在栏位输入文字后将标题隐藏,以及显示登入按钮代码<!DOCTYPE html><ht

2021-03-06 18:11:49 480

原创 CSS聚光灯效果制作

原理将两个文字完全重合【一前一后】,同时设置两种不同的颜色【一个底色和一个要展示的颜色,】,然后再将前面的文字套用圆形遮罩,最后加上CSS Animation即可可以加入背景图片,然后将文字作为遮罩代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=ed

2021-03-03 17:39:26 292 1

原创 使用HTML+CSS制作动态Hamburger Menu

Hamburger Menu即我们日常在手机上浏览网页时,左上角或右上角有两到三条线的图标,如下图所示

2021-02-24 11:39:34 1279

原创 HTML+CSS制作翻牌效果

预计效果但鼠标移动到相应的卡牌的时候,卡牌会自动翻转过去;当鼠标移走时,卡牌会自动盖上结构分析正面和背面分别用两个div显示,长度和宽度设置相同,使之完全重叠,这样就可以将position属性设置为absolute,即可以将两个div重叠在一起。运用CSS的transform属性,用rotate将其旋转过来【 旋转方向以空间直角坐标系为参考,即垂直旋转沿Y轴方向,transform的设定值为rotateY()】backface-visibility的设定(用控制HTML 元素的“背

2021-02-23 11:47:06 1579 1

原创 软件工程——软件维护

软件维护软件维护的概念软件维护的分类1 改正性维护2 适应性维护3 完善性维护4 预防性维护软件维护的代价维护的过程可维护性软件维护的概念软件维护是指软件再已经交付给用户使用之后,为了改正错误或满足新的需求而进行修改软件的过程软件维护的分类1 改正性维护2 适应性维护3 完善性维护约占50%,不一定是救火式的紧急维修,而是有计划,有预谋的一种再开发活动4 预防性维护软件维护的代价费用代价(有形的)其它代价(无形的)不能及时满足用户合理的修改要求,引起用户不满

2021-01-14 16:24:33 650

原创 软件工程——软件测试

软件测试测试的方法白盒测试逻辑覆盖测试1 语句覆盖2 判定覆盖3 条件覆盖4 判定/条件覆盖5 条件组合覆盖路径测试法1 点覆盖2 边覆盖3 路径覆盖黑盒测试1 等价分类法划分等价类的方法2 边界值分析法3 错误推测法例题测试的方法黑盒测试为主,白盒测试补充白盒测试逻辑覆盖测试1 语句覆盖2 判定覆盖每个判定的每个分支路径至少要执行一次3 条件覆盖每个条件的真假两种情况至少执行一次条件覆盖和判定覆盖的区别条件覆盖不一定符合判定覆盖4 判定/条件覆盖

2021-01-14 16:12:48 711 1

原创 软件工程——面向对象设计

面向对象设计面向对象的方法UML类和类图接口对象和对象图实体类边界类控制类用例和用例图用例图的组成Use Case(用例)的特征角色建立用例图的步骤用例图中的关联Include关系![在这里插入图片描述](https://img-blog.csdnimg.cn/2021011322251079.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXz

2021-01-14 10:46:55 903

原创 软件工程——详细设计

详细设计程序流程图N-S图程序流程图N-S图N-S也叫做盒图。五种基本控制结构由五种图形构件表示

2021-01-13 21:26:40 262

原创 软件工程——概要设计

概要设计任务模块和模块化耦合和内聚耦合非直接耦合数据耦合特征耦合控制耦合外部耦合公共耦合内容耦合(最高的耦合)例题内聚偶然内聚逻辑内聚时间内聚过程内聚任务模块和模块化耦合和内聚耦合耦合:模块间联系的程度(依赖于模块间接口的复杂性)非直接耦合两模块间没有直接关系数据耦合两模块之间交换的是简单数据(数据输出、输出参数)用水量,水费,电费,用电量就是数据输入输出的简单参数,这里构成的是数据耦合特征耦合模块之间交换的是数据结构与数据耦合不同的是,这里预先定义了这样的数据

2021-01-13 17:14:47 2822 1

原创 软件工程复习笔记——需求分析

需求分析需求分析的任务需求分析类型需求特性数据流图(DFD)定义例题画数据流图的原则加工逻辑描述技术分层数据流图案例结构化语言判定表判定树IPO图(输入/处理/输出图)例题需求分析的任务需求分析类型需求特性数据流图(DFD)定义例题画数据流图的步骤从系统流程图出发,明确系统范围和流程,包括系统处理的范围和信息处理的流程识别并从问题中提取数据流图中的元素根据信息处理流程依次连接各个图上的元素画数据流图的原则加工逻辑描述技术分层数

2021-01-12 21:32:12 792

原创 软件工程复习笔记——项目计划

项目计划问题定义可行性研究经济可行性技术可行性运行可行性法律可行性系统流程图计划时期是软件生命周期的第一个时期,它包括问题定义和可行性研究两个阶段。首先进入问题定义阶段,确定系统的目标与范围。然后,开始对问题进行可行性研究,弄清所定义的项目是不是可以实现和值得开发,存在哪些风险。如果,通过可行性研究认为开发这个项目是可行的,则开始制订项目的实施计划,开始整个项目的开发。如果,认为该项目的开发存在很大的风险,在技术上存在很多问题,不能或不值得开发,则应该终止整个项目。问题定义可行性研

2021-01-12 17:41:41 349

原创 软件工程复习笔记——软件工程概述

软件工程概述软件的特点软件开发的基本准则软件的生命周期软件开发模型1 边做边改模型2 瀑布模型3 原型模型4 增量模型5 螺旋模型软件的特点软件是一种逻辑实体,具有抽象性;软件不是传统意义上被制造;软件开发至今尚未完全摆脱手工艺的开发方式;软件不会“磨损”,软件会退化软件维护困难;软件本身是复杂的实际问题的复杂性程序逻辑结构的复杂性相当多的软件工作涉及到社会因素软件开发的基本准则软件的生命周期软件开发模型1 边做边改模型在这个模型中,开发人员拿到项目

2021-01-12 16:34:49 371

原创 Java学习笔记——类

这里写目录标题类静态变量和静态方法类的继承类静态变量和静态方法静态变量一般用类名直接访问,非静态变量必须用对象访问,对象也可以访问静态变量,但一般不推荐。静态方法类似类的继承Java中的继承是在子类定义时通过extends关键字来实现的,子类定义的基本格式为class 子类名 extends 父类名新定义的子类不仅可以从父类那里继承成员变量和成员方法,还可以定义自己新的变量和方法。Java语言仅提供单继承结构,不支持多继承结构,即Java程序中的每一个类只允许有一个直接的父类,

2021-01-06 10:40:13 173

原创 计算机算法设计与分析笔记(三)——动态规划

动态规划1.动态规划的基本要素2.动态规划的基本思想3 动态规划算法设计步骤1.动态规划的基本要素1)最优子结构性质最优化原理:一个最优化策略的子策略总是最优的。一个问题满足最优化原理又称其具有最优子结构性质。2)子问题重叠性质每一个子问题只解一次,而后将其解保存在一个表格中,当再次需要解此子问题时,只是简单地用常数时间查看一下结果2.动态规划的基本思想与分治法类似,其基本思想也是将待求解问题分解成若干个子问题,先求解子问题,然后从这些子问题的解得到原问题的解。与分治法不同的

2021-01-03 18:06:37 268

原创 编译原理简要笔记

编译原理及实现(清华出版社出版)引论第二章 形式语言与自动机理论基础2.1预备知识2.2文法和语言的形式定义2.3分析树(语法树)和二义性引论编译程序与解释程序的区别编译程序:<font color=While size=2face=“微软雅黑”>生成一个与源程序等价的目标程序,它可以完全取代源程序,目标程序可运行任意多次,不必依赖编译程序。解释程序对源程序的每次执行都伴随着重新翻译的工作,效率较低。第二章 形式语言与自动机理论基础2.1预备知识字母表符号

2021-01-03 18:05:17 1021

空空如也

空空如也

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

TA关注的人

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