@Domenic이 말했듯이을 사용하십시오 someClassInstance.constructor.name. @Esteban은 주석에서 언급합니다.

someClassInstance.constructor함수입니다. 모든 함수에는 name속성이 있습니다 …

따라서 클래스 이름을 정적으로 액세스하려면 다음을 수행하십시오 (이것은 내 Babel 버전 BTW에서 작동합니다. @Domenic에 대한 의견에 따르면 마일리지가 다를 수 있습니다).

class SomeClass {
  constructor() {}
}

var someClassInstance = new SomeClass();
someClassInstance.constructor.name;      // === 'SomeClass'
SomeClass.name                           // === 'SomeClass'

최신 정보

바벨은 괜찮 았지만, 어설픈 / 최소화로 인해 문제가 발생했습니다. 게임을 만들고 있으며 풀링 된 Sprite 리소스의 해시 (키가 함수 이름 임)를 만들고 있습니다. 축소 후 모든 함수 / 클래스의 이름이로 지정되었습니다 t. 해시가 종료됩니다. 나는 Gulp이 프로젝트에서 사용하고 있으며 gulp-uglify 문서를 읽은 후이 로컬 변수 / 함수 이름이 엉망이되는 것을 막는 매개 변수가 있음을 발견했습니다. 그래서 내 gulpfile에서 변경했습니다

.pipe($.uglify()) 에 .pipe($.uglify({ mangle: false }))

여기에는 성능과 가독성의 균형이 있습니다. 이름을 조작하지 않으면 (약간) 더 큰 빌드 파일 (더 많은 네트워크 리소스)과 잠재적으로 코드 실행 속도가 느려질 수 있습니다 (인용 필요-BS 일 수 있음). 반면에 동일하게 유지하면 getClassName모든 ES6 클래스에서 정적 및 인스턴스 수준 으로 수동으로 정의해야 합니다. 고맙지 만 사양 할게!

최신 정보

의견에 대한 토론 후에는 .name그러한 기능을 정의하는 데 유리한 관례를 피하는 것이 좋은 패러다임입니다. 몇 줄의 코드 만 필요하며 라이브러리에서 사용하는 경우 코드의 전체 축소 및 일반성을 허용합니다. 그래서 나는 내 마음을 바꾸고 getClassName수업에 수동으로 정의 할 것 같아요 . 감사합니다 @estus! . Getter / Setter는 일반적으로 특히 클라이언트 기반 응용 프로그램에서 직접 가변 액세스에 비해 좋은 아이디어입니다.

class SomeClass {
  constructor() {}
  static getClassName(){ return 'SomeClass'; }
  getClassName(){ return SomeClass.getClassName(); }
}
var someClassInstance = new SomeClass();
someClassInstance.constructor.getClassName();      // === 'SomeClass' (static fn)
someClassInstance.getClassName();                  // === 'SomeClass' (instance fn)
SomeClass.getClassName()                           // === 'SomeClass' (static fn)

답변

typeof YourClass === "function"

YourClass.name

customElements.define("your-component", YourComponent);

function registerComponent(componentClass) {
    const componentName = upperCamelCaseToSnakeCase(componentClass.name);
    customElements.define(componentName, componentClass);
}

registerComponent(YourComponent);

// converts `YourString` into `your-string`
function upperCamelCaseToSnakeCase(value) {
    return value
        // first char to lower case
        .replace(/^([A-Z])/, $1 => $1.toLowerCase())
        // following upper chars get preceded with a dash
        .replace(/([A-Z])/g, $1 => "-" + $1.toLowerCase());
}

{
  "presets": [
    ["@babel/preset-env", {"targets": {"browsers": ["> 2%"]}}]
  ]
}