1

我正在尝试使用我从使用 browserify 的 javascript 文件中公开的对象，但我不断收到错误消息Uncaught TypeError: undefined is not a function

这是一个例子：

foo.js：

var foo = function() {
  this.f1 = function(){
    console.log('function1')
  }
  this.f2 = function(){
    console.log('function2')
  }
};

module.exports = foo;

我正在尝试foo在 index.html 中使用。

输入命令后：browserify foo.js > bundle.js

并包含bundle.js到 html 文件中。

index.html：

<html>
  <head>
    <script src="./bundle.js"></script>
    <script>
      var foo = new foo();  // Uncaught TypeError: undefined is not a function

      foo.f1();
    </script>
  </head>

  <body>

  </body>
</html>

我在 browserify 上做错了什么？提前致谢。

编辑：错误的例子。

原始错误示例

foo.js：

var foo = {
  f1: function(){
    console.log('function1')
  },
  f2: function(){
    console.log('function2')
  }
};

module.exports = foo;
4

3 回答 3

3

如果你想使用 new，你应该像这样声明 foo 类：

foo = function() {
  this.f1 = function(){
    console.log('function1')
  };
  this.f2 = function(){
    console.log('function2')
  };
};

foo_obj = new foo();
foo_obj.f1();
foo_obj.f2();

而不是文字。否则，只需 foo 对象的方法。

var foo = {
  f1: function(){
    console.log('function1')
  },
  f2: function(){
    console.log('function2')
  }
};

foo.f1();
foo.f2();

更新：

让我们看看，我从来没有使用过browserify，但是根据他们的文档，你应该这样做：

foo.js

module.exports = function() {
  this.f1 = function(){
    console.log('function1')
  },
  this.f2 = function(){
    console.log('function2')
  }
};

main.js

var foo = require('foo');

然后做：

browserify main.js -o bundle.js

最后导入 bundle.js 并用于new foo()在脚本中创建对象。

于 2014-02-12T02:16:39.420 回答
1

您正在尝试实例化一个对象，就好像它是一个函数一样，例如

new {}; // invalid!!
new function() {}; // valid!

我建议你使用

exports.foo1 = function() { console.log('foo'); }
exports.bar1 = function() { console.log('bar'); }

或者如果你真的想继续new foo()使用：

module.exports = foo;
function foo() {
    this.foo1 = function() { console.log('foo'); }
    this.bar1 = function() { console.log('bar'); }
}
于 2014-02-12T02:16:51.753 回答
0 
browserify foo.js --standalone foo > bundle.js
于 2014-02-12T02:51:09.547 回答