Javascript es6 覆盖静态属性

2023-11-23

尝试 ES6 并尝试创建一个具有静态属性和解析函数的类。然后我想为我正在解析的每种不同类型扩展基本解析器。不确定我是否正在执行反模式,但我无法覆盖静态属性。

这是我的基本解析器

class Module {

  static name = 'Default Module'
  static version = {major:10000, minor: 10000}

  static checkVersion({majorVersion = 10000, minorVersion = 10000}) {
    if(this.version.major !== majorVersion || this.version.minor > minorVersion) {
      throw `${this.name} requires version ${this.version.major}.${this.version.minor} got ${majorVersion}.${minorVersion}`;
    }
  }

  static parse(data) {
    try {
      this.checkVersion(data);
      return this.internalParser(data);

    } catch (e) {
      throw e;
    }
  }

  static internalParser(data) {
    throw `${this.name} has no parser implemented`;
  }
}

然后我想像这样扩展

class ExtendedModule extends Module {
  static name = 'Extended';
  static version = {major: 1, minor:0}

  static internalParser(data) {
    //Some stuff
  }
}

但是当用 babel 在 node 中编译时我得到

true; if ('value' in descriptor) descriptor.writable = true; Object.defineProp
                                                                    ^
TypeError: Cannot redefine property: name
    at Function.defineProperty (native)

有人知道这是否可能或完全错误吗?


您可以尝试使用静态 getter 在代码中实现最初预期的层次结构:

class Module {
    static get name() { return "Default Module"; }
    static get version() { return {major:10000, minor: 10000}; }

    static parse() {
        console.log( this.name );
    }
}

class ExtendedModule extends Module {
    static get name() { return "Extended"; }
    static get version() { return {major:1, minor: 0}; }
}

ExtendedModule.parse();

使用 BabelJS 就变成了

"use strict";

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

var Module = function () {
    function Module() {
        _classCallCheck(this, Module);
    }

    _createClass(Module, null, [{
        key: "parse",
        value: function parse() {
            console.log(this.name);
        }
    }, {
        key: "name",
        get: function get() {
            return "Default Module";
        }
    }, {
        key: "version",
        get: function get() {
            return { major: 10000, minor: 10000 };
        }
    }]);

    return Module;
}();

var ExtendedModule = function (_Module) {
    _inherits(ExtendedModule, _Module);

    function ExtendedModule() {
        _classCallCheck(this, ExtendedModule);

        return _possibleConstructorReturn(this, (ExtendedModule.__proto__ || Object.getPrototypeOf(ExtendedModule)).apply(this, arguments));
    }

    _createClass(ExtendedModule, null, [{
        key: "name",
        get: function get() {
            return "Extended";
        }
    }, {
        key: "version",
        get: function get() {
            return { major: 1, minor: 0 };
        }
    }]);

    return ExtendedModule;
}(Module);

ExtendedModule.parse();

运行它显示的代码

Extended

在 JS 控制台上。

  • ES5-小提琴:https://jsfiddle.net/dwq698r8/
  • ES6-小提琴:https://jsfiddle.net/yd8bf7am/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Javascript es6 覆盖静态属性 的相关文章

  • socket.io 的良好初学者教程? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • JavaScript 中的埃拉托斯特尼筛法对大量数据无限运行

    我一直在尝试写埃拉托斯特尼筛法 http en wikipedia org wiki Sieve of EratosthenesJavaScript 中的算法 基本上我只是按照以下步骤操作 创建从 2 到 n 1 的连续整数列表 令第一个素
  • Javascript Promise“then”始终运行,即使 Promise 未能执行

    我希望当调用第二个 then 时不执行第三个 then 但是 即使 Promise 被拒绝 调用第二个 then 并且代码返回 rejected 然后返回 undefined 它仍然调用第三个 then 如何不运行第三个 then 这样 未
  • 摩卡 - Chai Karma“套件未定义”

    我对 jscript tdd 很陌生 遇到了问题 希望有人能告诉我我在做什么 在浏览器中运行测试 通过 HTML 文件 一切正常 通过节点和业力运行它们我得到以下异常 我想在 node js 主机的 karma 中使用 Mocha 和 Ch
  • 隐藏 Div 的父级

    我只是想隐藏父divcomments section div class content content green div div div 我试过这个 document getElementById comments section pa
  • React-Redux:state.setIn() 和 state.set() 有什么区别?

    我见过使用setIn and set 在一些react redux代码中 state setIn state set 我在这里找到了一些文档https facebook github io immutable js https facebo
  • Chrome 扩展程序在代码中使用 client_secret

    我正在开发具有自己的 oAuth 授权的 Google Chrome 扩展 当然 我必须使用 client id 和 client secret 作为请求令牌 有什么办法可以向用户隐藏这些数据吗 由于此请求只是 javascript 源代码
  • 如何制作没有 ng-repeat 的模板并使用 Angular-drag-and-drop-lists 将数据传递到 $scope?

    我想用角度拖放列表 https github com marceljuenemann angular drag and drop lists使用我自己的网格模板到所见即所得编辑器 如何构建我自己的 HTML 模板而不需要ng repeat因
  • 为什么我们在打字稿中使用 HTMLInputElement ?

    我们为什么使用 document getElementById ipv as HTMLInputElement value 代替 document getElementById ipv value 功能getElementById返回具有类
  • Firebase 函数 onWrite 未被调用

    我正在尝试使用 Firebase 函数实现一个触发器 该触发器会复制数据库中的一些数据 我想观看所有添加的内容votes user vote 结构为 我尝试的代码是 const functions require firebase func
  • 对于只触及我的工作表的 Google 表格脚本,收到“此应用程序未经验证”

    我正在编写一个 Google Sheets 脚本 我只想访问与 gs 文件关联的同一电子表格中的数据 似乎我应该有权在自己的电子表格中运行脚本 但是每当我运行一个函数时 我都会得到一个This app isn t verified信息 我该
  • 在 Shopify 商店中嵌入 Vue 组件

    在产品页面中 我尝试显示自定义 Vue 组件 为简洁起见 该组件根据给定的产品 ID 显示 Firebase 数据库中的一些信息 我最初尝试将其制作为 Shopify 应用程序 以便我可以访问他们的 API 我实现了 OAuth 并且可以检
  • 如何隐藏/禁用 Highcharts.js 中的图例框?

    我想问是否可以使用 HighCharts js 库隐藏图表中的所有图例框 var chart object chart renderTo render to type graph type colors graph colors title
  • Javascript - 水波纹效果

    我需要 JS 上的脚本 它将以 水波纹 样式更改 images html 抱歉 6MB GIF 文件 http fcuunited ru temp listening2 gif http fcunited ru temp listening
  • 带参数的事件监听器

    我想将参数传递给 JavaScript 中的事件侦听器 我已经找到了解决方案 但我无法理解它们为什么或如何工作以及为什么其他解决方案不起作用 我有 C C 背景 但是 Javascript 函数的执行有很大不同 您能否帮助我理解以下示例如何
  • Javascript Replace() 和 $1 问题

    我正在尝试创建一个脚本来搜索文本中的模式并在它找到的字符串周围包裹一个标签 shop attributes td each function this html function i html return html replace E 0
  • 从 FileReader 设置背景图像样式

    我正在寻找一种解决方案 允许我从文件上传输入中获取文件并通过设置 document body style backgroundImage 来预览它 以下代码用于在 Image 元素中显示预览 function setImage id tar
  • 在 CKEditor 中设置字体大小和字体系列

    我正在使用 ckeditor 我想问一下这个插件如何设置font family和font size 我尝试过使用 CKEDITOR config font defaultLabel Arial CKEDITOR config fontSiz
  • JavaScript 相对路径

    在第一个 html 文件中 我使用了一个变量类别链接 var categoryLinks Career prospects http localhost Landa DirectManagers 511 HelenaChechik Dim0
  • 如何在react-highcharts中使用图表工具提示格式化程序?

    如何使用图表工具提示格式化程序 我正在使用高图表的反应包装器 我有这样的配置 const CHART CONFIG tooltip formatter tooltip gt var s b this x b each this points

随机推荐

  • JavaScript 替换/正则表达式

    给定这个函数 function Repeater template var repeater markup template replace function pattern value this markup this markup re
  • 匹配给定 IP 范围/掩码的 IPv4 地址?

    使用 PHP 或 RegExp 或两者 如何匹配 IP 地址范围 传入 IP 示例 10 210 12 12 10 253 12 12 10 210 12 254 10 210 12 95 10 210 12 60 样本范围 10 210
  • 当 this == null 且 obj == null 时调用 IEquatable.Equals(T obj) 的结果是什么?

    什么应该IEquatable
  • 如何根据子文档对mongodb查询结果进行排序

    我在分数集合 学生 数据库中有 2 个文档 如下所示 mongodb 数据库中 id 2 type newname subs time 20 val b time 12 val a time 30 val c id 1 type strs
  • Docker 容器中的 Alpine linux => `env: 无法执行 'node': 没有这样的文件或目录`

    我正在 Alpine Linux 容器中安装 Node js 版本 8 如下所示 RUN apk add no cache wget RUN wget http nodejs org dist v8 1 1 node v8 1 1 linu
  • WCF数据服务5.6快速入门

    我已经尝试让 WCF 数据服务服务器工作几天了 我今天终于退缩了 只是尝试按照快速启动所示的方式进行操作 没有其他任何事情 并且是在全新的项目中 这当然会起作用 但它没有 它和我的其他测试一样失败了 我只是跟着这个example 使用 Vi
  • 如何将 WPF 富文本框转换为字符串

    我看到了如何设置WPF富文本框在RichTextBox类 但我喜欢像以前一样将其文本保存到数据库中 Windows 窗体 string myData richTextBox Text dbSave myData 我该怎么做 MSDN 底部富
  • jQuery + 可排序 + 实时

    我使用 get 动态地将列表项添加到页面 然后将它们附加到 OL 元素 到目前为止 这很平常 但是当这些新项目加载到页面中时 jQuery 并不知道它们 并且我无法使它们可排序 我用 jQuery Live 做了一些尝试 但没有取得任何进展
  • 最好的开放式 PHP 新闻通讯管理器是什么? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心以获得指导 我正在寻找一个不错的时事通
  • 如何在做其他事情的同时从键盘获取输入?

    我正在使用 C gcc 和 ncurses 来制作一个程序来监视来自串行端口的数据 该计划有一个大while 它读取来自端口的数据 同时在屏幕上打印该信息 但问题就在这里 它如何从我的键盘读取输入 因为getch 冻结程序直到它获得输入 并
  • 如何通过前序和中序遍历构建二叉树

    我正在做一项关于从预序和中序遍历 每个节点中的一个字符 构建二叉树的作业 我试图让我的大脑围绕如何构建实际的树 以下是我关于如何实现这一目标的思考过程 将预序中的第一个条目存储为根节点 在中序中搜索该条目 取出根节点左侧的字符并将其保存为字
  • 禁用手势下拉表单/页面表模式呈现

    在 iOS 13 中 使用表单和页面样式的模式演示可以通过向下平移手势来关闭 这在我的一张表单中是有问题的 因为用户绘制到这个框中会干扰手势 它将屏幕向下拉 而不是绘制垂直线 如何在以工作表形式呈现的模式视图控制器中禁用垂直滑动以消除手势
  • 从 iPhone 到 Mac 编程

    我浏览了该网站以确保这不是重复的 如果我错过了什么 请道歉 我从事 iPhone 开发已经大约一年了 我对 Objective C Xcode 和 Cocoa 至少在 iPhone 上使用的 很满意 但 OS X 的编程似乎更复杂 对于像我
  • 如何从字符串列生成分类的 pandas DataFrame 列?

    我可以将 pandas 字符串列转换为分类列 但是当我尝试将其作为新的 DataFrame 列插入时 它似乎会立即转换回系列 str train LocationNFactor pd Categorical from array train
  • 如何在 JavaScript 中动态创建包含 HTML 实体 (— ... «) 的

    我想将 元素添加到 元素 其中 元素的文本包含 HTML 实体 在 HTML 中 代码如下所示
  • 一个或多个包与 .NETStandard 不兼容,版本=v1.5

    我创建了一个新的 NET Core 类库 并从公司内部 Nuget 服务器添加了一个 Nuget 包 我开始收到以下错误 软件包 XXXX 与 netstandard1 5 不兼容 NET标准 版本 v1 5 套餐 XXXX 1 0 支持
  • 使用 Jquery 动态更改图像 src 在 IE 和 Firefox 中不起作用

    我正在为电子邮件实施验证码 当点击linkEmail按钮电子邮件模式将打开 我必须设置由处理程序 CaptchaGenerator ashx 单击时生成的验证码图像linkEmail按钮点击 这是代码 linkEmail click fun
  • VS Code (OSX) Flutter 热重载不被保存触发

    将 VS Code 版本升级到 1 32 1 后 保存 自动保存不会触发自动热重加载 以前它就像一个魅力 按热重载按钮热重载仍然有效 根据 Flutter doctor 的说法 Flutter 似乎还不错 Doctor summary to
  • NSLayoutConstraints 可以设置动画吗? [复制]

    这个问题在这里已经有答案了 我正在尝试对一些视图进行动画处理 以便它们在横向时被巨大的键盘挡住 如果我只是简单地对框架进行动画处理 效果会很好 但其他人建议这会适得其反 我应该更新 NSLayoutConstraints 然而 它们似乎不可
  • Javascript es6 覆盖静态属性

    尝试 ES6 并尝试创建一个具有静态属性和解析函数的类 然后我想为我正在解析的每种不同类型扩展基本解析器 不确定我是否正在执行反模式 但我无法覆盖静态属性 这是我的基本解析器 class Module static name Default