函数调用方式
js
function sayHello() {
console.log('Hello')
}
// 1. 普通调用
sayHello() // Hello
// ----divide line----
const person = {
name: 'Alice',
say: function() {
console.log(this.name)
}
}
// 2. 方法调用
person.say() // Alice
// ----divide line----
function Person(name) {
this.name = name
}
Person.prototype.say = function() {
console.log(this.name)
}
// 3.构造函数调用
const person = new Person('Alice')
person.say() // Alice
// ----divide line----
function greet(greeting) {
console.log(`${greeting}, ${this.name}`)
}
// 4. call | apply
const person = { name: 'Alice' }
greet.call(person, 'Hi') // Hi, Alice
greet.apply(person, ['Hi']) // Hi, Alice
// 5. bind
const Dave = { name: 'Dave' }
const bindGreet = greet.bind(Dave, 'Hey')
bindGreet() // Hey,Dave
// ----divide line----
const person = {
name: 'Alice',
say: () => console.log(this.name)
}
// 6. 箭头函数调用
person.say() // Alice
// ----divide line----
// 7. DOM 事件函数调用
document.querySelector('button').addEventListener('click', function () {
console.log('this', this)
})
// ----divide line----
// 8.立即执行函数
(function(){
console.log('IIFE executed')
})()总结
- Func(...params)
- 对象方法调用 Math.max(0,1,2)
- new Func(params) 构造函数调用
- call|apply|bind 调用
- 箭头函数调用
- DOM事件处理函数调用
- 立即调用函数表达式(IIFE)调用