ES6-函数新增特性

雨点打透心脏的1/2处 2022-05-15 04:06 417阅读 0赞

**1.函数参数的默认值**

<script>
    function fn(a='小丁',b){
        console.log(a+"和"+b+""写代码);
    }
    fn('晓飞'，'小丽');//输出晓飞和小丽写代码；
    fn('小丽');//暑促小丽和undefined写代码，实参赋值给形参是从前往后，所以有默认值的一般写在后面 fn(a, b='小丁')
    </script>

**2. rest参数**

Rest参数接收函数的多余参数，组成一个数组，放在形参的最后，形式如下:

function func(a, b, ...theArgs) {
        // ...
    }

rest参数是Array的实例，可以直接应用forEach方法，arguments类数组对象，不能使用forEach

例子：

<script>
    function sum(){
       let sum = 0;
       args.forEach(function(val){
          sum += val;
       })
       return sum;
    }
    console.log(sum(1,2,3,4,5));
    </script>

**3.箭头函数**

（1）特点：

a. 简化函数的声明；例子：

<script>
    let fn = val = >val;
    //等同于
    let fn =function(val){
      return val;
    }
    console.log(fn(200));//输出200
    </script>

b. 参数超过一个要加（）

<script>
    let sum = (num1,num2) => num1+num2;
    console.log(sum(1,5));//输出6
    </script>

c. 函数体超过一行加\{\}，并写上return

例子1：

<script>
        let str =num=>{
            console.log(num);
            console.log(num+2);
            return 200;
        }
        str(2);
    </script>

例子2：上面的例子当加上\{\}没加return时，显示undefined

<script>
    let sum = (num1,num2) => {return num1+num2};
    console.log(sum(1,5));//输出6
    </script>

（2）箭头函数的作用：

a. 简化回调函数；

例子：js实现排序：

<script>
        let numList = [10,3,6,23,100,8,235];
        numList.sort();//按位比较，并不是按照数字大小比较，所以进行回调
    
        //JS
        numList.sort(function(a,b){//a b两个数进行比较
            return a-b;
    
        })
        console.log(numList);
    </script>

例子2：使用箭头函数：

<script>
        let numList = [10,3,6,23,100,8,235];
        //箭头函数
        numList.sort((a,b) => a-b);
        console.log(numList);
    </script>

b. 箭头函数中的this是函数声明时所在的对象

例子：

<script>
      let obj = {
        num:4;
        fn:function(){
            var f=function(){
                console.log(this);//输出windoow，这个this是指函数声明所属的对象
            }
    
            let f =() =>{
                console.log(this);//输出obj,this是函数声明时所在的对象
            }
        }
      }
    </script>

**4.函数参数的尾逗号（ES2017）**

<script>
      function demo(a,b,){//后面的逗号
         console.log(a,b);
    }
    demo(10,20,);
    //再如
    let obj{
        num : 100,
        age : 20,//此时的逗号
    }
    </script>

发表评论取消回复

表情：

评论列表（有 0 条评论，417人围观）

还没有评论，来说两句吧...

相关阅读

相关 H5、C3及ES6新增特性。

H5新标签： `header`，`footer`，`nav`，`article`，`section`，`datalist`（`input`里定义`list=id`，`dat

淩亂°似流年/ 2023年02月23日 08:41/ 0 赞/ 7 阅读

相关 ES11新增特性

文章目录一、私有属性二、Promise.allSettled 1. Promise.allS

深藏阁楼爱情的钟/ 2022年12月30日 13:38/ 0 赞/ 55 阅读

相关 es6新增详解

文章目录一、es6是什么 1. 官方回答 2. 本人理解二、版本新增 1. let 和 cons

矫情吗；*/ 2022年12月20日 03:28/ 0 赞/ 211 阅读

相关 ES6新增特性小结

ES6新增特性 1. 变量 var :可重复声明；函数级作用域； const ：不可重复声明；块级作用域；常量 le

桃扇骨/ 2022年12月19日 08:56/ 0 赞/ 136 阅读

相关 ES6新增 Promise

promise 作用 1.解决延期问题 2.避免回调层级过深问题 promise代码示例： //promise 解决了层级过深的问题，实现承诺

深碍√TFBOYSˉ_/ 2022年12月18日 00:48/ 0 赞/ 184 阅读

相关 ES6新增特性

-------------------- let和const命令 let和var的区别 var a = []; for (var i = 0; i

我就是我/ 2022年11月27日 10:15/ 0 赞/ 260 阅读

相关 JS_ES2021新增特性

features String.prototype.replaceAll() Promise.any WeakRef &&=, ||= and ?

男娘i/ 2022年09月12日 11:43/ 0 赞/ 215 阅读

相关 ES6-对象的新增特性

1.属性的简介表示法例子： <script> let username = "Mark"; let userage = 100;

╰+哭是因爲堅強的太久メ/ 2022年05月15日 04:07/ 0 赞/ 236 阅读

相关 ES6-函数新增特性

1.函数参数的默认值 <script> function fn(a='小丁',b){ console.log(a+"和"+b+""写代码);

雨点打透心脏的1/2处/ 2022年05月15日 04:06/ 0 赞/ 418 阅读

相关 ES6-字符串新增特性

1.模板字符串（1）定义比较长，复杂的字符串，如html代码模板字符串中写 \` 需要转义，例子： <script> let html

怼烎@/ 2022年05月15日 04:06/ 0 赞/ 411 阅读