Toypipi's blog

发表于 分类于 本文字数： 192 阅读时长 ≈ 1 分钟

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;
}
阅读全文 »

发表于 更新于 分类于 本文字数： 83 阅读时长 ≈ 1 分钟

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

1
surname = book && book.author && book.author.surname
1
let surname = book?.author?.surname

发表于 更新于 分类于 本文字数： 244 阅读时长 ≈ 1 分钟

如果想迭代对象的属性，可以使用 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
}
阅读全文 »

发表于 更新于 分类于 本文字数： 268 阅读时长 ≈ 1 分钟

解构赋值，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)

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

阅读全文 »

发表于 分类于 本文字数： 116 阅读时长 ≈ 1 分钟

dependencies

指定项目依赖，值为包名加上版本号。

版本号可以指定一个范围，有以下语法。

  • version：精确的版本，例如 1.0.0
  • >version：大于 version
  • >=version：大于等于
  • <version: 小于
  • <=version: 小于等于
  • ~version: 允许补丁级别的变化，例如 ~1.2.3 表示 >=1.2.3 <1.3.0
  • ^version：允许不更改最左侧非0版本号数字的变化，例如 ^1.2.3 表示 >=1.2.3 <2.0.0
  • 1.2.x
  • http://...
  • *
  • version1 - version2 等同于 >=version1 <=version2
阅读全文 »
0%