- 博客(42)
- 资源 (2)
- 收藏
- 关注
RSS订阅
原创 10分钟带你学会nginx！
什么是nginx？Nginx是lgor Sysoev为俄罗斯访问量第二的rambler.ru站点设计开发的一款应用。从2004年发布至今，凭借开源的力量，已经接近成熟与完善。Nginx功能丰富，可作为HTTP服务器，也可作为反向代理服务器，邮件服务器。支持FastCGI、SSL、Virtual Host、URL Rewrite、Gzip等功能。并且支持很多第三方的模块扩展。如果你不明白上边在说什么的话也没关系，你可以把它当成一个工具软件，接下来我会告诉你它可以做什么以及怎么使用。安装既然是个工具，那
2020-05-26 11:30:25
464
原创 你不知道的JavaScript数组方法
在JavaScript中数组是使用频率最高的数据结构之一。为了方便我们的开发和使用,ECMA委员会为我们修订和扩展了各种数组方法。这些方法有些比较冷门，有些却非常实用。下面为大家介绍一些你平时可能运用比较少的数组方法。先介绍几个大家比较熟悉的方法:sort() sort方法用于对数组元素进行排序,它接受传入一个函数，函数的两个参数代表后一个元素与前一个元素，函数的返回值为比较...
2018-06-26 20:06:15
314
原创 设计模式之外观模式
外观模式是封装思想的一种表现形式，它可以帮助我们隐藏系统的复杂性，只给用户提供一个可以访问的接口。 外观模式非常容易理解和实现，它属于结构型设计模式。场景模拟假设一台电脑，它包含了 CPU（处理器），Memory（内存） ，Disk（硬盘）这几个部件，若想要启动电脑，则先后必须启动 CPU、Memory、Disk，关闭时也需要按照相应顺序。利用门面模式可以将开关过程简化。 class CPU { startup():void{ console.log("cpu s
2020-06-29 13:41:21
1154
原创 设计模式之装饰器模式
装饰器模式允许向一个现有的对象添加新功能，同时又不改变其结构。装饰器模式用于对现有类的包装，它属于结构型模式。一般的，我们为了扩展一个类经常使用继承方式实现，由于继承为类引入静态特征，并且随着扩展功能的增多，子类会很膨胀。动态地给一个对象添加一些额外的职责。就增加功能来说，装饰器模式相比生成子类更为灵活。场景模拟装饰器模式在游戏中应用非常广泛，比如LOL英雄升级，每次英雄升级都会附加一个额外技能学习的场景。英雄升级是原有结构，所学习技能便是一个附加描述。interface Hero {
2020-06-28 16:51:54
303
原创 设计模式之组合模式
组合模式是一种树状结构的专用模式，主要用来组合对象。它可以比较清晰的显示出部分和整体层次，因为这种模式的妙用在于整合而不是创建，因此我们常把他看做结构型模式的一种。场景描述某公司CEO下设有销售经理和市场经理，两个经理下各自有自己的下属员工，现遍历公司人员结构树，打印所有人员的薪资职位等状况。代码实现下面是改写自菜鸟教程的一段示例代码：class Employee { name: string; dept: string; salary: number;
2020-06-24 15:15:05
215
原创 过滤器模式与责任链模式
过滤器模式又被称为标准模式，这种模式主要使用不同标准来过滤一组对象。过滤的过程便是一个层层筛选的过程，因此过滤器模式属于结构型设计模式的一种。由于实际开发中过滤器模式的使用方式往往要和责任链模式结合使用。所以这里也需要一并介绍下责任链模式。责任链模式顾名思义就是创建一个链条，经过这个链条处理的所有对象和数据分别进行依次加工，每个环节负责处理不同的业务，环节间彼此独立解耦，同时可以复用。使用过gulp的同学应该很好理解责任链，因为gulp本身的文件处理机制便是基于责任链模式设计，使用链式调用，不同的lo
2020-06-23 10:56:28
4760
原创 Object.freeze方法
Object.freeze方法是es5中新增加的一个属性描述符，用于锁定一个对象，被锁定后的对象将不可添加或删除属性，对自身已有属性也不可进行修改。let obj = Object.freeze({name:"aaa"});obj.age=12;console.log(obj.age); // undefinedobj.name = "bbb";console.log(obj.name); // aaadelete obj.name;console.log(obj.name); /
2020-06-18 15:01:47
699
原创 设计模式之桥接模式
桥接模式是指将抽象和实现放在两个不同的类层次中，使它们可以独立地变化。它属于结构型设计模式的一种。桥接模式主要用于解决双维度扩展问题。应用场景：1、如果一个系统需要在构建的抽象化角色和具体化角色之间增加更多的灵活性，避免在两个层次之间建立静态的继承联系，通过桥接模式可以使它们在抽象层建立一个关联关系。2、对于那些不希望使用继承或因为多层次继承导致系统类的个数急剧增加的系统，桥接模式尤为适用。3、一个类存在两个独立变化的维度，且这两个维度都需要进行扩展。模拟场景假设现在有这样一个剧院，每周
2020-06-18 11:06:55
168
原创 设计模式之适配器模式
设计模式之适配器模式 适配器模式是一种结构型的设计模式。它的主要作用是作为一个连接器实现不同方法或接口之间的兼容调用。家里装过空调的朋友都知道，空调作为一种大功率的家用电器，接入线的功率和普通家用电器的接入线是不同的。普通电器的接入线为10A，但是空调的接入线是16A，普通家庭里的安装的插孔大多也都是10A，因此要解决这个问题，我们就需要一个支持输入端为10A，输出端为16A的插排。// 电源class ElectricSource { constructor(){ thi
2020-06-16 16:17:25
168
原创 Object.defineProperty 方法
Object.defineProperty是es5中新增加的属性描述符。在它出现之前你可能会经常有一些疑问，比如for in 循环为何不能遍历出函数的arguments、length、name等属性名，delete window.a 为何返回false, 等你学完这个api，这些现象便都能够得到解释。Object.defineProperty 一共涉及6个可配置项： writable： 是否可重写 value： 当前值 get： 读取时内部调用的函数 set：
2020-06-10 15:29:07
2655
2
原创 设计模式之原型模式
原型模式是快速创建重复对象的一种最佳模式。 这里所说的原型是我们要创建的实例的原始模型，不是js中某个方法或对象的原型属性。在javaScript中因为需要渲染各种数据，尤其是在使用基于数据驱动的vue或react等框架进行开发时经常会遇到需要数据拷贝的情况。除此之外，关于前端的数据缓存方法的封装等也常常需要考虑到数据的拷贝，原型模式其实在不知不觉间就被使用了。class ProtypeMain { constructor() { this.map = new Map();
2020-06-08 17:02:54
133
原创 设计模式之建造者模式
设计模式之建造者模式什么是建造者模式？建造者模式是把简单对象构造成复杂对象的一种模式。 它也是一种创建型的设计模式，只不过它的产物一般是一个复杂的对象，而且这个对象在组合构建时是可变的。什么时候使用建造者模式？上边说到建造者模式的功能是用来创建复杂对象。如果一个对象是有多个可变的属性组成，且根据场景不同，这些属性的值是可变的，那么如果只靠传参来控制一定是一件非常头疼的事。这个时候就可以考虑使用建造者模式简化创建过程，同时使对象的创建过程变得更可控。比如说，现在老王有个施工队，这个施工队负责到处给别
2020-06-07 15:30:55
164
原创 Spring Boot CLI安装及配置
Spring Boot CLI安装及配置Spring Boot CLI是一个命令行工具，可用于快速搭建基于Spring的原型。它支持运行Groovy脚本，这也就意味着你可以使用类似Java的语法，但不用写很多的模板代码。你可以点击这里 进行下载，有很多可供选择的版本，我选择的是目前最新的版本spring-2.3.0.RELEASE文件下载后可以找一个适当的目录存放，然后配置环境变量。你可以使用命令进行配置，记得修改自己的路径。set path=D:\softwares\spring-2.3.0.RE
2020-05-30 12:05:16
641
原创 设计模式之抽象工厂模式
设计模式之抽象工厂模式简介总结简介抽象工厂是比工厂模式更高端的一种创建型设计模式，他主要用来创建工厂。比如说老王之前开了一家文具厂，可是生意越做越大，老王现在还想办服装厂，玩具厂，食品厂等等。老王财大气粗一口气要办十几个跨行业的厂房，但是一个人毕竟精力有限，最好的办法是在自己和下属的厂房之间设立一个部门，专门负责新厂房的修建和新业务的扩展。这样老王如果想了解厂房的情况只需要问责这个部门就可以了。看下代码实现：// 父类 文具 class Stationery { constructor(
2020-05-25 15:49:12
268
原创 设计模式之工厂模式
设计模式之工厂模式简介优缺点总结简介工厂模式是设计模式中一种最常用的创建型设计模式。我们之所以称其为创建型模式是因为它主要用来创建新的对象。在实际开发过程中你常常会遇到需要创建对象的情况，这些对象可能大同小异，每次单独创建会增加代码量且不易于后期维护，所以就可以将这一部分封装为公共方法，命名为工厂方法。举个例子: 老王是一家文具厂的厂长，文具厂里可以生产多种文具，当零售商到文具厂批发货物时会指定要购买哪种文具。// 父类文具class Stationery { getType(){
2020-05-24 14:20:46
202
原创 JavaScript原型和面向对象
原型（prototype）的来源： 虽然JavaScript和Java并没什么关系，但是JavaScript在开始创建的时候想要模仿Java 通过new 操作符实现对一些方法和属性的共享。但是在es6 之前JavaScript并没有真正类 （class）的概念，所以JavaScript借鉴了其他语言（self , io, lua等）的原型机制。 简单点说就是在JavaScript中每个函数...
2018-07-21 12:50:40
214
原创 设计模式之单例模式
单例模式又被称为单体模式，它是一种非常基本但使用频率很高的设计模式。它的基本设计思想是将代码组织为一个逻辑单元，这个逻辑单元中的代码只能通过单一的变量进行访问。通俗点说就是一个对象只能被实例化一次。由于它确保了访问入口的唯一，所以可以保证所有的代码使用到相同的全局资源。 基本的单例模式 最基本的单例模式实际上就是一个对象字面量，当然，你也可以称它为一个命名空间。var si...
2018-07-06 16:12:53
224
原创 前端模块化
对代码进行模块化是项目开发中重要的技术类型，它可以对复杂的功能进行解耦，可以灵活复用和关联各模块功能。随着这些年前端的发展，模块化也成了前端开发必不可少的部分。 目前，前端比较流行的几种定义模块化的规范分别是: AMD 、CommonJS、ES6 module ,它们都被webpack支持。 AMD规范 AMD的全称为 Asynchronous Module Definiti...
2018-06-28 10:46:22
283
原创 自动化构建工具gulp入门（三）
相信在看过前两篇文章以后你已经对gulp有了比较深入的了解。但是，虽然开发者们已经为gulp官网贡献了丰富多样的gulp插件，但在实际开发中现有的插件也许并不能完美的满足我们的需求。所有学会自己开发gulp插件也是我们深入掌握gulp使用的必修课程。 当然，我们知道gulp是基于nodeJs流的自动化工具，这意味着要想独立开发gulp的插件我们需要有一定的nodejs基础。如果你之前并不...
2018-06-25 12:07:47
285
原创 自动化构建工具gulp入门（二）
上一篇文章中和大家分享了gulp的一些基本概念和使用方法，但实际开发中gulp需要依赖其丰富的插件来发挥它的能力。 gulp官网中为我们提供了丰富的插件系统可以协助我们进行各种开发工作。但由于其插件数量实在太多，多达数千个，所以我们不可能系统的学习每个插件。在此跟大家一起分享一些常用插件的使用，如果你有更多的学习或开发使用诉求，可以访问gulp的插件官网学习更多插件的使用。插件官网：...
2018-06-15 12:27:49
277
原创 自动化构建工具gulp入门（一）
一、什么是gulp？gulp是一种比较受欢迎的前端自动化构建工具，它基于Nodejs流，可协助开发人员进行任务管理，减少IO操作。详细了解gulp可访问中文官方网址: https://www.gulpjs.com.cn/二、自动化与工程化要想弄清为什么要使用gulp，我们还是要先为大家介绍一下自动化和工程化的概念：前端自动化：借助于某些工具，监听用户操作，完成自动编译（sass...
2018-06-11 19:23:32
267
原创 前端打印
前端js实现打印的几种方式一、基本原理利用window对象自带的print方法，将当前窗口内展示的内容打印出来。这里的window包括以下几种情况：当前默认的全局window对象.调用window.open方法返回的window对象.iframe下的contentWindow对象.这个很好理解，contentWindow会继承window对象的方法和属性,因此也可以使用pri...
2018-06-08 14:59:48
2618
1
原创 JavaScript 类型判定
在进行编程开发时，我们往往需要对一些不可确定的数据进行类型判定 。但是仅仅借助JavaScript自带的typeof 和instanceof 这两个方法似乎并不能满足我们的需求。首先 使用typeof 和instanceof 所能分辨出的类型是比较模糊的，以typeof 举例的话他能识别出string 、number 、boolean 、 function 、undefined 、objec
2017-06-28 11:08:58
398
原创 JavaScript 类数组对象
在JavaScript中有一种数据结构叫类数组，也被称为伪数组，伪数组并不是真正意义上的数组，但是它具有很多和数组相似的特性，所以被人们称为类数组。常见的伪数组：如：function 内的arguments，通过document.forms、form.elements、document.links、select.options 、document.getElementsByName 、docu
2017-06-26 10:02:21
383
原创 Object.keys方法
Object.keys方法是JavaScript中用于遍历对象属性的一个方法 。它传入的参数是一个对象，返回的是一个数组，数组中包含的是该对象所有的属性名。console.log(typeof Object.keys); // function应用实例 var cat= { name:’mini’, age:2, color:’yellow’,
2017-06-09 11:55:12
3498
原创 Object.create方法及其在继承上的应用
方法介绍Object.create 方法是JavaScript中用于创建对象的一个方法 。 Object.create接收两个参数，第一个表示要继承的对象，第二个参数表示也是一个对象，用于对新创建的对象进行初始化 。下面我们来看具体应用：var Obj ={ name:'mini', age:3, show:function () { console.log(this.name +
2017-06-09 10:10:35
1772
原创 JavaScript自定义“类”库
JavaScript 是基于原型的语言，在es6 之前并没有包含内置类的实现。但是这并不意味着类在JavaScript中毫无必要 。实际上类是一种很有用的工具，像其他编程语言中一样，类在JavaScript中同样可以起到重要的作用 。 下面我们手动封装一个类库，实现一个简单的类的创建。 预期实现的功能：1. 可以对新创建出来的类进行初始化2. 可以扩展类的静态属性与方法
2017-06-05 19:38:47
841
原创 JavaScript 上下文切换
JavaScript是一门非常灵活的语言，它和其他编程语言相比有很多独特的地方。其中一个较为突出的表现就是，在JavaScript中允许我们手动更改上下文 。这会方便我们进行状态的共享，尤其是在事件回调中显得意义重大。但这也市场给一些初学者带来费解和疑惑。下面我们为大家讲述几种较为常用的手动更改上下文的方法：function Student(name) { this.nam
2017-06-02 20:00:55
1368
原创 JavaScript bind方法
在ECMAScript 5中新增了bind() 函数用于控制调用的作用域 。bind () 是基于函数进行调用的 ，用来确保函数是在指定的this值所在的上下文中调用的。 我们可以通过如下代码了解其功能： function SayHello() { this.show=function () { alert("hello")
2017-06-02 11:15:07
591
原创 JavaScript自定义事件及dom无关事件
一、 自定义事件相信大部分的朋友对事件监听并不陌生，这是我们实际开发中常用的一种代码实现方式。但似乎我们之前用到的都是浏览器内置的事件，能不能自定义事件进行触发呢？实际上在jQuery中为我们提供了 trigger() 函数，专门用来触发自定义事件。可以通过命名空间的形式来管理事件名称，命名空间中的单词用点号分隔 。 如：// 绑定自定义事件 $(“.class“).
2017-06-01 13:39:29
780
原创 node连接mysql
一、基本的mysql操作命令在mysql client 下输入账号密码登录，执行下面命令。 show databases; // 查看所有数据库 create database user ; //创建数据库 user use user ; // 使用 user 数据库 // 创建 admin表create table admin(id int not
2017-05-31 19:33:47
314
原创 git 速成笔记
git的特点：1. 速度快2.设计简单3.对非线性开发模式强力支持（允许成千上万个并行开发的分支）4.完全分布式使用git要首先安装git查看本机有没有安装git ，可以使用命令 git 。如果没有安装git需要先下载安装git，安装git之后需要配置本地用户信息（注意这一步是很有必要的，否则进行后续操作时会报错）。git config --global
2017-05-19 20:18:50
445
原创 PHP入门之开发环境搭建
配置php的开发和学习环境一直是让人比较头疼的事情，因为工作原因，笔者最近换了电脑又需要重新配置php环境 。下面将操作步骤在此记录和大家分享。因为想要尽快的配置开发环境，所以我使用了一个集成的php环境 ——wampServer 。wampServer 是一个整合软件包，它集成了 Apache Web 服务器、PHP解释器 以及MySQL 数据库 。使用这款集成软件可以让你腾出更多的精
2017-04-22 17:34:14
634
原创 算法基础之数组去重
几种数组去重方法数组的排序和去重问题往往是编程新手在学习过程中经常遇到的，同时也是工作中较为常见的数组操作。现在我们有这样一个数组 var arr=[1,2,3,2,3,6,8]; 我们希望去除数组中重复的元素，只返回未重复的元素。 下面我们提供几种不同的思路来实现这个问题的解决。方法一 var obj={}; for(var i=0;i<arr.length;i++) {
2017-04-22 15:18:16
632
原创 算法基础之选择排序
说一下选择排序的基本算法 。 现在有这样一个数组，[ 3 , 4 ,6 , 1 , 7 , 2 , 5 , 8] 我们对其进行从小到大的排序 。 现在我们默认数组中第一个元素就是数组中的最小值，将它与其后边的所有元素进行比较，当有元素的值小于当前默认最小元素时，交换这两个元素的顺序。当数组第一个元素小于后边所有元素时，我们再用数组第二个元素与后面所有元素进行比较。依次类推，这样我们执行到
2017-04-18 09:25:18
272
原创 算法基础之冒泡排序
首先讲一下冒泡排序的基本算法思想 。 假设有这样一个数组 var arr = [3,4,6,1,7,2,5,8]; 需要我们从小到大对其进行排序。我们从数组的第一个元素开始，依次比较相邻的两个元素，若前边的数大于后边的数，则对它们进行位置交换。即第一次比较arr[0]与arr[1] ,继续比较arr[1] 与arr[2] ,再继续比较arr[2] 与arr[3] ,依次类推 。if
2017-04-17 21:34:01
309
原创 mongodb 使用入门介绍
mongodb基本介绍mongodb是一种分布式、非关系型的数据库，它区别于SQLserver ,Mysql，Oricle等常规的关系型数据库。它也被称为文档型的数据库，这是因为mongodb在使用过程中脱离了传统的二维表格形式，使得它在存储数据时更加灵活。在利用mongodb存储数据时给人的感觉更像是在写json文件。 mongoDB的适用场景： 1. 适合作为信息基础设施的持久化缓
2017-04-13 16:24:11
629
原创 parseInt 进制转换
parseInt 进制转换问题今天在工作中遇到一个比较有意思的进制转换问题，在此做下记录，希望能帮助在利用parseInt做进制转换时遇到类似坑的同学。首先我们看下 w3c 手册中对于parseInt的使用说明：大概的意思是parseInt 共接收两个参数，其中第一个是一个字符串，第二个参数是进制基数，返回的结果是一个十进制数字。此时我们在浏览器中输入parseInt(
2017-04-12 08:48:50
2233
1
原创 算法基础之插入排序
问题描述：输入： n个数的一个序列，[a1, a2 , a3, a4, ……, an ] 。输出：输入序列的一个排序结果，[b1, b2 , b3, b4, …… ,bn ]， 满足 b1≤ b2 ≤ b3 · · · · ≤ bn 。算法描述： 插入排序的工作 方式像许多人排序一手扑克牌，开始时，我们的左手为空并且桌子上的牌面向下。 然后，我们每次从桌子上拿走
2017-03-27 18:12:02
351
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人