【ES6箭头函数】

最新推荐文章于 2024-10-18 00:00:00 发布

木林森里没有木

最新推荐文章于 2024-10-18 00:00:00 发布

阅读量308

点赞数

文章标签： jquery

本文链接：https://blog.csdn.net/a_shun66/article/details/121676195

版权

本文详细介绍了ES6箭头函数的特点，如无`fn`命名、无`arguments`、简洁语法等，并通过实例说明其在函数定义和上下文中的行为。特别关注了箭头函数不能作为构造函数的局限。适合初学者理解箭头函数在现代前端开发中的运用。

摘要由CSDN通过智能技术生成

【ES6箭头函数】

箭头函数

箭头函数

因为现在的浏览器都是高版本的所以直接支持es6语法

1.fn函数名没有参数直接（） => 表示return

let fn = () => 123;

2.箭头函数里面没有arguments

let fn = () => arguments;

3.箭头函数里面一个参数可以省略（）

let fn = arg => arg;

4.函数体里面有多个表达式需要加{} =>不表示返回需要自己在{}里面写return

 let fn = (a, b) => { let str = a + b; return str };

5.fn is not a constructor箭头函数不可以作为构造函数使用

let obj = new fn();
console.log(obj);

<button id="dian">点我一下</button>
document.getElementById('dian').onclick = function () {
   console.log('外面的this', this)/* button */
  /* let that = this; */
  /* 箭头函数没有自己的this this是上下文的（代表是外面的this） */
       /*  箭头函数没有参数要加（） */
         setTimeout(() => {
            /*  console.log('普通函数里面的this',this) */ /* window */
            /*  console.log('里面的that',that) */  /* button */
               console.log('箭头函数里面的this',this)
            }, 1000)
        }