菜鸟请教这个关于js原型链的demo

Question

<script type="text/javascript">
    function Person(name,age) {
        this.name = name;
        this.age = age;
    }
    Person.say = function(){
        alert('Person的say');
    }
    Object.prototype.say = function(){
        alert('Object原型的say');
    }
    Function.prototype.say = function(){
        alert('Function原型的say');
    }    
    Function.say = function(){
        alert('Function的say');
    }
    Person.prototype.say = function() {
        alert(this.name);
    };
    let p = new Person('月初',16);
    p.say();
</script>

这个本站的demo
为什么弹出的是月初而不是“Person的say”，哪位帮忙解释下

Answer 1

这样去说在一个对象实例化之前，这个对象其实也就是一个函数

参照你的问题 为什么弹出的是 月初 而不是 “Person的say” ？

首先你要考虑一个问题，在对象没有被实例化之前，他只是一个首字母大写的函数，那如果给函数直接定义一个 .方法的话找的是谁？

万物不变起源 万物皆对象 抛去其他的一切因素 调用 Person.say() 寻找的层级先滤清 先找 Person.say -> Function.prototype.say -> Object.prototype.say, 你可以先这样去试一下

  <script type="text/javascript">
    function Person(name, age) {
      this.name = name;
      this.age = age;
    }

    Object.prototype.say = function () {
      alert("Object原型的say");
    };
    Function.prototype.say = function () {
      alert("Function原型的say");
    };
    Function.say = function () {
      alert("Function的say");
    };
    Person.prototype.say = function () {
      alert(this.name);
    };
    // Person.say = function () {
    //   alert("Person的say");
    // };
    // let p = new Person("月初", 16);
    Person.say(); // 寻找层级 Person.say -> Function.prototype.say -> Object.prototype.say
  </script>

而如果你的对象实例化之后，这个时候其实他已经被new了，那么他就不再会是一个函数，而是一个对象，如果没有父实例，那么他的上级指向将不再会是 Function,参照下方

<script type="text/javascript">
    function Person(name,age) {
        this.name = name;
        this.age = age;
    }

    Object.prototype.say = function(){
        alert('Object原型的say');
    }
    Function.prototype.say = function(){
        alert('Function原型的say');
    }    
    Function.say = function(){
        alert('Function的say');
    }
    // Person.prototype.say = function() {
    //     alert(this.name);
    // };
    Person.say = function(){
        alert('Person的say');
    }
    let p = new Person('月初',16);
    p.say(); // alert('Object原型的say');
</script>
</html>

简单的说 Person.prototype.say != Person.say 一个是在其对象原型上挂载say方法，一个是在其方法上挂载一个say方法，而原型链查找的是 prototype 所以会出现你所说的找不到的问题