es6箭头函数使用方法

tech2024-12-04  8

箭头函数

文章目录

箭头函数一、箭头函数的基本使用二、箭头函数参数和返回值三、箭头函数中的this的使用


提示:以下是本篇文章正文内容,下面案例可供参考

一、箭头函数的基本使用

// 箭头函数: 也是一种定义函数的方式 // 1.定义函数的方式: function const aaa = function () { } // 2.对象字面量中定义函数 const obj = { bbb() { } } // 3.ES6中的箭头函数 // const ccc = (参数列表) => { // // } const ccc = () => { }

二、箭头函数参数和返回值

// 1.参数问题: // 1.1.放入两个参数 const sum = (num1, num2) => { return num1 + num2 } // 1.2.放入一个参数 const power = num => { return num * num } // 2.函数中 // 2.1.函数代码块中有多行代码时 const test = () => { // 1.打印Hello World console.log('Hello World'); // 2.打印Hello Vuejs console.log('Hello Vuejs'); } // 2.2.函数代码块中只有一行代码 // const mul = (num1, num2) => { // return num1 + num2 // } const mul = (num1, num2) => num1 * num2 console.log(mul(20, 30)); // const demo = () => { // console.log('Hello Demo'); // } const demo = () => console.log('Hello Demo') console.log(demo());

示例:pandas 是基于NumPy 的一种工具,该工具是为了解决数据分析任务而创建的。

三、箭头函数中的this的使用

// 什么时候使用箭头 // setTimeout(function () { // console.log(this); // }, 1000) // // setTimeout(() => { // console.log(this); // }, 1000) // 问题: 箭头函数中的this是如何查找的了? // 答案: 向外层作用域中, 一层层查找this, 直到有this的定义. // const obj = { // aaa() { // setTimeout(function () { // console.log(this); // window // }) // // setTimeout(() => { // console.log(this); // obj对象 // }) // } // } // // obj.aaa() const obj = { aaa() { setTimeout(function () { setTimeout(function () { console.log(this); // window }) setTimeout(() => { console.log(this); // window }) }) setTimeout(() => { setTimeout(function () { console.log(this); // window }) setTimeout(() => { console.log(this); // obj }) }) } } obj.aaa()
最新回复(0)