位置: 编程技术 - 正文
ES6 javascript中class静态方法、属性与实例属性用法示例
编辑：rootadmin推荐整理分享ES6 javascript中class静态方法、属性与实例属性用法示例，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:,内容如对您有帮助，希望把文章链接给更多的朋友！
本文实例讲述了ES6 javascript中class静态方法、属性与实例属性用法。分享给大家供大家参考，具体如下：
类相当于实例的原型， 所有在类中定义的方法， 都会被实例继承。 如果在一个方法前， 加上static关键字， 就表示该方法不会被实例继承， 而是直接通过类来调用， 这就称为“ 静态方法”。
上面代码中， Foo类的classMethod方法前有static关键字， 表明该方法是一个静态方法， 可以直接在Foo类上调用（ Foo.classMethod()）， 而不是在Foo类的实例上调用。 如果在实例上调用静态方法， 会抛出一个错误， 表示不存在该方法。
父类的静态方法， 可以被子类继承。
上面代码中， 父类Foo有一个静态方法， 子类Bar可以调用这个方法。静态方法也是可以从super对象上调用的。
静态属性
静态属性指的是 Class 本身的属性， 即Class.propname， 而不是定义在实例对象（ this） 上的属性。
上面的写法为Foo类定义了一个静态属性prop。
目前， 只有这种写法可行， 因为 ES6 明确规定， Class 内部只有静态方法， 没有静态属性。
ES7 有一个静态属性的提案， 目前 Babel 转码器支持。
这个提案对实例属性和静态属性， 都规定了新的写法。
（1） 类的实例属性
类的实例属性可以用等式， 写入类的定义之中。
上面代码中， myProp就是MyClass的实例属性。 在MyClass的实例上， 可以读取这个属性。
以前， 我们定义实例属性， 只能写在类的constructor方法里面。
上面代码中， 构造方法constructor里面， 定义了this.state属性。有了新的写法以后， 可以不在constructor方法里面定义。
这种写法比以前更清晰。
为了可读性的目的， 对于那些在constructor里面已经定义的实例属性， 新写法允许直接列出。
（2） 类的静态属性
类的静态属性只要在上面的实例属性写法前面， 加上static关键字就可以了。
同样的， 这个新写法大大方便了静态属性的表达。
上面代码中， 老写法的静态属性定义在类的外部。 整个类生成以后， 再生成静态属性。 这样让人很容易忽略这个静态属性， 也不符合相关代码应该放在一起的代码组织原则。 另外， 新写法是显式声明（ declarative）， 而不是赋值处理， 语义更好。
更多相关内容可查看本站专题：《ECMAScript6(ES6)入门教程》、《JavaScript数组操作技巧总结》、《JavaScript字符与字符串操作技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript错误与调试技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家基于ECMAScript的程序设计有所帮助。
原生JS与jQuery编写简单选项卡 本文实例为大家分享了JS编写简单选项卡的具体代码，供大家参考，具体内容如下!DOCTYPEhtmlhtmllang="en"headmetacharset="UTF-8"titlejquery选项卡/titlestyletype="text/css
ES6 javascript中class类的get与set用法实例分析 本文实例讲述了ES6javascript中class类的get与set用法。分享给大家供大家参考，具体如下：与ES5一样，在Class内部可以使用get和set关键字，对某个属性设置存
react实现一个优雅的图片占位模块组件详解 前言发现项目中的图片占位模块写得很不优雅，找了一圈，发现没找到自己想要的图片组件。于是自己写了一个，写了一个还算优雅的图片组件：mult-tra
标签: ES6 javascript中class静态方法、属性与实例属性用法示例
本文链接地址:https://www.jiuchutong.com/biancheng/368469.html 转载请保留说明！上一篇：用React实现一个完整的TodoList的示例代码(react 技巧)
下一篇：原生JS与jQuery编写简单选项卡(jquery和原生js性能)
