观察者设计模式

一个目标对象维持着一系列依赖于它的对象，将有关状态的任何变更自动通知观察者们。在观察者模式中，观察者需要直接订阅目标对象，观察者与目标对象之间有一定的依赖关系。
有4个重要的概念

1. 目标对象（被观察者）：维护一组观察患者，提供管理观察者的方法。
2. 观察者： 提供一个更新接口，用于收到通知时，进行更新
3. 具体目标对象：代表具体的目标对象
4. 具体观察者：代表具体的观察者
   阅读全文 »

charAt()

str.charAt(n)
返回字符串的第 n 个字符，如果不在 0~str.length-1之间，则返回一个空字符串。

1
2
3

var str = "javascript";
str.charAt(2); //'v'
str.charAt(12); //''

indexOf()

indexOf(substr[,start])
返回 substr 在字符串 str 中首次出现的位置,从 start 位置开始查找，如果不存在，则返回 -1。
start可以是任意整数，默认值为 0。如果 start < 0 则查找整个字符串（如同传进了 0）。如果 start >= str.length，则该方法返回 -1，除非被查找的字符串是一个空字符串，此时返回 str.length.

1
2
3
4
5

var str = "javascript";
str.indexOf('s');   // 1
str.indexOf('s',6); // -1
str.indexOf('',11);  // 10
str.indexOf('',8);   // 8

ES5数组方法

1. 转换方法—toLocaleString()方法、toString()方法、valueOf()方法
2. 栈方法——push()方法、pop()方法
3. 队列方法——shift()方法、unshift()方法
4. 重排序方法——reverse()方法、sort()方法
5. 操作方法——concat()方法、slice()方法、splice()方法
6. 位置方法——indexOf()方法、lastIndexOf()方法
7. 迭代方法——every()方法、filter()方法、forEach()方法、map()方法、some()方法
8. 归并方法——reduce()方法、reduceRight()方法

转换方法

1. toString()方法返回由数组中每个值的字符串形式拼接并且以逗号相隔的字符串
2. valueOf()方法返回的还是数组
3. toLocaleString()方法也会返回一个数组值以逗号相隔的字符串，但与toString()方法不同的是在返回日期对象时格式不同。
   阅读全文 »

三栏自适应布局,左右两侧300px,中间宽度自适应

float (左右浮动,中间不用给宽,设置margin左右留出位置)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

.wrapper {
    height: 100px;
}
.left {
    float: left;
    width: 300px;
    height: 100%;
    background: red;
}
.right {
    float: right;
    width: 300px;
    height: 100%;
    background: yellow;
}
.content {
    background: skyblue;
    height: 100%;
    margin: 0 300px;
}
//html部分,center放到后面
<div class="wrapper">
    <div class="left">left</div>
    <div class="right">right</div>
    <div class="content">content</div>
</div>

水平居中Horizontally

inline或inline-*元素水平居中

你可以轻松的在一个 block 元素中水平居中一个 inline 元素，以下代码对 inline，inline-block，inline-table 和 inline-flex 等有效

1
2
3
4
5
6
7
8
9
10
11
12
13

.parent {
  text-align: center;
}
.child {
    inline;
    //inline-block;
    //inline-table;
    //inline-flex
}
<div class="parent">
    <div class="child"></div>
</div>

导航守卫

有的时候，我们需要通过路由来进行一些操作，比如最常见的登录权限验证，当用户满足条件时，才让其进入导航，否则就取消跳转，并跳到登录页面让其登录。
为此我们有很多种方法可以植入路由的导航过程：全局的, 单个路由独享的, 或者组件级的,

全局守卫

vue-router全局有三个守卫：

1. router.beforeEach 全局前置守卫 进入路由之前
2. router.beforeResolve 全局解析守卫(2.5.0+) 在beforeRouteEnter调用之后调用
3. router.afterEach 全局后置钩子 进入路由之后
   阅读全文 »