Skip to content

函数调用方式

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')
})()

总结

  1. Func(...params)
  2. 对象方法调用 Math.max(0,1,2)
  3. new Func(params) 构造函数调用
  4. call|apply|bind 调用
  5. 箭头函数调用
  6. DOM事件处理函数调用
  7. 立即调用函数表达式(IIFE)调用