Javascript 有多种方式实现继承,下面这些大家哪种用的比较多,还有没有其它方式?
ES6 引入的 class 是不是最佳实践呢? ES5 时代,大家都用什么方式?
组合 /模块模式的方式是不是可以作为继承的替代?
请大家指导,各抒己见。
function SuperClass(p) { this.prop = p this.method = function () {return this.prop} } function SubClass(p2) { this.prop2 = p2 this.method2 = function () {return this.prop2} } SubClass.prototype = new SuperClass('prop') // inherit/extends let so = new SubClass('prop2') // create instance console.log(so.method()) console.log(so.method2())
let SuperObject = { prop: 'prop', method: function () { return this.prop } } let SubObject = Object.create(SuperObject) // equals to inheritance/extension let so = Object.assign(SubObject, { // equals to instantiation prop2: 'prop2', method2: function () { return this.prop2 } }) console.log(so.method()) console.log(so.method2())
let SuperObject = { prop: 'prop', method: function () { return this.prop } } let SubObject = { prop2: 'prop2', method2: function () { return this.prop2 } } let so = Object.setPrototypeOf(SubObject, SuperObject) // equals to inheritance/extension, and equals to instantiation also console.log(so.method()) console.log(so.method2())
class SuperClass { constructor(p) { this.prop = p } method() { return this.prop } } class SubClass extends SuperClass { // inherit/extends constructor(p2) { super('prop') this.prop2 = p2 } method2() { return this.prop2 } } let so = new SubClass('prop2') // create instance console.log(so.method()) console.log(so.method2())
let SuperClass = { createNew: function (p) { let prop = p let o = {} o.method = function () { return prop } return o } } let SubClass = { createNew: function (p2) { let prop2 = p2 let o = SuperClass.createNew('prop') // equals to inheritance/extension, you can use composition also o.method2 = function () { return prop2 } return o } } let so = SubClass.createNew('prop2') // equals to instantiation console.log(so.method()) console.log(so.method2())
1 yemoluo 2019-04-03 14:16:07 +08:00 9102 年了,当然是 ES6 + Babel |
![]() | 2 leemove 2019-04-03 14:19:27 +08:00 es6 时代肯定用 class,es5 的时候基本都用你这个列表的第一种,详细的可以参考高程,没记错里面应该有六种. |
![]() | 3 murmur 2019-04-03 14:20:25 +08:00 用了 vue 之后就发现对于应用层来说,mixin+plugin 的方法比 js 假 oo 好得多 |
![]() | 4 KuroNekoFan 2019-04-03 14:43:31 +08:00 用 class 就好 |
![]() | 5 love 2019-04-03 14:48:23 +08:00 都 9102 年了,还在整这个,直接 class 走起 |