箭头函数:一种定义函数的方式
1.定义函数的方式 :
const aaa = function () {
}
2.对象字面量中定义函数
const obj = {
bbb: function () {
},
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
// const demo = () => {
// console.log('Hello Demo');
// }
const demo = () => console.log('Hello Demo')
什么时候用箭头函数
/ setTimeout(function () {
// console.log(this);
// }, 1000)
//
// setTimeout(() => {
// console.log(this);
// }, 1000)
// 问题: 箭头函数中的this是如何查找的了?
// 答案: 向外层作用域中, 一层层查找this, 直到有this的定义.
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
})
})
}
}