JavaScript中跨对象赋值类方法后可直接调用的原理问询

先看看你给出的代码片段：

class Car {
  sayHi() {
    console.log('Hello from car');
  }
}

class Bird {
}

const car = new Car();
const bird = new Bird();

bird.sayHi = car.sayHi;

bird.sayHi(); //Why it works?!!!

嘿，这个问题问得特别到位！咱来一步步拆解为啥bird.sayHi()能正常跑起来：

• JavaScript里函数是「一等公民」：car.sayHi本质上就是一个独立的函数引用，你把它赋值给bird.sayHi，就相当于给bird这个对象新增了一个名为sayHi的属性，属性值就是那个能打印Hello from car的函数。函数本身不绑定在某个特定对象上，只要你把它挂到某个对象的属性上，就能通过该对象调用它。

• JS对象是动态可扩展的：和Java这类静态语言不同，JavaScript里的对象结构不是被类完全固定死的。哪怕Bird类里没定义sayHi方法，也没继承Car类，你依然可以随时给Bird的实例（也就是bird）添加新的属性和方法——这是JS这类动态语言的核心特性之一。

• 额外补充一点（虽然这个例子没用到）：如果sayHi方法里用到了this关键字，那调用时this会指向当前调用的对象（也就是bird）。但在你的代码里，sayHi只是单纯打印字符串，不依赖this，所以不管是car.sayHi()还是bird.sayHi()，输出结果都是一样的。

举个更通俗的类比：就像你有一台打印机，你可以把它从桌子A搬到桌子B，搬到B之后它照样能打印东西——函数就像这台打印机，对象就像桌子，把函数赋值给对象的属性，就相当于把打印机放到桌子上，不管哪个桌子，只要接上（调用）就能用~

备注：内容来源于stack exchange，提问作者behzad namdaryan