是否有类似Ruby的JavaScript模块

时间:2016-11-06 16:56:18

标签: javascript ruby module mixins es6-class

假设我有一个Ruby类和一个Ruby模块

module Foo
  def hello
    puts 'hello'
  end
end

class Bar
  include Foo
end

现在我可以做这样的事情

Bar.new.hello 

我可以在JavaScript中执行相同的操作吗?我无法使用extends关键字,因为我的JavaScript类已经被继承。我怎样才能将一些功能混合到我的班级?

更新

我想使用ES6类的东西

3 个答案:

答案 0 :(得分:1)

Javascript语言中没有任何内容可以直接支持,但可以模拟它。

var Foo = {
    hello: function() {
        console.log("hello");
    }
};

function Bar() {}

for (var key in Foo) {
    Bar.prototype[key] = Foo[key];
}

new Bar().hello(); // prints hello

这会遍历Foo中的所有内容,并将其添加到Bar

答案 1 :(得分:1)

您可以使用原型继承。

var Foo = function(){
    this.hello = function(){
        console.log('hello');
    }
}

var Bar = function(){
    Foo.call(this);
}

Bar.prototype = Object.create(Bar);

new Bar().hello();

答案 2 :(得分:1)

我建议阅读我在SO上给出的一些列出的答案,这些答案与OP的答案有关。

...编辑:顺便说一句,搜索“es6 classes mixins”已经指向Mixins for ES6 classes, transpiled with babel ......

使用OP的例子,一个已经可靠的答案可能会简要地分解为......

function withSayHello() {       // - function based *Flight Mixin* as of Angus Croll.
  this.sayHello = function () { // - should be encouraged becoming the main approach
                                //   (though featuring a sugared syntax) of a future
    console.log(this.hello);    //   *Lightweight Trait* implementation.
  };                            //
}                               //

function Bar() {                // - classic ES3 constructor.
    this.hello = 'hello';       //
                                //
    withSayHello.call(this);    // - applying the function based Mixin/Trait/Talent
}                               //   from above.
var bar = new Bar;

bar.sayHello();


class Foo {                     // - with syntactic "class" sugar ...
  constructor() {               //   ... `constructor` does remain the place for ...
    this.hello = 'Howdy!';      //
                                //
    withSayHello.call(this);    //   ... applying function based Mixins/Traits/Talents.
  }                             //
}                               //
var foo = new Foo;

foo.sayHello();

也可以使用Babel's REPL检查上述示例。

浏览器仍然不支持JavaScript的标准化模块系统。另一方面,例如JS库和NodeJS环境确实提供了自己的模块系统。 上面的工作示例可以轻松地在每个示例中进行转换/转换 - 但这里再次进入标准版本,因为BabelTraceur等编译器已经支持它。

// module "my_special_withSayHello_mixin.js"
//
export default function withSayHello() {
  this.sayHello = function () {

    console.log(this.hello);
  };
}


// module "my_very_own_Foo_implementation.js"
//
import withSayHello from 'my_special_withSayHello_mixin';

export default class Foo {
  constructor() {
    this.hello = 'Howdy!';

      withSayHello.call(this);
  }
}


// module "main.js"
//
import Foo from 'my_very_own_Foo_implementation';

var foo = new Foo;
foo.sayHello();