联系QQ 284710375
首页 > 技术分享 > JavaScript
收藏

js箭头函数使用方法及特性2023-08-31 15:27:49

大潇博客 原创文章,转载请标明出处

JS箭头函数有几种不同写法

写法一

var fun = (m,n) => {

return m+n;

}

console.log(fun(5,6))


写法二

var fun = () => {

      return 'fun';

}

没有参数时,保留括号


写法三

var fun = data => {

      return data;

}

console.log(fun('22'))

当只有一个参数时,可省去括号,上面的写法等同于

var fun = (data) => { return data; }


写法四

var fun = data => data;

console.log(fun('33'))


var fun = data => data==44?'yes':'no';

console.log(fun('44'))

当函数体只有一个表达式时,可省去括号和return,上面的写法等同于

var fun = data => {

      return data;

}


var fun = data => {

      return data==44?'yes':'no';

}


还有一种匿名函数的写法

var n=1;

var m=setInterval(()=>{

      console.log(n);n++;

      if(n==10)clearInterval(m);

},1000);


还有需要注意的是this指向的问题

js中this的指向有很多种情况,this指向谁,取决于函数如何调用,但箭头函数的this指向window,比如下面

var name = "最外层";

var obj = {

      name: "对象内",

      fun1: function(){

            console.log(this.name)

      },

      fun2: () => {

            console.log(this.name)

      },

      fun3: () => {

            console.log(name);

      }

}

fun4 = () => console.log(this.name);

fun5 = () => console.log(name);

obj.fun1(); //对象内

obj.fun2(); //最外层

obj.fun3(); //最外层

fun4(); //最外层

fun5(); //最外层


打赏

阅读排行

大家都在搜

博客维护不易,感谢你的肯定
扫码打赏,建议金额1-10元
  • 15601023311