ES6解构赋值的用途
1、交换变量的值
//ES5 console.log("ES5:"); var a = 100; var b = 200; var temp; temp = a; a = b; b = temp; console.log("a = " + a); //a = 200 console.log("b = " + b); //b = 100 //ES6 var x = 100; var y = 200; [x, y] = [y, x]; console.log("交换后:"); console.log("x = " + x); //x = 200 console.log("y = " + y); //y = 100
2、从函数返回多个值_返回一个数组
1 function fun () { 2 return [1, 2, 3]; 3 }; 4 var [x, y, z] = fun(); 5 console.log(x); //1 6 console.log(y); //2 7 console.log(z); //3
3、从函数返回多个值_返回一个对象
function fun () { return { id : "007", name: "Conan", age : 28 }; }; var { id, name, age } = fun(); console.log(id); //007 console.log(name); //Conan console.log(age); //28 var { id: person_id, name: person_name, age: person_age } = fun(); console.log(person_id); //007 console.log(person_name); //Conan console.log(person_age); //28
4、函数参数的定义
// 参数是一组有次序的值 function fun ([x, y, z]) { //x = 100; //y = 200; //z = 300; }; fun([100, 200, 300]); // 参数是一组无次序的值 function fun ({id, name, age}) { //id = "007"; //name = "Conan"; //age = 28; }; fun({id: "007", name: "Conan", age: 28});
5、提取Json数据
var jsonData = { id: "007", name: "Conan", age: 28, score: { Chinese: 98, Math: 148, English: 107 } }; console.log("ES5:"); console.log("Person's Number is:" + jsonData.id); console.log("Person's Name is:" + jsonData.name); console.log("Person's age is:" + jsonData.age); console.log("Person's Chinese score is:" + jsonData.score.Chinese); console.log("Person's Math score is:" + jsonData.score.Math); console.log("Person's English score is:" + jsonData.score.English); console.log("ES6:"); let { id: number, name, age, score: score } = jsonData; console.log("Person's Number is:" + number); console.log("Person's Name is:" + name); console.log("Person's age is:" + age); console.log("Person's Chinese score is:" + score.Chinese); console.log("Person's Math score is:" + score.Math); console.log("Person's English score is:" + score.English);
6、函数参数的默认值
jQuery.ajax({ url: '/path/to/file', type: 'POST', dataType: 'xml/html/script/json/jsonp', data: {param1: 'value1'}, complete: function(xhr, textStatus) { //called when complete }, success: function(data, textStatus, xhr) { //called when successful }, error: function(xhr, textStatus, errorThrown) { //called when there is an error } }); jQuery.ajax = function (url, { async = true, beforeSend = function() {}, cache = true, complete = function() {}, crossDomain = false, global = true, // ...more config }) { // ... do stuff }; // 避免了在函数体内部再写 var foo = config.foo || 'default foo'; 这样的语句
7、遍历Map结构
var map = new Map(); map.set("id", "007"); map.set("name", "Conan"); console.log(map); console.log(typeof(map)); // 获取键名和键值 for (let [key, value] of map) { console.log(key + " is " + value); }; // id is 007 // name is Conan // 获取键名 for (let [key] of map) { console.log(key); }; // id // name for (let [, value] of map) { console.log(value); }; // 007 // Conan
8、输入模块的指定方法
const { SourceMapConsumer, SourceNode } = require("source-map");

浙公网安备 33010602011771号