箭头函数
箭头函数和普通函数的区别
//基本格式
//普通函数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);