箭头函数


箭头函数和普通函数的区别

//基本格式
//普通函数function (){};
//箭头函数 () =>{};
//箭头函数无需写function 这么长的单词,但是多了个箭头
//两者的共同点是圆括号和大括号,圆括号里一般放参数,大括号里一般用来放函数的主体

//箭头函数 ,实际只有一个参数的时候无需为参数添加括号,且如果只有一个表达式的时候可不添加大括号,箭头函数会自动返回箭头后面的处理结果(可直接把大括号和return去掉),只要函数里面的表达式越少,那箭头函数简单明了的特点就越明显
//不能为箭头函数命名,因为箭头函数是函数表达式 而且是匿名的

//普通函数可以是函数表达式,也可以是函数声明

//new创建构造函数

//函数内部的一个特殊对象arguments ,这个对象是一种类似数组的对象,这样在我们给函数传入参数的时候 就可像数组一样调用数组的元素或者属性,但箭头函数没有自己的arguments对象(程序不会给箭头函数创建arguments对象,毕竟匿名函数一般都是不用参数或者限定参数来执行),而普通函数因为需要进行复用 因此有arguments对象可以实现更灵活的操作。虽然箭头函数自身没有arguments对象,换句话说箭头函数不绑定arguments,但是我们还是可以实现一种让箭头函数看起来像arguments的效果

 https://www.bilibili.com/video/BV1Sp4y1U7FG/?spm_id_from=333.788.videocard.1   在仔细看看这视频


 



箭头函数的特点
1,使函数的写法更加简洁(一行写完一个函数)
2,函数返回值可以被隐式返回 (无需写return 了)
3,不重新绑定this值

  //特殊的函数 也就是括号里只有一个参数的时候 括号可以去掉,
 //但不特殊函数 也就是下面的1 和 3 ,没有参数和有两个参数的括号是不可以去掉的
 //当函数只有一行的时候,可以把return 和 花括号去掉
 //箭头函数 和 普通函数 各有各的应用场合,箭头函数无法取代普通函数的
 //当前this的值  箭头函数:不会重新绑定this值  ,普通函数:会重新绑定this值
 
 //1
 /*  function doubleValue(value){
   return value*2;
 }
 doubleValue(2);
 console.log(doubleValue(2));//4  

 //把上面的函数改成匿名函数(只有匿名函数才能改成箭头函数) 且把函数改成箭头函数
 const doubleValue = value =>value*2;
 doubleValue(2);
 console.log(doubleValue(2));//4 */


 //2
 const printName  = name => "hello"+name;
 console.log(printName("小名"));//hello小名


 //3
 const greeting = ()=>console.log("hello word"); greeting();

 //4
 const square =a =>a*a;
 console.log(square(3));//9

 //5
 const addNumbers =(a,b)=>a+b;
 console.log(addNumbers(2,5));//7

//6
const ages=[14,19,21];
const result = ages.filter(function(age){
    return age>18;
}); 
//等价下面的 箭头
const result  =ages.filter(age =>age>18);
console.log(result);


//选择出明年就年满18岁的筛选出来
//函数体内有两行,可以function删除,但花括号 和 return不能删除 因为函数体内有两行
const ages=[14,19,21];
 const result2 = ages.filter(age=>{
     const nextYearAge = age+1;
    return nextYearAge>18;
});
console.log(result2); 



const companies = ["google","huawei","samsumg"];
     const result = companies.map(company  =>company+"is a company");
    console.log(result); 

    const result =companies.map(function(company){
        return company+"is a company";
    })
    console.log(result);


//用filter 和箭头函数筛选出超过3个字母的单词
const words = ["howdy","yes","cool"];
/* const result = words.filter(function(word){
  return word.length>3;
}) */
const result = words.filter(word  => word.length>3);
console.log(result);

 
































































































posted @ 2021-02-11 00:01  沁莹  阅读(153)  评论(0)    收藏  举报