ES6——函数-箭头函数
Posted sylys
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了ES6——函数-箭头函数相关的知识，希望对你有一定的参考价值。
箭头函数：
1、普通函数
function 函数名()...
2、箭头函数
注意：
1）如果只有一个返回值，return可以省略；
let arr = [12,5,8,99,33,14,26];
arr.sort(function(a,b)
return a-b; //从小到大输出 = 数组顺序输出
);
alert(arr);
// 输出：5,8,12,14,26,33,99
// 箭头函数：
let arr = [12,5,8,99,33,14,26];
arr.sort((a, b)=>a-b); // 只有一个返回值，return、可以省
alert(arr);
//输出：5,8,12,14,26,33,99
2）如果只有一个参数，()可以省略；
let show = function(a)
return a*2;
alert(show(2));
//输出：4
//箭头函数：
let show = a=>
return a*2;
// let show = a=>a*2;
alert(show(2));
// 输出：4
3）引入箭头函数有两个方面的作用：更简短的函数并且不绑定this；
具体请参考：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_functions
3、举例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<!--
1、sort() 方法用原地算法对数组的元素进行排序，并返回数组。默认排序顺序是在将元素转换为字符串，然后比较它们的UTF-16代码单元值序列时构建的（如果省略，元素按照转换为的字符串的各个字符的Unicode位点进行排序。）-->
</head>
<body>
<script>
/*
函 数 : function 函数名()...
箭头函数:()=>...
注意：
1、如果只有一个参数，()可以胜略；
2、如果只有一个return，可以省略；
3、引入箭头函数有两个方面的作用：更简短的函数并且不绑定this；
*/
//如：function show()... ---> let show=()=>... ---> ()=>...
/*例子：
例1：
window.onload = function()
alert(‘abc‘);
;
输出：abc
//箭头函数
window.onload=()=>
alert(‘aaa‘);
;
输出：aaa
==================================================================
例2：
let show1 = function()
alert(‘abc‘);
;
//箭头函数
let show2 = ()=>
alert(‘abc‘);
;
show1();// 输出：abc
show2();// 输出：abc
=================================================================
例3：
let show1 = function(a,b)
alert(a+b);
;
//箭头函数：
let show2 = (a,b)=>
alert(a+b);
;
show1(1,2);// 输出：3
show2(1,2);// 输出：3
=================================================================
例4：
// let arr = [12,5,8,99,33,14,26];
// arr.sort();
// alert(arr);//输出：12,14,26,33,5,8,99
let arr = [12,5,8,99,33,14,26];
arr.sort(function(a,b)
return a-b; //从小到大输出 | = 数组顺序输出
);
alert(arr);
// 输出：5,8,12,14,26,33,99
//箭头函数：
let arr = [12,5,8,99,33,14,26];
arr.sort((a, b)=>a-b); // 只有一个返回值，可以省
alert(arr);
//输出：5,8,12,14,26,33,99
==================================================================
例5：
let show = function(a)
return a*2;
alert(show(2));
//输出：4
//箭头函数：
let show = a=>
return a*2;
// let show = a=>a*2;
alert(show(2));
// 输出：4
*/
</script>
</body>
</html>
以上是关于ES6——函数-箭头函数的主要内容，如果未能解决你的问题，请参考以下文章