Class 静态 getter 其中 returns class 在 Javascript

Question

我有一些代码：

//Main class
class Tools { 

  //Subclass implemented by static getter 
  static get SUPPORTED_UNITS () {
    return class {  
      //Another one
      static get Size () {
        return class {
          //Some data (constants in my case)
        };
      }
    };
  }
}

我想像 Tools.SUPPORTED_UNITS.Size 一样使用它，并且我想由此接收一些数据。我使用 WebStorm 编写 JavaScript 代码，所以当我尝试使用它时它向我展示了这一点。

我不太清楚，也许我只是没有对我的 WebStorm 进行一些设置，但是..我需要做的是我可以使用像 Class.Subclass.SubClassMethod/SubSubclass.

这样的构造

我需要：

这不是一个方法
它是静态的
它是不可变的（没有 Object.freeze 或类似的东西）- 所以我不能通过输入 Class.Subclass = foo;

Class.Subclass

它被 IDE 编入索引 - 所以我得到了 IDE 的一些帮助（比如我输入 Class.Su 并且她建议 Class.Subclass）

在ES6和WebStorm中是真的吗？或者也许我必须使用 ES7 和 Babel 或类似的东西？

P.S。该代码有效，但我需要 IDE 的建议，否则它会像地狱一样。

Answer 1

遵循@estus 和@Felix Kling 的建议...（此处可能被歪曲）

const TOOLS = {
    get SUPPORTED_UNITS() {
        return {
            get SIZE() {
                return {
                    get Bar() { 
                        return 1;
                    }
                }
            }
        }
    }
};
console.log(TOOLS.SUPPORTED_UNITS.SIZE.Bar) // 1;

TOOLS.SUPPORTED_UNITS.SIZE = "Hello";
// TOOLS.SUPPORTED_UNITS.SIZE = "Hello";
//                            ^
// TypeError: Cannot set property SIZE of #<Object> which has only a getter

这行得通，但正如@bergi 所说，它会在每次查找时创建一个新对象：

console.log(TOOLS.SUPPORTED_UNITS === TOOLS.SUPPORTED_UNITS); // false

是的...

另一种仍然使用 getter 的方法是将所有这些对象封装在一个 IIFE 中：

const TOOLS = (function () {
    const SIZE = {
        get Bar() { return 1; }
    }
    const SUPPORTED_UNITS = {
        get SIZE() {
            return SIZE;
        }
    }
    return {
        get SUPPORTED_UNITS() {
            return SUPPORTED_UNITS;
        }
    }
}());

console.log(TOOLS.SUPPORTED_UNITS.SIZE.Bar === TOOLS.SUPPORTED_UNITS.SIZE.Bar); // true
console.log(TOOLS.SUPPORTED_UNITS.SIZE === TOOLS.SUPPORTED_UNITS.SIZE);  // true
console.log(TOOLS === TOOLS); // true

TOOLS.SUPPORTED_UNITS = "hello"; // still throws an error

Third update:

第二个示例解决了与每次查找都创建一个新对象相关的问题，但它也没有考虑到对每个嵌套属性的访问会导致函数调用重新评估不是应该改变：

//A naive measurement:
for(let counter = 0; counter < 5; counter++) {
    let start = Date.now();    
    for(let i = 0; i < 200000; i++){
        let somevar = Tools.SUPPORT_UNITS.SIZE;
    }
    let end = Date.now();
    console.log(`Elapsed using nested getters: ${end - start}ms.`);
}
// Something like:
/** Elapsed using nested getters: 20ms.
 * Elapsed using nested getters: 14ms.
 * Elapsed using nested getters: 9ms.
 * Elapsed using nested getters: 10ms.
 * Elapsed using nested getters: 10ms.
 *
 // While the same as ordinary properties:
 * Elapsed ordinary properties: 2ms.
 * Elapsed ordinary properties: 5ms.
 * Elapsed ordinary properties: 1ms.
 * Elapsed ordinary properties: 0ms.
 * Elapsed ordinary properties: 0ms.
 */

因此，如果运行 200000 次循环在可预见的将来，最好在使用此方法之前检查替代方案。

Class 静态 getter 其中 returns class 在 Javascript

Class static getter which returns class in Javascript

javascript

webstorm

ecmascript-6

es6-class