一些js缩写方式

一、javascript

1.1 获取多层级的对象的属性的值

// 以下在浏览器的开发者模式中可以直接尝试
var obj = {
	a: 1,
	b: {
		c: 2,
	}
}
// 最开始 - 一旦obj.b为undefined就凉凉
var a = obj.b.c
// 中间 - 如果层级更多就麻烦了
var a = obj.b ? obj.b.c : 0
// 或者
if (obj && obj.b) {
	var a = obj.b.c
}
// 现在
var a = obj.b?.c;
// 如果层级更多 a = obj.b.c.d
var a = obj.b?.c?.d

1.2 多层级的三元运算

// 以下在浏览器的开发者模式中可以直接尝试
// 可以从最里面一层开始拆解 - 最里面就是一个三元元算obj.b.c ? obj.b.c : 0
var a = obj.b ? obj.b.c ? obj.b.c : 0 : 0

1.3 if…else…的简写

// 以下在浏览器的开发者模式中可以直接尝试
// 很多书本中我都看到有说不建议适用，影响代码的可读性
// 只有 if 、 else 、else if 的代码块（大括号之间）只有单行时可以省略大括号
var a = 0;
var b = 0;
if (a < 10) b = 1
else if (a < 20 ) b = 2
else b = 3

1.4 Number()方法的简写

// 以下在浏览器的开发者模式中可以直接尝试
// 以前
var a = '1';
var num_a = Number(a);
var num_a1 = a * 1;
// 现在
var num_a2 = +a;

二、vue

2.1. vue项目中props属性

props: {
	a: {
		type: String,
		default: () => '1'
	},
	b: {
		type: Number,
		default: () => 1
	},
	c: {
		type: Array,
		default: () => []
	},
	d: {
		type: Object,
		default: () => ({})
	},
}

不定时更新…
（希望各位多给评论，不断完善，拜谢！）