箭头函数
ES6中新增的定义函数的方式 。
定义
普通语法：
() => {} const fn = () => {}
函数体中只有一句代码，且代码的执行结果就是返回值，可以省略大括号和关键字
function sum(num1, num2) { return num1 + num2; }const sum = (num1, num2) => num1 + num2;
如果形参只有一个，可以省略小括号
function fn (v) {return v;} const fn = v => v;
实际应用
// 定义一个普通的箭头函数const fn1 = () =>{console.log("这是一个普通的箭头函数");}// 调用fn1();// 函数体中只有一句代码，且代码的执行结果就是返回值，可以省略大括号和return关键字const fn2 = (num1, num2) => num1 + num2;console.log(fn2(2, 3));// 如果形参只有一个，可以省略小括号const fn3 = num => {console.log(num);}fn3(20);
this关键字
箭头函数不绑定this，箭头函数没有自己的this关键字，如果在箭头函数中使用this，this关键字将指向箭头函数定义位置中的this
// 箭头函数不绑定this 箭头函数没有自己的this关键字 如果在箭头函数中使用this this关键字将指向箭头函数定义位置中的thisfunction fn4(){console.log(this);return () =>{console.log(this); // 这里的this会指向fn4里面的this}}const obj = {name : "zhangsan",age : 24}const fn5 = fn4(); // Windowconst fn6 = fn4.call(obj); // objfn5(); // Windowfn6(); // obj
注意：对象是不能产生作用域的，所以在对象中创建箭头函数，这时候箭头函数的this指向的是对象外面的this 。（这里对象外面的this指向）
var age = 100;var obj = {age: 20,say: () => {alert(this.age)}}obj.say(); 打印100
剩余参数
剩余参数语法允许我们将一个不定数量的参数表示为一个数组 。
function sum (first, ...args) {console.log(first); // 10console.log(args); // [20, 30] }sum(10, 20, 30)...args就代表剩余参数，但是打印不需要添加三个点// 定义一个可以随意添加参数的sum方法let sum = (...agrs) => {let total = 0;// 只有一个形参，所以item两边的括号省略agrs.forEach(item => {total += item;})return total;}sum(10, 20, 30);
剩余参数和解构配合使用
【ES5、ES6自学笔记】 // 剩余参数和解构配合使用let ary1 = ['张三' , '李四', '王五'];let [s1, ...s2] = ary1;console.log(s1);// 张三console.log(s2);// [李四，王五]
内置对象扩展 扩展运算符
扩展运算符(…)可以将数组或者对象转为用逗号分隔的参数序列 。
// 扩展运算符可以将数组或者对象转为用逗号分隔的参数序列 。let arr1 = [1, 2, 3];console.log(...arr1);// 1, 2, 3// 合并数组let arr2 = [2, 3, 4];let arr3 = [3, 4, 5];// 方法1：let arr4 = [...arr1, ...arr2, ...arr3];console.log(arr4);// [1, 2, 3, 2, 3, 4, 3, 4, 5]// 方法2：arr2.push(...arr3);console.log(arr2);// [2, 3, 4, 3, 4, 5]// 利用扩展运算符将伪数组转换为真正的数组var oDivs = document.getElementsByTagName('div');console.log(oDivs)var ary = [...oDivs];ary.push('a');console.log(ary);
Array扩展方法 Array.from()
Array.from()方法可以将伪数组转换成真正的数组
// 定义一个伪数组，伪数组的序号也要从0开始let wsz = {"0" : "2","1" : "4","2" : "6","length" : 3}// 调用方法将伪数组转换成真正的数组let sz = Array.from(wsz);console.log(sz);