js 新手常用小技巧 简写语法总结归纳

变量简写

var a ;
var b=8;
var c;
//等价于
var a,
	b=8,
	c;

对象属性简写

当对象的属性与值是同一个值时

let obj ={a:a,b:b}
// 等价于
let obj = {a,b}

拓展运算符

let a = [1,2,3];
let b = [4,5,6];

//如果说a,b合并，ES5的方法必然是使用a.concat(b),如果使用...不是更好吗？
let c = [1,2,3,...b]

//还有就是如果两个对象之间相互复制，使用拓展运算符就会特别的简短
//比如
let w = [1,2]
let t = [...w]
//此时的w,t是不会相互干扰的

默认参数

注意： 不传值和undefined 将使用默认值，null是不会使用默认值的

function a(c=10) {
	console.log(c);
}
a() // 10
a(null) // null
a(undefined) // 10

解构

//对象的方式
var a={b:10,c:5}

var c = a.c;
var d = a.c;
// 等价于
var {c} = a;
var {c:d} = a;

//数组的方式
var  d = [1,3,5,7];
var e = d[1];
//等价于
var [,e] = d;

字符串模板

const a = 'You have logged in as ' + first + ' ' + last + '.'
const b = 'http://' + host + ':' + port + '/' + database;
//等价于
const a = `You have logged in as ${first} ${last}`;
const b = `http://${host}:${port}/${database}`;

判断语句简写

1 单个判断if

// 如果a为真，执行c方法
if (a) {
	c()
};
// 等价于
a && c();

// 如果a不为真，执行c方法
if (!a) {
	c()
};
// 等价于
a || c();

2 if else组合判断（三元运算）

// a为真执行b方法 否则执行c
if (a) {
	b();
} else {
	c();
}
//等价于
a ? b() : c();

箭头函数

箭头函数当参数为一个时，可省略（）
当函数体只包含一个表达式，可省略{}和return
注意：箭头函数的this总是指向词法作用域，也就是外层调用者

function a(name) {
  console.log('Hello', name)
}

list.forEach(function (item) {
  console.log(item)
})
//等价于
const a = name => console.log('Hello', name)
list.forEach(item => console.log(item))