箭头函数

最新推荐文章于 2023-11-26 23:49:39 发布

&XYZ&

最新推荐文章于 2023-11-26 23:49:39 发布

阅读量1.3k

点赞数

分类专栏： ES6

本文链接：https://blog.youkuaiyun.com/JEFF_luyiduan/article/details/91359175

版权

ES6 专栏收录该内容

40 篇文章

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>箭头函数</title>
</head>
<body>
    <script>
        /*
        运用箭头函数：
        首先要去掉function
        然后在去掉function的第一个括号后面加上胖箭头（=>）
        */
        const numbers =[1,2,7,4,5];
        //没有运用箭头函数
        const double =numbers.map(function(number){
            return number*2;
        });

        console.log(double);

        //运用了箭头函数
        const double1 =numbers.map(number=>{//多个参数带括号，一个参数可以去掉括号，不带参数保留括号
            return number*2;//显示返回
        });
        console.log(`我是一个参数的：${double1}`);

        const double2 =numbers.map((number,index)=>{//多个参数带括号，一个参数可以去掉括号，不带参数保留括号
            return `${index}: ${number*2}`;//显示返回
        });
        console.log(`我是多个参数：${double2}`);

        const double3 =numbers.map(()=>{//多个参数带括号，一个参数可以去掉括号，不带参数保留括号
            return "hello world";//显示返回
        });
        console.log(`我是没有带参数的：${double3}`);



        /*
        隐式返回
        去掉return
        去掉胖箭头（=>）后面的{}
        */
        const double4=numbers.map(number=>number*2);//隐式返回
        console.log(`我是隐式返回：${double4}`);

        /*
        箭头函数是匿名函数
        */
        const greet=name=>{console.log(`hello ${name}`)};
        greet("XYZ")

    </script>
</body>
</html>