JavaScript学习笔记（三）ES6的各种骚操作合集

前言

在公司做项目，看和写业务代码的时候，我发现公司的业务代码用到了非常多除了箭头函数和let这样基本的ES6语法糖之外的其他语法糖。用起来确实非常方便，而且很省事，代码效率很高。所以趁着代码提测，整理这段时间的工作，顺便做一些产出。

（一） 函数解构（浅拷贝）

不得不说，这是一个非常好用的方法。
目前遇到的主要的解构场景有：

1、对象解构

——从一个对象中拿出某一个属性的所有取值构成的对象数组

const { eventLevelTrouble: EVENT_LEVEL } = window.$sti_dict;

在这段代码中，需要取出window.$sti这个对象的eventLevelTrouble属性中所有的对象组成的数组。
此时使用ES6的对象解构的方法进行简便的取值，并将取出的对象数组放入自定义的EVENT_LEVEL上

2、数组解构

语法也是非常简单

var arr = ["one", "two", "three", "four"];
var [first, second] = arr; //解构开始的两个元素
var [,,third, four] = arr; //解构最后的两个元素 【行2】
var [one, two, three, four] = arr //解构所有元素

遇到不想解析的用逗号隔开就ok了

3、解构赋值

let a, b, c, d;
a = 2;
b = 3;
c = { id: 4 };
d = 5;

直接写成：

let a, b, c, d;
[a, b, c, d] = [2, 3, { id: 4 }, 5];

4、解构与默认值不得不说的事情

在一般情况下，我们对默认值的写法是利用||操作进行的：

let name = person.name || "default name"; // and so on

但是一旦用到了解构的语法，这个操作的实现就变得简单了许多：

let {name: myFullName = "default name"} = obj;

但是需要注意的是，数组参数解赋值的时候不能传入undefined的参数，否则会抛出异常

		function f([ x=2, y=3, z ]) {
			trace(x + " " +y + " " + z + "\n");
		}
		
		//f();//# Exception: f: cannot coerce undefined to object!
		f([1]);//1 3 u