50

假设我在 file1.js 中定义一个类

function Customer(){
    this.name="Jhon";
    this.getName=function(){
        return this.name;
    };
};

现在如果我想在 file2.js 中创建一个 Customer 对象

var customer=new Customer();
var name=customer.getName();

我得到了例外:Customer is undefined, not a constructor.

但是当我在 file2.js 中创建一个客户对象并将其传递给 file1.js 时,它就可以工作了。

file1.js

    function Customer(){
        this.name="Jhon";
        this.getName=function(){
            return this.name;
        }
    }
    function customer(){
        return new Customer();
    }

file2.js

    var customer=customer();
    var name=customer.getName();

但我想使用 new Customer() 在 file1.js 中创建一个客户对象。我怎样才能做到这一点?

4

7 回答 7

37

这取决于您运行的环境。在网络浏览器中,您只需要确保file1.js在之前加载file2.js

<script src="file1.js"></script>
<script src="file2.js"></script>

在 node.js 中,推荐的方法是使 file1 成为一个模块,然后您可以使用以下函数加载它require

require('path/to/file1.js');

也可以使用require.js库在 HTML 中使用节点的模块样式。

于 2012-10-10T06:01:11.560 回答
17
// Create Customer class as follows:
export default class Customer {
   getName() {
     return 'stackoverflow';
   }
}

// Import the class 
// no need for .js extension in path cos it gets inferred automatically
import Customer from './path/to/Customer'; 
// OR
const Customer = require('./path/to/Customer') 

// Use the class
var customer = new Customer();
var name = customer.getName();
于 2019-09-27T12:06:44.317 回答
9

您可以导出方法以从其他文件访问,如下所示:

文件1.js

var name = "Jhon";
exports.getName = function() {
  return name;
}

文件2.js

var instance = require('./file1.js');
var name = instance.getName();
于 2017-03-02T01:22:01.920 回答
4

If you are using javascript in HTML, you should include file1.js and file2.js inside your html:

<script src="path_to/file1.js"></script>
<script src="path_to/file2.js"></script>

Note, file1 should come first before file2.

于 2012-10-10T05:59:13.983 回答
4

确保在 file2 中运行代码之前加载 dom...如果您使用的是 jQuery:

$(function(){
  var customer=customer();
  var name=customer.getName();
});

然后文件的顺序无关紧要,代码在加载所有文件之前都不会运行。

于 2012-10-10T06:04:33.880 回答
2

Possible Suggestions to make it work:

Some modifications (U forgot to include a semicolon in the statement this.getName=function(){...} it should be this.getName=function(){...};)

function Customer(){
this.name="Jhon";
this.getName=function(){
return this.name;
};
}

(This might be one of the problem.)

and

Make sure U Link the JS files in the correct order

<script src="file1.js" type="text/javascript"></script>
<script src="file2.js" type="text/javascript"></script>
于 2012-10-10T05:59:34.387 回答
2

这是说值是undefined因为它是一个构造函数function,而不是 aclass和 a constructor。为了使用它,您需要使用Customer()or customer()

首先,你需要在 file2.js之前加载 file1.js ,就像 slebetman 说的:

<script defer src="file1.js" type="module"></script>
<script defer src="file2.js" type="module"></script>

然后,您可以按如下方式更改您的 file1.js:

export default class Customer(){
    constructor(){
        this.name="Jhon";
        this.getName=function(){
            return this.name;
        };
    }
}

而file2.js如下:

import { Customer } from "./file1";
var customer=new Customer();

如果我错了,请纠正我。

于 2020-08-06T21:30:21.593 回答