~~~ /* * ES6解構賦值 */ // let ary = [12, 23, '珠峰']; // let [a, b, c] = ary; // console.log(a, b, c); // let [a, , b] = ary; // console.log(a, b); // let [a] = ary; // console.log(a);//=>12 // let [a, ...b] = ary; // console.log(a, b);//=>a=12 b=[23, "珠峰"] 三個點在這里代表的意思： 除了前面的，把后面的統一用數組包裹起來，獲取的結果是一個數組 // let newAry=ary.slice(); // let [...newAry] = ary; //=>數組克隆 // let [, , , a] = ary; // console.log(a);//=>undefined // let [, , , a = 0] = ary; // console.log(a);//=>0 賦值默認值（如果當前項沒有解構到任何值,給一個初始值） //================[對象] // let obj = {name: 'xxx', age: 27}; // let {name, ageAA} = obj; // console.log(name, ageAA);//=>'xxx' undefined 在對象的解構賦值中， 我們需要保證左側設定的變量名和右側對象屬性名相同，這樣才可以解構出來 /* * 編譯成為ES5 var obj = { name: 'xxx', age: 27 }; var name = obj.name, ageAA = obj.ageAA; console.log(name, ageAA); */ // let {age: ageAA} = obj; // console.log(ageAA);//=>給某一個需要解構的值設置別名 （和屬性名不相同的變量名） /* var _obj = obj, ageAA = _obj.age; */ // let {sex = 0} = obj; // console.log(sex);//=>給解構的結果設置默認值 //================[實際意義] // let a = 12, // b = 13; // [b, a] = [a, b]; //=>交換兩個變量的值 // let data = { // name: 'xxx', // age: 27, // score: [ // 110, // 130, // 20 // ] // }; // let {name, score: [chinese, , english=0]} = data; // console.log(name + ' 語文:' + chinese + ' 英語:' + english); // let ajax = function ({ // url = '', // method = 'get', // data = null // } = {}) { // //=>傳遞的參數： // //1.快速獲取傳遞的值 // //2.不傳遞某一項給默認值 // //3.即使不傳遞參數也不會報錯 // console.log(url, method, data); // }; // ajax({ // url: '/getall', // method: 'get', // data: null // }); // ajax({ // url: '/getInfo' // }); // ajax(); //=======================[...] /* * 1.拓展運算符 * 2.剩余運算符 * 3.展開運算符 */ //=>對象克隆[展開運算符] // let obj = {name: 'xxx', age: 27}; // let newObj = {...obj, sex: 0};//=>展開運算符 // console.log(newObj); // let ary = [12, 23]; // let newAry = [...ary, 34]; // console.log(newAry); // let [...arr] = ary; // console.log(arr); // let ary = [12, 23, 14, 25, 35, 26]; // console.log(Math.max(...ary)); // let fn = function (...arg) { // //=>剩余預算符：把傳遞參數除了前面形參接收的以外, 其余的都存儲到ARG中,ARG是一個數組 // }; // fn(...ary);//=>fn(12, 23, 14, 25, 35, 26) 展開運算符 // let fn = function (...arg) { // arg.sort(function (a, b) { // return a - b; // }); // arg.pop(); // arg.shift(); // return eval(arg.join('+')) / arg.length; // }; // let score = fn(100, 85, 60, 89, 95, 92, 73); // console.log(score); //======================[箭頭函數] // let fn = (x, y) => { // // }; // fn(10, 20); // let fn = x => { // //=>只有一個形參，我們可以省略小括號 // }; // fn(10); // let fn = function (x, y) { // return x + y; // }; // let fn = (x = 0, y = 0) => x + y; //=>如果函數體中只有一句操作， 并且是RETURN的，我們可以省略大括號（給形參設置默認值） // console.log(fn(10, 20)); ~~~ ``` // let fn = x => y => x + y; *** // /* // var fn = function fn(x) { // return function (y) { // return x + y; // }; // }; // */ ``` ~~~ //1.箭頭函數中沒有arguments // let fn = (...arg) => { // // console.log(arguments);//=>Uncaught ReferenceError: arguments is not defined // // console.log(arg);//=>可以使用剩余運算符代替，而且ARG是一個數組 而不是一個類數組 // }; // fn(10, 20, 30, 40); // let fn = () => { // console.log(arguments);//=>Uncaught ReferenceError: arguments is not defined // }; // fn(10, 20, 30, 40); //2.箭頭函數中沒有自己的執行主體(THIS)，它的THIS都是繼承上下文中的THIS /* let obj = { fn: (function () { //=>this:window let _this = this;//=>window（自執行函數是window） return function () { // console.log(this); console.log(_this);//=>_this只是一個變量，不是私有的，找上級作用域中的 } })() }; // obj.fn();//=>this:obj 如果我想讓obj.fn執行,this也是window，該如何處理? // obj.fn.call(window);//=>this:window */ // let obj = { // fn: (function () { // //=>this:window // return () => { // console.log(this); // } // })() // }; // obj.fn();//=>this:window 箭頭函數執行和是否有點， 點前面是誰都沒關系了，因為它沒有自己的執行主體， 在箭頭函數中使用到的THIS都是直接找上下文中的THIS來使用 ~~~