采用模式时必须要考虑到这么做是否有意义，绝对不能为了使用模式而使用模式。

策略模式

策略模式定义了算法族，分别封装起来，让它们之间可以互相替换，此模式让算法的变化独立于使用算法的客户。

场景：模拟鸭子游戏。游戏中会出现各种鸭子，一边游泳戏水，一边呱呱叫。

封装变化的代码

找出应用中可能需要变化之处，把它们独立出来，不要和那些不需要变化的代码混在一起。

把会变化的部分取出并封装起来，以便以后可以轻易地改动或扩充此部分，而不影响不需要变化的其他部分。

针对接口编程

针对接口编程，而不是针对实现编程。

”针对接口编程“ 真正的意思是 ”针对超类型（supertype）编程“。

多用组合，少用继承

使用组合建立系统具有很大的弹性，不仅可将算法族封装成类，更可以 “在运行时动态地改变行为”，只要组合的行为对象符合正确的接口标准即可。

1.flex布局，无需考虑父子宽高

1
2
3
4

/* 父元素设置 */
display: flex;
justify-content: center;
align-items: center;

2.相对定位+transform，无需考虑父子宽高

1
2
3
4
5

/* 子元素设置 */
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);

3.display：table-cell

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

.parent {
  width: 500px;
  height: 500px;
  background-color: pink;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}
.child {
  width: 200px;
  height: 200px;
  background-color: skyblue;
  display: inline-block;
}

查询不存在对象的属性会报错，如果 . 的左边是 null 或 undefined，则属性访问表达式会失败。因此在写类似 `book.author.sername 这样的表达式时，要确保 book 和 book.author 是有定义的。以下是两种防止这类问题的写法：

1

surname = book && book.author && book.author.surname

1

let surname = book?.author?.surname

如果想迭代对象的属性，可以使用 for/in 循环，或者基于 Object.keys() 方法的结果使用 for/of :

1
2
3
4
5

let o = {x:1, y:2, z:3}
let keys = ''
for(let k of Object.key(o)){
    keys += k
}

也可以像下面这样迭代每个键对应的值：

1
2
3
4
5

let o = {x:1, y:2, z:3}
let sum = 0
for(let v of Object.values(o)){
    sum += v
}

解构赋值，ES6 新增语法，以下是解构赋值的一些示例代码：

1
2
3

let [x,y] = [1,2]
[x,y] = [x+1,y+1]
[x,y] = [y,x]

解构赋值让使用返回数组的函数变得异常便捷：

1
2
3
4
5
6
7
8
9
10

function toPolar(x, y){
    return [Math.sqrt(x*x+y*y), Math.atan2(y,x)]
}

function toCartesian(r, theta){
    return [r*Math,cos(theta), r*Math.sin(theta)]
}

let [r,theta] = toPolar(1.0, 1.0)
let [x,y] = toCartesian(r,theta)

遍历一个对象所有属性的名/值对：