`ES6`为什么会输出这个结果,程序是怎么执行的,有大佬可以解释一下吗?

作者站长头像
站长
· 阅读数 7

ES6为什么会输出这个结果,程序是怎么执行的,有大佬可以解释一下吗?

class Parent {
  static myMethod(msg) {
    console.log('static', msg);
  }

  myMethod(msg) {
    console.log('instance', msg);
  }
}

class Child extends Parent {
  static myMethod(msg) {
    super.myMethod(msg);
  }

  myMethod(msg) {
    super.myMethod(msg);
  }
}

Child.myMethod(1); // static 1

var child = new Child();
child.myMethod(2); // instance 2
回复
1个回答
avatar
test
2024-06-20

static表示这个属性/方法属于这个类本身,而不会被实例所拥有,也就是说Child.myMethod调用的是static标识的myMethodnew Child().myMethod调用的是没有static的那个myMethod,如果Child只有static myMethod,那new Child().myMethod调用就会报错:answer image当然如果你继承extends了类,那就会沿着父类链条一直往上找,整个链条都没有就会报错,哪个环节有就调用哪个answer image这就是所谓原型链。

然后再讲supersuper你可以理解为父级,具体指向谁取决于位于类属性也就是有static标识还是实例属性,在类属性中就指向父类,实例属性就指向父实例属性,简单讲就是static中的super.xxx访问的是父类中的static xxx,没有static的同理。

所以把你的例子转换一下就差不多是下面这样:

class Parent {
  static myMethod(msg) {
    console.log('static', msg);
  }

  myMethod(msg) {
    console.log('instance', msg);
  }
}

class Child extends Parent {
  static myMethod(msg) {
    Parent.myMethod(msg);
  }

  myMethod(msg) {
    new Parent().myMethod(msg);
  }
}

Child.myMethod(1); // static 1

var child = new Child();
child.myMethod(2); // instance 2
回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引,对解决问题有帮助
  • 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容