自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

秋水惊鸿的博客

天行健,君子当自强不息

  • 博客(49)
  • 问答 (3)
  • 收藏
  • 关注

原创 JS之对象-对象增强语法(ES6)

ES6对JS的对象提供一些封装的语法糖,用来简化某些操作。1.属性值简写给对象添加变量时,同名属性可以简写:let name = "zhangsan"let Obj = { name, test:'lalala'}console.log(name) //zhangsan2.可计算属性可计算属性,可以实现动态属性赋值,动态属性允许是JavaScript表达式,即也可以是有返回值的function。let Person = { [name]:'王五'}console.log(

2022-03-29 19:59:58 1810

原创 JS对象-原型、原型链和继承

一、原型原型的作用是什么?在理解原型的作用之前,我们需要先知道一个例子function Person(name) { this.name = name this.sayName = function () { console.log(this.name) }}const p1 = new Person('张三')const p2 = new Person('李四')console.log(p1.sayName === p2.sayName) //false这里我们声明

2022-03-29 19:56:12 548

原创 JS之对象-对象声明及静态方法

声明对象1.原型实例化// 声明对象的方式1:原型实例化let obj1 = new Object()obj1.name = 'obj1---张三'obj1.getName = function(){ return this.name}console.log(obj1.getName())2.直接赋值// 声明对象的方式2:直接赋值let obj2 = { name:'obj2---李四', getName(){ return this.name }}co

2022-03-29 19:48:36 3331

原创 CSS布局(1)-Flex布局

一、Flex布局是什么?Flex是Flexible Box的缩写,意味“弹性布局”,通过将元素设定为容器,容器内部所包含的子元素称之为Flex项目,也就是容器成员。任何一个容器都可以指定为Flex布局。容器默认存在flex-wrap两根轴,水平的主轴和垂直的交叉轴,项目默认按照主轴排列,即默认按水平排列。.box { display:flex;}<!--行内元素也可以使用flex布局-->.line{ display:inline-flex;}注意:Flex

2022-03-24 18:40:10 490

原创 数据结构——队列

数据结构——队列数据结构特点队列是遵循先进先出(FIFO,也称为先来先服务)。队列在尾部添加新元素,并从顶部移除元素。最新添加的元素必须排在队列的末尾。常见场景排队买票计算机中的打印队列。JS中的任务队列队列方法enqueue(element(s)):向队列尾部添加一个(或多个)新的项dequeue():移除队列的第一项(即排在队列最前面的项)并返回被移除的元素peek():返回队列中第一个元素——最先被添加,也将是最先被移除的元素。队列不做任何变动(不移除元素,只返回元素信息——

2022-03-20 09:07:17 5174

原创 React-Hooks

什么是Hooks?Hooks是一类特殊的函数,适用于React的函数组件,可以让我们在不编写class的情况下使用state及其他的React特性,比如副作用处理及生命周期等。为什么要Hooks?Hooks主要可以解决以下几类问题:在无需修改组件结构的情况下复用状态逻辑。原来的类组件如果需要封装一段可重用的逻辑,需要使用到高阶组件,不仅增加代码复杂度,同时会增加额外的组件节点。但是采用hooks的话,会更加的简单方便。复杂逻辑分离,针对一些副作用进行了集中的管理,让相关的业务逻辑更加聚合。使得

2022-02-25 21:02:28 944

原创 Yarn-包管理工具

介绍代码通过 包(package) (或者称为 模块(module)) 的方式来共享,一个项目可能存在依赖于多个包,而yarn就是factbook推出的一款开源的包管理工具。优点快速:安装的时候会将安装的包创建一个本地缓存,以便下次其他项目安装相同包时直接从缓存读取可靠:通过yarn.lock来维护包的版本,从而保证一个项目在不同的环境重新安装包依赖的时候,保证版本的一致。安全:通过算法校验包的完整性。安装官网安装文档:https://yarn.bootcss.com/docs/

2021-08-07 15:56:30 449

原创 Mac快捷键&常用命令

Mac常用快捷键表情选择页 ctrl+cmd+space截图 ctrl+cmd+shift+4/shift+cmd+4锁屏 ctrl+cmdf+q全屏/退出全屏 cmd+ctrl+f系统调用快捷键系统偏好设置 cmd+shift+x截图 Command+Shift+Control+4 截取所选屏幕区域到剪贴板,或按空格键仅捕捉一个窗睡眠状态 电源键1.5s/option+cmd+电源键强制关机 长按电源键锁屏 ctrl+cmd+q查找文件及所在目录 cmd+空格,cmd+回车文本编

2021-07-06 14:15:17 619

原创 Webpack使用(二)——常见配置总结

本文主要总结Webpack的一些常见配置,比如ES6、react、css、图片解析和字体等ES6解析解析ES6需要使用babel-loader来做解析,babel-loader依赖babel,所以也需要单独安装babel和配置babel。安装命令如下:npm i @babel/core @babel/preset-env babel-loader -D //-D 是--save-dev的缩写创建.babelrc配置文件,并配置如下:{ "presets": [ "@babel/pr

2021-05-31 09:22:23 159

原创 Http协议及各版本对比

前言本文主要简单介绍http协议发展的历史版本以及https的安全机制,对于更多深入协议内层及网络通信相关的知识,在此暂不做总结。何谓Http协议超文本传输协议(Hypertext Transfer Protocol,HTTP)是一个简单的请求-响应协议,俗称HTTP协议。网络传输的层级在网络传输中,Http协议在网络传输中位于应用层,在一次http请求中,从我们输入请求地址之后,数据传输要经历不同层次的包装,添加对应的响应头,中间涉及各种协议,具体如下:层级协议/技术应用层

2021-05-16 15:35:30 4561

原创 Vue-数据驱动视图(一)数据监听机制

前言Vue的一大特点就是数据双向绑定,当数据发生变化时,也可以同时触发界面的变化,即数据驱动视图。要想实现数据驱动视图,那么有这么几个步骤:1.收集我们需要监听的数据,并给他配置个监听器,当数据状态发生变化时触发监听器,然后判断是否需要重新渲染;2.数据变更时重新构建虚拟DOM;3.虚拟DOM渲染成为真实的DOM;在这里本文主要分析其中的第一步——数据监听机制,也就是Data变化到watcher监听到的这一过程。正文一、Object的数据响应机制Vu...

2021-05-08 09:28:57 1250 3

原创 浏览器渲染过程

前言在浏览器输入一个网址之后,经过和后端的连接获取到相关的资源数据后,浏览器需要对获取的网页数据进行解析、渲染、绘制,最终展示出来的就是我们所看到的界面内容。在进行前端开发时,了解浏览器的渲染过程有利于我们在实际过程中进行渲染调优、性能调优的处理,因此是非常有必要的。浏览器介绍一、浏览器结构浏览器的组成结构大致如上,下面是具体的介绍:1.用户界面用户界面即浏览器的外壳,是我们平时所看到的浏览器界面,包括了搜索栏、书签、前进后退按钮等。当我们在用户界面进行操作时,它将我们的操作转入到浏览器引擎进

2021-04-19 22:11:44 5168

原创 cookie、localStorage、sessionStorage、应用程序缓存之间的区别和使用

Web存储HTML5新增了两种存储方式:localStorage、sessionStorage,而在此之前,主要使用的是cookies存储。下面来讲述下这三者的区别和运用场景:cookies存储介绍cookies实际上是一个小型的文本数据(不超过4KB)每个浏览器都会有一个专门的文件夹存放cookies数据,cookies的内容主要有key/value值以及用于控制cookie有效期、安全性、使用范围的几个可选属性组成。我们可以在浏览器中看到cookie。一条cookie记录大致组成及作用如下

2021-03-20 11:38:57 231

原创 HTML语义化

编写代码都讲究结构清晰,逻辑明确,便于他人阅读和团队开发,前后端都是如此,但是在过往发展的一段时间里,html很多时候都是各种div嵌套堆砌,css叠加等,这种代码当然难以阅读维护,所以相关组织也在后续推出了一系列语义化的元素标签,方便更好地搭建HMTL的语义结构,这就是HTML语义化的由来。

2021-03-18 09:38:41 131

原创 HTML5表单使用总结

HTML5表单介绍

2021-03-17 09:08:04 356

原创 HTML、XHTML、HTML5的发展和区别

参考链接:HTML 30 年进化史

2021-03-13 10:32:20 348 1

原创 深入解析Http请求背后的秘密(下)

前言这边是承接上文深入解析Http请求背后的秘密(上)而写的,主要讲解在一次HTTP请求过程中,我们客户端已经创建好和服务器的连接通道之后,正式发送数据的过程。主要分两步:请求的发送和应答、断开连接。由于篇幅有限,我尽可能抓我们平时都会接触到的内容来做解析,一些不太需要了解的,就简单说明一下了,如果对你有用,记得一键三连哟~一、请求的发送和应答当我们创建好Http的连接时,接下来就是开始真正的发送我们的请求数据了,应用程序将数据发送到协议栈后,协议栈会暂时将数据放到发送缓冲区,等待应用程序的下一段数

2021-03-04 14:18:54 267

原创 深入解析Http请求背后的秘密(上)

前言我们用了那么久的浏览器,但是我们知道在输入一个网址到界面响应这背后的到底发生了什么吗?为什么我们输入www.baidu.com,它就知道我们找的是百度的地址呢?我们都知道我们按下回车之后触发的是http请求,但是http请求到底是什么,为什么它就能够请求到我们的数据呢?作为一名程序猿,探索和了解下我们的所处的网络世界,我觉得还是很有必要的。由于篇幅有限,不可能把所有细节都理清楚,因此尽可能抓我们平时都会接触到的内容来做解析,一些不太需要了解的,就简单说明一下了。同时针对每个人获取信息的目的不同,我将

2021-02-26 11:19:58 381 2

原创 JS之字符串方法

所有的字符串方法都会返回新的字符串,而不是改变原串。查找字符串indexOf(src,index)从头开始遍历target字符串,查出匹配src的首次出现的索引(位置),未找到返回-1lastIndexOf(src,index)从末尾开始遍历target字符串,查找匹配src的首次出现的索引(位置),未找到返回-1search(src)和indexOf相同,只不过没有第二个开始位置参数。字符串提取slice(start, end)提取从start开始到end的字符串内容,如果end大于字

2021-02-25 21:17:16 108

原创 JS之数组方法

常规方法toString() 把数组转换为数组值(逗号分隔)的字符串。在需要原始值的时候,JS会自动把数组转换为字符串。join(param) 和toString相似,区别在于以param作为分隔符增删改pop() 删除最后一个元素,返回被删除的值push() 在最后增加一个元素,返回新数组的长度shift() 删除首个数组元素,并将后面的元素前移,返回被删除的元素unshift() 在数组的开头添加新元素,整个数组后移,返回新数组长度arr[index] = newValue 数组inde

2021-02-25 21:12:29 193

原创 Webpack使用—基础介绍

为什么要使用webpack当前的浏览器要加载一个网页,除了JS之外,还会涉及到很多的依赖包,其中有些是没办法浏览器直接解析的(scss、typescript等),webpack就是支持通过分析项目结构,将所有的依赖模块打包,转化为合适的格式供浏览器使用。webpack是什么webpack是一个用于现代 JavaScript 应用程序的静态模块打包工具。什么是静态模块呢?其实是指静态资源所组成的模块,而静态资源包含我们前端常见到的字体、css、icon、图片等,这些都能够被webpack通过依赖关系进行

2021-01-27 15:07:22 171

原创 Vue-cli使用——快速搭建一个Vue的可运行环境

Vue-cli安装简介Vue的脚手架,安装完成后,可以通过命令来快速的生成一个可运行的Vue开发环境,省略繁琐的依赖和插件配置,方便快速搭建。官网地址为:https://cli.vuejs.org/zh/guide/安装步骤如果没有安装Node.js则需要先安装Node.js(https://nodejs.org/zh-cn/选择当前发布版本即可),如果已经安装了Node.js,则通过在cmd中执行node -v查看当前安装版本。我们要求安装Node.jsV8.9以上的,不必卸载重装,直接装两

2021-01-19 17:19:42 179

原创 Vue的生命周期和钩子函数(一)——数据初始化

前言了解Vue的生命周期和渲染原理,有助于我们深层次的理解钩子函数的作用和调用场景,同时理解当数据发生变化之后,Vue内部做了哪些事情来响应。如果有误,请及时评论,方便完善。码字不易,请尊重版权。本片文章是基于Vue2.X写的,Vue3.0可能对渲及响应做了优化,在此暂不做讨论。Vue的创建过程...

2021-01-19 10:27:01 4557 2

原创 Webpack详细打包流程

直接从oneNote贴过来的,没用markdown…如果解决了你的问题,欢迎点个赞~

2019-04-20 09:34:53 12022

原创 Java学习之异常

简介《Java语言导读》中对于异常的定义时这样的:异常是在程序执行期间中断指令的正常流程的事件。这些异常可能是用户错误引起的,有的是程序错误引起的,还有一些是因为物理错误引起的。当一个方法在执行过程中发生错误时,该方法会创建一个包含错误信息的对象,并把它交给运行时系统。该对象就被称为异常对象。异常对象包含的错误信息包括错误的类型和错误发生时程序的状态。创建异常对象并把它交给运行时系统的过程称为...

2018-09-20 17:22:53 190

原创 Java学习之类之间的关系

Java的类和类之间存在多种关系,总的可以分为继承(泛化)、关联、依赖。其中关联关系又可以细分为组合和聚合关系。泛化也就是继承关系,即存在 is - a 关系,在Java中常用extends关键字来实现。举例:class animal{ }//实现类的继承public class cat extends animal{ }Java中继承能够实现代码重用,但是它不...

2018-09-20 13:35:42 177

原创 Java学习之序列化

序列化Java提供了一种对象序列化的机制,该机制中,一个对象可以被表示为一个字节序列,该字节序列包括该对象的数据、有关对象的类型的信息和存储在对象中的数据的类型。序列化存储数据的优点序列化的文件更容易让程序回复到原来的状态,同时序列化的文件比较安全,因为它不是原本的内容,而是经过了编码处理的。Java中序列化的实现Java中实现序列化和反序列化的类分别是ObjectOutputStrea...

2018-09-19 11:14:43 137

原创 Java学习之IO操作

序列化Java提供了一种对象序列化的机制,该机制中,一个对象可以被表示为一个字节序列,该字节序列包括该对象的数据、有关对象的类型的信息和存储在对象中的数据的类型。序列化存储数据的优点序列化的文件更容易让程序回复到原来的状态,同时序列化的文件比较安全,因为它不是原本的内容,而是经过了编码处理的。Java中序列化的实现Java中实现序列化和反序列化的类分别是ObjectOutputStrea...

2018-09-18 16:54:23 159

原创 Java学习之网络编程(1)

本篇博文会持续更新…客户端和服务器端的数据传输网络应用使用客户端和服务器端模式的方式进行通信。客户端和服务器端的数据传输分成三个步骤:连接、传送、接收。服务器端先启动服务进行等待,客户端应用主动启动通信,申请连接,而服务器应用被动地等待通信,连接成功之后,客户端可以对服务器端进行数据发送或者是申请数据,服务器端针对客户端的请求做出对应的响应。针对于客户端和服务器端的连接和数据传送接...

2018-09-18 15:06:22 171

原创 Java学习之构造函数

构造函数相信简单的就不用多说了,再次说一些构造函数其他方面的用法。构造函数能实现的功能构造函数的一个关键特征是它会在对象能够被赋值给引用之前就执行。也就是说,我们可以通过构造函数来介入new的过程。通过这个特点,我们可以通过构造函数实现以下功能: 1. 记录产生了多少个对象实例 2. 记录特定的状态 3. 给实例变量赋值 4. 留下创建对象的证据 5. 将对象添加到ArayL...

2018-09-14 10:25:51 122

转载 Java学习之垃圾回收

本文转自:http://blog.csdn.net/zhangerqing一、垃圾回收有句话说的好:Java和C++之间有一堵有内存分配和垃圾回收技术围成的墙,墙外的人想进去,墙里的人想出去!这句话的意思,请读者自己去琢磨。总的来说,C、C++程序员有时苦于内存泄露,内存管理是件令人头痛的事儿,但是Java程序员呢,又羡慕C++程序员,自己可以控制一切,这样就不会在内存管理方面显得束手无策...

2018-09-13 14:24:20 159

原创 Java的内存结构

Java中的内存结构在说明他们在内存中如何存储之前,先要对内存中的存储区域进行讲解。存储数据的地方有:1、寄存器(程序计数器Program Counter Register)在CPU内部,是最快的存储区。在字节码解释器工作时,就是通过改变程序计数器的值来选取下一条要执行的指令,分支、循环、跳转、等基础功能都是依赖此技术区完成的。在java多线程方面,多线程就是通过线程轮流切换而...

2018-09-13 13:51:59 2113

原创 Java学习之继承

面向对象的语言一共有四大特性:封装、继承、多态、抽象,Java作为面向对象的语言之一,同时也满足了这几个特性。继承能够带来的最大好处,就是对代码的复用。但是继承也存在着许多的缺点。下面先讲述一下Java继承的优缺点:好处有效减少代码的冗余,代码简洁能够提升开发效率缺点打破了封装,迫使开发者了解超类的实现细节,子类和超类耦合度高。超类更新后可能会导致子类发生错误...

2018-09-13 09:16:51 184

原创 Java学习之抽象类和接口

抽象类用abstract修饰一个类时,这个类就为抽象类;用abstract修饰的方法称为抽象方法。这里有几点需要注意: 1. 含有抽象方法的类必须被声明为抽象类(接口是抽象类的深度抽象),抽象类必须被继承(不然无意义),抽象方法必须被重写。 2. 抽象方法只需声明,而不需实现。 3. 抽象类不能被实例化,因为大部分抽象类中都存在抽象方法,抽象方法是没有方法体的,实例化会报错。此外,也可以...

2018-09-12 09:25:58 171

原创 Java学习之关键字 static

static关键词static可以用来修饰方法、变量、代码块,被static定义的变量或者方法,可以直接通过类名来进行引用。static代码块static代码块也就是即静态块。可以置于类中的任何地方(除了方法内部),类可以有多个static块。在JVM装载类的时候,静态数据只在类装载(生成.class文件)的时候执行一次,静态代码块也是如此,类中所有的静态块会随着类的加载而被执行,...

2018-09-11 16:14:08 102

原创 数据结构——递归学习和汉诺塔问题

递归调用的函数调用过程: 1、保留本层参数和返回地址(将所有的实在参数、返回地址等信息传递给被调函数保存); 2、给下层参数赋值(为被调用函数的局部变量分配存储区); 3、将程序转移到被调函数的入口; 4、保存被调函数的计算结果; 5、恢复上层参数(释放被调函数的数据区); 6、依照被调函数保存的返回地址,将控制转移回调用函数;汉诺塔问题: 递归问题的优点 对递归...

2018-07-23 19:48:46 2351

原创 数据结构——栈练习之常见的栈操作、括号匹配、数制转换等问题

常见的栈操作main.c#include &amp;lt;stdio.h&amp;gt;#include &amp;lt;stdlib.h&amp;gt;#include &quot;StackTest.h&quot;extern int MAX;int main(){ char date[10]; char del[10]; StackList *exp=init(); while(count&amp

2018-06-26 18:46:08 256

原创 Java学习之正则表达式

介绍正则表达式是对字符串操作的一种逻辑公式,就是用事先定义好的一些特定字符、及这些特定字符的组合,组成一个“规则字符串”,这个“规则字符串”用来表达对字符串的一种过滤逻辑。正则表达式通常缩写成“regex”。Java中正则表达式的实现在Java的类包中,关于正则表达式的类存放在Java.util.regex包下面:Pattern类 pattern 对象是一个正则表达式的编译表...

2018-06-25 10:05:49 204

原创 Java学习之日期实现

在这里只说明个人感觉编程常用到的一些知识点,用于备忘,具体关于Java日期时间的可以参考http://www.runoob.com/java/java-date-time.html 觉得总结的挺好的Java日期时间获取Java关于获取日期时间,有很多种方法,这里只介绍其中常见的几种。Date类获取系统时间 使用SimpleDateFormat格式化日期时间Calendar获...

2018-06-23 17:14:52 245

原创 Java学习之多线程(1)——多线程的实现

PS:首先如果对线程、进程存在疑惑的,可以参考我的另外一篇博文——Java学习之程序、进程、线程 https://blog.csdn.net/dypnlw/article/details/80606595%20Java%E5%AD%A6%E4%B9%A0%E4%B9%8B%E7%A8%8B%E5%BA%8F%E3%80%81%E8%BF%9B%E7%A8%8B%E3%80%81%E7%BA%BF...

2018-06-07 16:25:20 579

空空如也

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

TA关注的人

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