ES6总结 第四节 扩展运算符和箭头函数的使用

125 阅读1分钟

扩展运算符的使用

es5 没有扩展运算符时使用 (获取数组中的最大值)

const arr = [5,3,10,2,3]
console.log(Math.max.apply(null, arr))  // 10

es6 有扩展运算符时使用 (获取数组中的最大值)

const arr = [5,3,10,2,3]
console.log(Math.max(...arr))  // 10

扩展运算符和剩余运算符的异同

相同点:

扩展运算符和剩余运算符都是 ...

不同点:

剩余运算符:是把多个独立项合并到一个数组中,【通常应用在函数的形参中】
扩展运算符:将一个数组分割,并将多个项作为分离的参数传递各函数,【通常做个函数的参数使用】

箭头函数的使用

es5 中定义函数的方式

const getVal = function() {
	return 'Hello world'
}
console.log(getVal())  // Hello world

es6 中使用箭头函数定义函数(无参数)

const getVal = ()=> 'Hello world'
console.log(getVal())  // Hello world

es6 中使用箭头函数定义函数(1个参数)

const getVal = val=> val
console.log(getVal('Happy'))  // Happy

const getVal = (val) => val    //两种写法皆可
console.log(getVal('Happy')) 

es6 中使用箭头函数定义函数(2个参数)

const getVal = (val1, val2)=> val1 + val2
console.log(getVal(1, 2))  //3
 

es6 中使用箭头函数定义函数,函数中包括多个表达式

const getVal = (val)=> {
	val = val + 5
    return val
}
console.log(getVal(1))  //6
 

es5 闭包函数使用

let fn = (function(){
    return function(){
        return '12312'
    }
})()
fn()  // 12312

es6 使用箭头函数的闭包函数

let fn = (()=>{
    return () => '12312'
})()
fn()  //12312