ES6-函数新增特性

雨点打透心脏的1/2处 2022-05-15 04:06 546阅读 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 条评论，546人围观）

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

相关阅读

相关 ES6所有新增特性总结

ES6新增特性 let const 解构赋值模板字符串数组新增的方法字符串新增的方法函数新增的方法对象新增的方法

￡神魔★判官ぃ/ 2023年07月25日 14:05/ 0 赞/ 37 阅读

相关 ES6新增的特性

let 和 const 命令 var 之前，我们写js定义变量的时候，只有一个关键字： var var 有一个问题，就是定义的变量有时会莫名奇妙的成为全局变量。

淡淡的烟草味﹌/ 2023年07月04日 11:09/ 0 赞/ 70 阅读

相关 ES6新增特性自整理汇总

ES6对ES5相比新增属性教你从入门到放弃 1.let 和 const let：跟ES5相比，ES6增加了let，其用法类似var，但存在着较大区别：

桃扇骨/ 2023年06月29日 10:38/ 0 赞/ 1 阅读

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

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

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

相关 ES11新增特性

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

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

相关 ES6新增特性小结

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

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

相关 ES6新增特性

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

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

相关 ES6-对象的新增特性

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

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

相关 ES6-函数新增特性

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

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

相关 ES6-字符串新增特性

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

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