• 欢迎光临~

ES6的函数写法总结,一看就会!

开发技术 开发技术 2022-08-07 次浏览
ES6  在ES5的基础上增加了一些新的特性和写法,特别在函数写法上,增加了箭头函数

 

1.正经的函数写法

//普通的传递值的写法
function sum1(x,y) { 
    return x+y; 
} 
 
const res = sum1(2,3); 
console.log(res);
 
 
//传递对象的方式,调用时需要传递一个对象过去
function sum2({x,y,z=10}) {
    console.log(x,y,z);
}
 
 
//调用方式一
sum2({x:2,y:3})
 
//调用方式二
obj = {   
          x:2,
          y:3
       }
 
sum2(obj)

2.常量作为函数名的写法

//直接将返回值赋予常量
const sum2 = function(x,y)
{ 
    return x+y; 
} 
 
//若不写参数,默认返回的整个函数体
function(x,y)
{ 
    return x+y; 
} 
 
//传参的写法,会直接调用函数 --> 这里打印出结果:3
console.log(sum2(1,2))

3.ES6的箭头函数写法

//经典格式: 函数名 = ( 参数 ) => { 方法体 } 
const sum3 = (x,y)=>{ 
    return x+y; 
}
console.log(sum3) 
 
//当方法体只有一行时,花括号可以省略: 
const sum4 = (x,y) => x+y;  
 
console.log(sum4) 
 
//当只有一个参数时,括号可以省略: 
const sum5 = x => { 方法体 }

4.回调函数的写法

//匿名回调函数
success(function(res){
       console.log(res)
})
 
 
//箭头函数回调
success((res) => {
       console.log(res)
})
 
//参数可以为空
success(( ) => {
       console.log("success!")
})
 
 
//简写
success((res) => console.log(res) )

注意:

  1. * 箭头函数里是没有this的,只会向上一层寻找(可能是window)
  2. * 箭头函数里是没有arguments的
  3. * 箭头函数不能作为构造函数
  4. * 箭头函数不能定义原型下的方法

 

 

 

 

 

 

 

 

 

 

程序员灯塔
转载请注明原文链接:ES6的函数写法总结,一看就会!
喜欢 (0)