前端基础
前端基础概念集合
天空之蓝钻
这个作者很懒,什么都没留下…
展开
-
css 布局
1. 水平垂直居中(css3):<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <me...原创 2019-07-07 16:36:43 · 76 阅读 · 0 评论 -
设计模式(七)桥接模式
1. 前言:使用场景:当涉及到多维度时,也就是多层继承的情况时。优点:抽象和实现的分离。优秀的扩展能力。实现细节对客户透明。缺点:桥接模式的引入会增加系统的理解与设计难度,由于聚合关联关系建立在抽象层,要求开发者针对抽象进行设计与编程。2. 例子使用继承实现时:可以看出当要增加一个新的产品时,比如:LenoveDesktop,则需要影响到两个维度:电脑种...原创 2019-03-31 19:12:29 · 83 阅读 · 0 评论 -
设计模式(六)适配器模式
1.前言说起适配器模式最先想到的例子就是110v和220v插头转接器的例子了:有一天你从香港买来一个iphone8,但是香港的插头要比大陆地区的插头大一些,你回到家之后发现在现有的屋子环境下找不到合适的插口能够插入这个插头。现在有两个办法,一是:更换屋里的所有的或者部分插口能够插下iphone8,但是这个行不通的,家是在大陆,一般电器插口还是国标的,虽然解决了我一时需要使用ip8,但是手机更...原创 2019-03-29 16:48:29 · 99 阅读 · 0 评论 -
设计模式(五)原型模式
1.前言使用场景:当创建一个对象的前置操作会耗费非常多的资源时。比如初始化一个实例需要查询多个数据库的时候,这个时候我们只需要考虑输入输出时候存在唯一对应关系,如果是的话就可以将结果缓存起来,当下次需要再次生产该类型的对象时clone一份就可以,节省了巨大的系统资源。当类的实例种类有限时。因为原型模式实际上就是一种缓存模式,当类的实例类型很多的时候比如:animals类,根据场景不同产...原创 2019-03-28 13:39:16 · 91 阅读 · 0 评论 -
设计模式(四)建造者模式
1.前言使用场景:当对象内部有复杂的结构时。组件有类似的结构时。优点:建造者独立,有利于扩展。功能原子化有利于细节控制。缺点:需要组件有相似的结构,范围有限制。结构复杂时,会有很多的组件类。2.例子<script> /** * 由于js中没有interface和abstract 概念 * 建造者模式只能直接使用...原创 2019-03-26 19:12:33 · 66 阅读 · 0 评论 -
设计模式(三)单例模式
1. 前言主要解决:一个全局使用的类频繁地创建与销毁。使用场景:当你想控制实例数量,节省系统资源的时候。优点:避免频繁的创建和销毁实例,在内存里只有一个实例,减少了内存开销。避免对资源的多重占用。(写文件的时候如果不使用单例模式,有可能在同一时间对同一文件进行写操作)缺点:因为单例的指针存放在静态区域,所以只有当程序结束时才会释放内存,所以不要滥用单例,这可能导致内存泄漏!不...原创 2019-03-25 18:56:56 · 198 阅读 · 0 评论 -
设计模式(二)抽象工厂模式
1. 前言抽象工厂(Abstract Factory Pattern)就是生产工厂的工厂,这种类型的设计模式属于创建型模式,它提供了一种创建对象的最佳方式。在抽象工厂模式中,接口是负责创建一个相关对象的工厂,不需要显式指定它们的类。每个生成的工厂都能按照工厂模式提供对象。使用场景:当我们需要一整套的解决方案时,比如:1、QQ 换皮肤,一整套一起换。 2、生成不同操作系统的程序。...原创 2019-03-24 15:05:34 · 140 阅读 · 0 评论 -
设计模式(一)工厂模式
1.前言:工厂模式属于创建型模式:创建型模式:这些设计模式提供了一种在创建对象的同时隐藏创建逻辑的方式,而不是使用 new 运算符直接实例化对象。这使得程序在判断针对某个给定实例需要创建哪些对象时更加灵活。使用场景:当我们明确的计划在不同环境实例化不同实例时,比如:我们想把不同级别的日志记录在不同的文件中时。优点:实例化对象时只需要知道名字即可(业务和实现解耦),...原创 2019-03-22 14:43:40 · 97 阅读 · 0 评论 -
使用websocket实现聊天室功能
1.websocket的由来和使用场景WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。在 WebSocket API 中,...原创 2019-03-19 23:25:00 · 430 阅读 · 0 评论 -
关于new操作符的分析
关于new操作符的分析1. new的执行步骤生成一个新的object.将构造函数的上下文指向object.当构造函数返回值是基本数据类型时返回object,否则返回原始返回值。2. 代码function _new(fun,args){ let o = Object.create(fun.getPrototypeOf()); let res = fun.apply(o,args)...原创 2019-10-08 00:35:54 · 151 阅读 · 0 评论