- 博客(25)
- 收藏
- 关注
原创 ::before和::after伪元素
::before和::after伪元素一、定义伪元素是指由CSS生成的而不是由DOM结构生成的元素,语法是在元素后紧跟双冒号,然后再跟伪元素关键词,如div::before表示div元素的::before伪元素。有时你会见到单冒号的写法,如div:before,虽然也可以正常渲染,但规范中提到,单冒号用于伪类(例如 :hover,当鼠标悬浮在元素上方时,向元素添加样式),双冒号用于伪元素,所以我们还是向规范靠拢,使用双冒号的写法。二、content属性所有伪元素都必须要用content属性声明引用内
2020-11-01 18:45:54
1073
原创 JavaScript设计模式之状态模式
状态模式定义 状态模式允许一个对象在其内部状态改变时改变它的行为,对象看起来似乎修改了它的类,类的行为随着它的状态改变而改变。 当程序需要根据不同的外部情况来做出不同操作时,最直接的方法就是使用 switch-case 或 if-else 语句将这些可能发生的情况全部兼顾到,但是这种做法应付复杂一点的状态判断时就有点力不从心,开发者得找到合适的位置添加或修改代码,这个过程很容易出错,这时...
2020-04-28 00:23:47
228
原创 JavaScript设计模式之装饰者模式
装饰者模式定义 装饰者模式又称装饰器模式,在不改变原对象的基础上,通过对其添加属性或方法来进行包装拓展,使得原有对象可以动态具有更多功能。 本质是功能动态组合,即动态地给一个对象添加额外的职责,就增加功能角度来看,使用装饰者模式比用继承更为灵活。好处是有效地把对象的核心职责和装饰功能区分开,并且通过动态增删装饰去除目标对象中重复的装饰逻辑。优缺点装饰者模式的优点:我们经常使用继承...
2020-04-27 00:07:43
180
原创 JavaScript设计模式之中介者模式
中介者模式定义 中介者模式又称调停模式,使得各对象不用显式地相互引用,将对象与对象之间紧密的耦合关系变得松散,从而可以独立地改变他们。核心是多个对象之间复杂交互的封装。现实中的中介者机场指挥塔房产中介博彩公司优缺点中介者模式的主要优点有:松散耦合,降低了对象之间的相互依赖和耦合;将对象间的一对多关联转变为一对一的关联,符合最少知识原则,提高系统的灵活性,使得系统易于维护...
2020-04-21 23:44:59
185
原创 JavaScript设计模式之职责链模式
职责链模式定义 使多个对象都有机会处理请求,从而避免请求的发送者和接收者之间的耦合关系,将这些对象连成一条链,并沿着这条链传递该请求,直到有一个对象处理它为止。优缺点职责链模式的优点:和命令模式类似,由于处理请求的职责节点可能是职责链上的任一节点,所以请求的发送者和接受者是解耦的;通过改变链内的节点或调整节点次序,可以动态地修改责任链,符合开闭原则;职责链模式的缺点:并不...
2020-04-19 23:36:48
114
原创 JavaScript设计模式之享元模式
享元模式定义 享元模式:运用共享技术来有效地支持大量细粒度对象的复用,以减少创建的对象的数量。 享元模式的主要思想是共享细粒度对象,也就是说如果系统中存在多个相同的对象,那么只需共享一份就可以了,不必每个都去实例化每一个对象,这样来精简内存资源,提升性能和效率。内部状态与外部状态 享元模式的目标是尽量减少共享对象的数量,关于如何划分内部状态和外部状态,下面的几条经验提供了一些指引:...
2020-04-18 23:39:31
225
1
原创 JavaScript设计模式之模板方法模式
模板方法模式定义 模板方法模式是一种只需使用继承就可以实现的非常简单的模式。 模板方法模式由两部分结构组成,第一部分是抽象父类,第二部分是具体的实现子类。在模板方法模式中,子类实现中的相同部分被上移到父类中,而将不同的部分在子类中实现。示例var Beverage = function(param) { var boilWater = function () { console...
2020-04-18 21:23:44
155
原创 JavaScript设计模式之组合模式
组合模式定义 组合模式又叫整体-部分模式,它允许你将对象组合成树形结构来表现整体-部分层次结构,让使用者可以以一致的方式处理组合对象以及部分对象。示例var closeDoorCommand = { execute: function(){ console.log("关门"); }};var openPcCommand = { execute: function(){...
2020-04-14 23:14:24
208
原创 JavaScript设计模式之命令模式
命令模式定义 命令模式又称事务模式,将请求封装成对象,将命令的发送者和接受者解耦。本质上是对方法调用的封装。用途 最常见的应用场景是:有时候需要向某些对象发送请求,但是并不知道请求的接收者是谁,也不知道被请求的操作是什么。此时希望用一种松耦合的方式来设计程序,使得请求发送者和接收者者能够消除彼此之间的耦合关系。 拿订餐来说,客人需要向厨师发送请求,但是完全不知道这些厨师的名字和联系...
2020-04-13 21:13:49
142
原创 JavaScript设计模式之发布-订阅模式
发布-订阅模式定义 发布-订阅模式又称观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖它的对象都将得到通知。在 Javascript 开发中,我们一般用事件模型来替代传统的发布订阅模式。作用 1.发布-订阅模式可以广泛应用于异步编程中,这是一种替代传统回调函数的方案。比如,我们可以订阅 ajax 请求的 error、success 等事件。或者如果想...
2020-04-12 13:27:53
151
原创 JavaScript设计模式之迭代器模式
迭代器模式定义 迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示。迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也可以按顺序访问其中的每个元素。JQuery中的迭代器 迭代器模式无非就是循环访问聚合对象中的各个元素。比如 jQuery 中的 $.each 函数,其中回调函数中的 index 为当...
2020-04-08 22:45:27
148
原创 JavaScript设计模式之代理模式
代理模式定义 提供一个实际对象的代理,以便更好地控制实际对象。在生活中很容易就能找到很多代理的例子,比如明星的经纪人、各种代购等等。 代理模式的关键是,当不方便或不满足条件控制一个对象的访问时,需要提供一个替代对象对请求做一次筛选之后再传给本体。...
2020-04-08 00:26:30
116
原创 JavaScript设计模式之策略模式
策略模式定义 指对象有某个行为,但是在不同的场景中,该行为有不同的实现算法。比如每个人都要“交个人所得税”,但是“在美国交个人所得税”和“在中国交个人所得税”就有不同的算税方法。组成一个基于策略模式的程序有以下组成部分:抽象策略角色: 通常由一个接口或者抽象类实现具体策略角色:包装了相关的算法和行为环境角色:持有一个策略类的引用,最终给客户端调用应用场景针对同一类型问题的...
2020-04-06 15:22:57
198
原创 JavaScript设计模式之单例模式
单例模式 单例模式的定义是:保证一个类仅有一个实例,并提供了一种访问其唯一的对象的方式。 单例模式是一种常用的模式之一,有一些对象我们往往只需要一个,比如线程池、全局缓存、浏览器中的 window 对象等。使用传统面向对象思想简单的实现一个单例模式:var Singleton = function (name) { this.name = name;}Singleton.prot...
2020-04-03 01:28:51
124
原创 JavaScript 之 this、call 和 apply
在 JavaScript 编程中,this 关键字总是让初学者感到迷惑, Function.prototype.call 和 Function.prototype.apply 这两个方法也有着广泛的运用。this JavaScript 的 this 总是会指向一个对象,而具体指向哪个对象是在运行时基于函数的执行环境动态绑定的,而非函数被声明时的环境。this 的指向大致可以分为以下 4...
2020-04-02 00:25:06
160
原创 【Flask学习笔记:九】Flask-SQLAlchemy
目录: 【Flask学习笔记:一】开发环境部署 【Flask学习笔记:二】Flask 入门基础知识 【Flask学习笔记:三】Flask 中的 request、response 【Flask学习笔记:四】Flask 应用和请求上下文 【Flask学习笔记:五】Jinja2 模板引擎 【Flask学习笔记:六】Flask 蓝图 【Flask学习笔记:七】Flask - W...
2020-03-29 16:12:58
509
原创 【Flask学习笔记:八】Flask 中的 cookie、session
目录: 【Flask学习笔记:一】开发环境部署 【Flask学习笔记:二】Flask 入门基础知识 【Flask学习笔记:三】Flask 中的 request、response 【Flask学习笔记:四】Flask 应用和请求上下文 【Flask学习笔记:五】Jinja2 模板引擎 【Flask学习笔记:六】Flask 蓝图 【Flask学习笔记:七】Flask - W...
2020-03-24 23:42:10
552
原创 【Flask学习笔记:七】Flask - WTF 处理表单
目录: 【Flask学习笔记:一】开发环境部署 【Flask学习笔记:二】Flask 入门基础知识 【Flask学习笔记:三】Flask 中的 request、response 【Flask学习笔记:四】Flask 应用和请求上下文 【Flask学习笔记:五】Jinja2 模板引擎 【Flask学习笔记:六】Flask 蓝图 【Flask学习笔记:七】Flask - W...
2020-03-24 00:24:32
335
原创 【Flask学习笔记:六】Flask 蓝图
目录: 【Flask学习笔记:一】开发环境部署 【Flask学习笔记:二】Flask 入门基础知识 【Flask学习笔记:三】Flask 中的 request、response 【Flask学习笔记:四】Flask 应用和请求上下文 【Flask学习笔记:五】Jinja2 模板引擎 【Flask学习笔记:六】Flask 蓝图【Flask学习笔记:六】Flask 蓝图...
2020-03-21 16:12:30
324
原创 【Flask学习笔记:五】Jinja2 模板引擎
目录: 【Flask学习笔记:一】开发环境部署 【Flask学习笔记:二】Flask 入门基础知识 【Flask学习笔记:三】Flask 中的 request、response 【Flask学习笔记:四】Flask 应用和请求上下文 【Flask学习笔记:五】Jinja2 模板引擎]【Flask学习笔记:五】Jinja2 模板引擎 在 Flask 中通常使用 Jinja2...
2020-03-19 00:22:59
552
原创 【Flask学习笔记:四】Flask 应用和请求上下文
目录: 【Flask学习笔记:一】开发环境部署 【Flask学习笔记:二】Flask 入门基础知识 【Flask学习笔记:三】Flask 中的 request、response 【Flask学习笔记:四】Flask 应用和请求上下文【Flask学习笔记:四】Flask 应用和请求上下文 Flask 从客户端收到请求时,要让视图函数能访问一些对象,这样才能处理请求。请求对象就是...
2020-03-17 02:09:13
357
原创 【Flask学习笔记:三】Flask 中的 request、response
目录:【Flask学习笔记:一】开发环境部署【Flask学习笔记:二】Flask 入门基础知识【Flask学习笔记:三】Flask 中的 request、response【Flask学习笔记:三】Flask 中的 request、response一、request如果要访问请求数据,可以使用全局请求对象 request。Flask 会解析传入的请求数据,并允许通过该全局对象访问它。如果...
2020-03-15 14:29:09
1016
原创 【Flask学习笔记:二】Flask 入门基础知识
【Flask学习笔记:二】Flask入门Flask 一个轻量级的 WSGI Web 应用程序框架,虽然其核心非常小,但是该 Web 框架简约而不简单,具有很强的扩展能力。Flask基于 Werkzeug WSGI 工具包和 Jinja2 模板引擎,都是由 Armin Ronacher 开发。一、第一个 Flask Web 程序1.在 Pycharm 中安装 Flask 框架在终端输入:c...
2020-03-14 14:24:18
720
原创 【Flask学习笔记:一】开发环境部署
【Flask学习笔记:一】开发环境部署一、Python的安装及配置1.1 Python的安装 Python 安装包可以直接从官网下载,下载地址为:https://www.python.org/ 安装教程及环境配置参考:https://www.runoob.com/python/python-install.html1.2 测试Python是否安装成功 以Windows为例,接下来...
2020-03-12 01:32:13
400
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人