vue源码分析（九）核心函数之initMethods

我们打开文件 src/core/instance/state.js，找到定义initMethods函数的代码：

function initMethods (vm: Component, methods: Object) {
  const props = vm.$options.props
  for (const key in methods) {
    if (process.env.NODE_ENV !== 'production') {
      if (typeof methods[key] !== 'function') {
        warn(
          `Method "${key}" has type "${typeof methods[key]}" in the component definition. ` +
          `Did you reference the function correctly?`,
          vm
        )
      }
      if (props && hasOwn(props, key)) {
        warn(
          `Method "${key}" has already been defined as a prop.`,
          vm
        )
      }
      if ((key in vm) && isReserved(key)) {
        warn(
          `Method "${key}" conflicts with an existing Vue instance method. ` +
          `Avoid defining component methods that start with _ or $.`
        )
      }
    }
    vm[key] = typeof methods[key] !== 'function' ? noop : bind(methods[key], vm)
  }
}

首先获取了const props = vm.$options.props实例的props属性。
紧接着对 methods 定义的方法进行遍历，对每个方法进行了3层判断。

1、必须的函数。

2、不能和 props 重名。

3、不能用下划线_和美元符号$开头。

vm[key] = typeof methods[key] !== 'function' ? noop : bind(methods[key], vm)
最后在 vm 对象上面定义了这些方法。