03 2018 档案
摘要：关于 promise 吃到错误的理解 下面的内容需要对浏览器原生支持的 promise 的基本用法有了解，如果你还不知道 promise 和 promise 的 catch 方法，你可能需要先在 "这里" 了解一下。 在 阮一峰大神的 "《ECMAScript 6 入门》" 关于 Promise 对
阅读全文
摘要：一、后台跨域 V1 1. 后台设置 1. 配置过滤器，为所有的响应头都加上 下面四个字段 Access Control Allow Origin: ' 具体源 ' ：允许通过跨域访问后台服务器的源。如果需要使用section来标示不同的会话，则需要前端设置允许cookie（因为浏览器是通过发送coo
阅读全文
摘要：flex 布局 1. 图例 2. 容器的属性 1) flex direction 属性 属性决定主轴的方向（即项目的排列方向） row（默认值）：主轴为水平方向，起点在左端 row reverse：主轴为水平方向，起点在右端 column：主轴为垂直方向，起点在上沿 column reverse：主
阅读全文
摘要：改造 vue cli 脚手架 注意，这里使用的 vue cli 的版本为 2.8.2，不同版本的 vue cli 可能会有些许不一样。 一、配置多页面 项目开发目录： 需要注意一点，每个页面的文件夹命名、文件夹里面的入口 js 文件名及 hmtl 模板文件名应该一致，这样就可以使用一个函数来自动配置
阅读全文
摘要：CSS3 选择器 一、css hack 让指定的浏览器识别该 css 规则，其他浏览器将忽略改规则 1. : ie6, ie7 2. : ie7 3. : ie6 4. : ie8 5. : ie6~ie9 二、选择器 1. 基本选择器 | 选择器 | 含义 | | | | | | 通用元素选择器，
阅读全文
摘要：一、离线检测 1. 属性 navigation.onLine 返回 true / false 2. 事件 1. online事件，从离线变为在线时触发 2. offline事件，从在线变成离线时触发 二、应用缓存 HTML5 的应用缓存（application cache），简称 appcache，
阅读全文
摘要：一、跨文档消息传递 1. postMessage 发送信息 向当前页面的 `` 元素传送数据 接收信息 该方法触发接收方 window 对象的 message 事件，并且传递个 onmessage处理程序的 包括以下三方面信息 data：postMessage()第一个参数传过来的 message，
阅读全文
摘要：CSS3 Tranform 3D 的应用 一、perspective 属性 1. 作用： 设置元素被查看位置的视图，类似于眼睛到屏幕的距离，一般跟 共同作用在一个父元素上 属性值 = 屏幕分辩率 屏幕和我们眼睛的距离 当为元素定义 perspective 属性时，其子元素会获得透视效果，而不是元素本
阅读全文
摘要：输入框与显示框 之前做一个项目的时候需要实现怎么一个场景，有一个做题网站，需要有一个输入框和一个显示框。 输入框可以给用户输入简答题答案，为了让用户有更好的输入体验，需要可以支持 换行符 ，并且在数据的数据行数超过原来设定好的输入框的高度时，输入框的 高度自动增加 ，让用户能在屏幕上尽量多的看到其输
阅读全文
摘要：Vue 非父子组件通信方案 概述 在 Vue 中模块间的通信很普遍 如果是单纯的父子组件间传递信息，父组件可以使用 "props" 将数据向下传递到子组件，而在子组件中可以使用 "events" （父组件需要先监听对应子组件触发的事件） 向父组件传递信息。 但是当我们需要进行非父子组件间的通信或者是
阅读全文
摘要：观察者模式 1. 介绍 发布者与订阅者是多对多的方式 通过推与拉获取数据：发布者推送到订阅者或订阅者到发布者那边拉 使并行开发的多个实现能彼此独立地进行修改 其实我们在前端开发中使用到的时间监听就是浏览器实现的观察者模式 2. 示例：订阅报纸 3. 示例：动画 里面有个 类提供了三个可以被订阅的观察
阅读全文
摘要：享元模式 1. 介绍 一种优化模式 适合解决因创建大量类似对象而累积性能问题 javaScript 代码可能很快就用光浏览器的内容，通过把大量独立对象转化为少量共享对象，可以降低运行 Web 应用所需的资源数量。 对一连用上几天也不会重新加载的大型应用系统比较有用，对打开时间短的小型网页作用不大 J
阅读全文
摘要：装饰者模式 1. 作用： 可用来透明地把对象包装在具有同样接口的另一对象之中，这样可以给一个方法添加一些行为，然后将方法调用传递给原始对象。 可用于为对象增加功能，用来代替大量子类。 装饰者对其组件进行了透明包装，二者可以互换使用，因为他们 实现了同样的接口 2. 例子：自行车 3. 装饰者模式与组
阅读全文
摘要：适配器模式 1. 作用： 协调两个不同的接口 2. 适用场景 适配器适用于客户期待的接口与现有 API 提供的接口不兼容这种场景。他只能用来协调语法上的差异问题。适配器所适配的两个方法执行的应该是类似的任务，否则的话他就解决不了问题。 3. 适配器的利与弊： 利： 有助于避免大规模的改写现有的客户代
阅读全文
摘要：门面模式 门面模式(Facade Pattern)：他隐藏了系统的复杂性，并向客户端提供了一个可以访问系统的接口。这种类型的设计模式属于结构性模式。为子系统中的一组接口提供了一个统一的访问接口，这个接口使得子系统更容易被访问或者使用。 1. 作用： 简化类的接口 消除类与使用它的客户代码之间的耦合
阅读全文
摘要：组合模式 1. 适合使用组合模式的条件： 存在一批组织成某种层次体系的对象，如树形结构（具体的结构在开发期间可能无法得知） 希望对这批对象或其中的一部分对象实施一个相同的操作 2. 注意点： 组合对象与其所有子对象具有相同的接口，但是叶对象并没有继承其上一级组合对象，不是超类与子类的关系 3. 例子
阅读全文
摘要：桥接模式 在设计一个 Js API 时，可用来弱化它与使用它的类和对象之间的耦合 1. 事件监听器的回调函数 2. 桥接性函数：特权函数 3. 用桥接模式联结多个类 4. 构建 XHR 连接队列 5. 桥接模式的利与弊 利： 将抽象与其实现隔离开，有助于独立地管理软件的各个部分 Bug更容易查找 促
阅读全文
摘要：工厂模式 1. 简单工厂 简单工厂：使用一个类或对象封装实例化操作 假如我们有个自行车商店类 ，它提供了销售自行车的方法可以选择销售两类自行车 ，`ComfortCruiser`，那么确定要销售那种自行车就可以通过简单工厂来实现。 注意：后面的代码中会用到 "Javascript设计模式(1)" 里
阅读全文
摘要：方法的链式调用 1. 调用链的结构 链式调用的核心就是在调用方法中返回调用该方法的对象的引用，即 下面我们模范 JQuery 来实现一个简单的链式调用接口，通过 $() 方法获取元素对象，并提供三个链式调用方法 ，`setStyle addEvent` javascript (function()
阅读全文
摘要：单体模式 1. js最简单的单体模式 对象字面量：把一批有一定关联的方法和属性组织在一起 2. 拥有私有成员的单体 2.1 使用下划线 下面实现一个单体用于对字符串进行分割并返回分割后字符串组成的数组，它有三个参数：（要分割的字符串, 分割的标志字符串, [是否先对字符串进行去空格符处理]），这个例
阅读全文
摘要：本文是学习了《JavaScript设计模式》（谢廷晟 译）做的学习笔记 一、JavaScript的灵活性 1. 普通 functon <! more 2. 类 3. 为实例创建方法 4. 弱类型语言 原始数据类型按值传递，其他数据类型按引用传递 javascript 类型系统可以分为 标准类型 和
阅读全文
浙公网安备 33010602011771号