摘要: 输入框与显示框 之前做一个项目的时候需要实现怎么一个场景,有一个做题网站,需要有一个输入框和一个显示框。 输入框可以给用户输入简答题答案,为了让用户有更好的输入体验,需要可以支持 换行符 ,并且在数据的数据行数超过原来设定好的输入框的高度时,输入框的 高度自动增加 ,让用户能在屏幕上尽量多的看到其输 阅读全文
posted @ 2018-03-04 14:41 另一个小菜头 阅读(347) 评论(0) 推荐(0) 编辑
摘要: Vue 非父子组件通信方案 概述 在 Vue 中模块间的通信很普遍 如果是单纯的父子组件间传递信息,父组件可以使用 "props" 将数据向下传递到子组件,而在子组件中可以使用 "events" (父组件需要先监听对应子组件触发的事件) 向父组件传递信息。 但是当我们需要进行非父子组件间的通信或者是 阅读全文
posted @ 2018-03-04 14:39 另一个小菜头 阅读(338) 评论(0) 推荐(0) 编辑
摘要: 观察者模式 1. 介绍 发布者与订阅者是多对多的方式 通过推与拉获取数据:发布者推送到订阅者或订阅者到发布者那边拉 使并行开发的多个实现能彼此独立地进行修改 其实我们在前端开发中使用到的时间监听就是浏览器实现的观察者模式 2. 示例:订阅报纸 3. 示例:动画 里面有个 类提供了三个可以被订阅的观察 阅读全文
posted @ 2018-03-02 15:45 另一个小菜头 阅读(159) 评论(0) 推荐(0) 编辑
摘要: 享元模式 1. 介绍 一种优化模式 适合解决因创建大量类似对象而累积性能问题 javaScript 代码可能很快就用光浏览器的内容,通过把大量独立对象转化为少量共享对象,可以降低运行 Web 应用所需的资源数量。 对一连用上几天也不会重新加载的大型应用系统比较有用,对打开时间短的小型网页作用不大 J 阅读全文
posted @ 2018-03-02 15:31 另一个小菜头 阅读(141) 评论(0) 推荐(0) 编辑
摘要: 装饰者模式 1. 作用: 可用来透明地把对象包装在具有同样接口的另一对象之中,这样可以给一个方法添加一些行为,然后将方法调用传递给原始对象。 可用于为对象增加功能,用来代替大量子类。 装饰者对其组件进行了透明包装,二者可以互换使用,因为他们 实现了同样的接口 2. 例子:自行车 3. 装饰者模式与组 阅读全文
posted @ 2018-03-02 14:45 另一个小菜头 阅读(128) 评论(0) 推荐(0) 编辑
摘要: 适配器模式 1. 作用: 协调两个不同的接口 2. 适用场景 适配器适用于客户期待的接口与现有 API 提供的接口不兼容这种场景。他只能用来协调语法上的差异问题。适配器所适配的两个方法执行的应该是类似的任务,否则的话他就解决不了问题。 3. 适配器的利与弊: 利: 有助于避免大规模的改写现有的客户代 阅读全文
posted @ 2018-03-02 13:11 另一个小菜头 阅读(90) 评论(0) 推荐(0) 编辑
摘要: 门面模式 门面模式(Facade Pattern):他隐藏了系统的复杂性,并向客户端提供了一个可以访问系统的接口。这种类型的设计模式属于结构性模式。为子系统中的一组接口提供了一个统一的访问接口,这个接口使得子系统更容易被访问或者使用。 1. 作用: 简化类的接口 消除类与使用它的客户代码之间的耦合 阅读全文
posted @ 2018-03-02 12:24 另一个小菜头 阅读(139) 评论(0) 推荐(0) 编辑
摘要: 组合模式 1. 适合使用组合模式的条件: 存在一批组织成某种层次体系的对象,如树形结构(具体的结构在开发期间可能无法得知) 希望对这批对象或其中的一部分对象实施一个相同的操作 2. 注意点: 组合对象与其所有子对象具有相同的接口,但是叶对象并没有继承其上一级组合对象,不是超类与子类的关系 3. 例子 阅读全文
posted @ 2018-03-02 12:05 另一个小菜头 阅读(134) 评论(0) 推荐(0) 编辑
摘要: 桥接模式 在设计一个 Js API 时,可用来弱化它与使用它的类和对象之间的耦合 1. 事件监听器的回调函数 2. 桥接性函数:特权函数 3. 用桥接模式联结多个类 4. 构建 XHR 连接队列 5. 桥接模式的利与弊 利: 将抽象与其实现隔离开,有助于独立地管理软件的各个部分 Bug更容易查找 促 阅读全文
posted @ 2018-03-02 11:28 另一个小菜头 阅读(174) 评论(0) 推荐(0) 编辑
摘要: 工厂模式 1. 简单工厂 简单工厂:使用一个类或对象封装实例化操作 假如我们有个自行车商店类 ,它提供了销售自行车的方法可以选择销售两类自行车 ,`ComfortCruiser`,那么确定要销售那种自行车就可以通过简单工厂来实现。 注意:后面的代码中会用到 "Javascript设计模式(1)" 里 阅读全文
posted @ 2018-03-02 01:23 另一个小菜头 阅读(166) 评论(0) 推荐(0) 编辑