zoukankan      html  css  js  c++  java
  • 箭头函数语法

    箭头函数是es6语法,在js开发中常规语法常常会有this指向丢失的问题,为了解决这个问题我们通常使用箭头函数来解决它

    首先了解箭头函数的基础语法:

    1.函数中有多个参数多个表达式

      (参数1, 参数2, ...,参数n) => { 函数声明 }

    2.函数中有多个参数只有一个表达式

      (参数1, 参数2, ...,参数n) =>  函数声明  //在只有一个表达式的时候,表达式可以不加大括号{},(为了规范,一般都加大括号)

    3.函数中只有一个参数和只有一个表达式

      写法1:   参数1  =>  函数声明   //在参数只有一个的情况下,可以去掉参数的括号,只有一个表达式可以去掉表达式的大括号(为了规范,一般都加括号和大括号)

      写法2:   (参数1) => 函数声明  这样还适合于多个参数一个表达式 ,如  : (参数1,参数2, ...  => 函数声明

      写法3: 参数1  => { 函数声明 }  这样还适应于一个参数多个表达式,如  : 参数1  => { 函数声明1,函数声明2, ... }

      写法4: (参数1) => { 函数声明 }  (规范写法,这样不管是多个参数,多个表达式。还是一个参数,一个表达式,一个参数,多个表达式,多个参数,一个表达式都能使用)

    4. 没有参数的函数

      () => { 函数声明 }  在没有参数的情况下是不能省略参数的括号的

    小结综合上面语法可以得出,最好的方法还是有一个统一的规范,就是不管有多少参数和表达式,都加上括号和大括号,这样就不会出现不必要的麻烦。

    实例1:

      常规语法:function  hua (params) {

            return params  *  2;

           }

           hua( 4 ) // 输出 8

      箭头函数:var hua =  (params)  => {params * 2 }

           hua( 4 ) // 输出 8

    同样的作用,但是箭头函数能写少很多代码

    实例2:(this指向问题)

      function liang(){

        this.num = 1;

        this.timer = setInterval( () => {

          this.num ++;

          console.log(this.num);

          console.log('this==>>', this);

        },1000);

      }

      var b = new liang ();

      console.log('b==>>>', b);

      clearInterval(b.timer); //停止执行定时器(测试完之后才使用,否则上面代码不会有效果显示)

    说明:在代码中定时器使用了箭头函数,使this指向在liang函数中不会丢失,如果使用常规写法就会导致this丢失而指向window

    (但是要注意的是,如果liang函数也是使用箭头函数的写法,那么该函数的作用域就是属于window了,从而this也是指向window,所以为了有固定的作用域liang函数只能使用常规写法)。

     

  • 相关阅读:
    笔记:Struts2 的 JSON 插件
    笔记:Struts2 拦截器
    笔记:Struts2 文件上传和下载
    笔记:Struts2 文件上传和下载
    【学习总结】推荐系统-协同过滤原理
    【刷题】牛客网看到的鹅厂ML面筋-部分问题RecSys相关
    【刷题】【LeetCode】000-十大经典排序算法
    【刷题】【LeetCode】总
    【问题解决方案】pygame生成的窗口点右上角关闭按钮未响应问题的解决
    【刷题】若串 =’software’ ,其子串数目为:37
  • 原文地址:https://www.cnblogs.com/hermit-gyqy/p/11206240.html
Copyright © 2011-2022 走看看