发表新帖
发表新帖

Creating javascript objects from different files

后端 未结
关注
9 2852
眼角桃花
眼角桃花 2021-02-20 11:15

I\'ve been trying to do javascript for sometime now, but i want it to be \"object-orientated\" so I\'m trying to create different javascript classes in different files and try t

相关标签:
9条回答
  • 离开以前
    2021-02-20 11:55

    I was having a similar issue and the problem for me stemmed from writing

    "script src="Person.js" type="javascript"

    instead of

    "script src="Person.js" type="text/javascript" in my index.html file

    Hope this Helps,

    0 讨论(0)
  • 执念已碎
    2021-02-20 11:57

    class methods should be defined via prototype so they receive 'this' reference, like that:

    Person.prototype.getGender = function()
{
  return this.gender;
};
    0 讨论(0)
  • 无人及你
    2021-02-20 11:59

    I see three issues with the code.

    The page does not import the proper external Javascript files

    <head>
    <title>javascript test</title>
    <script src="job.js" type="javascript"></script>
    <script src="person.js" type="javascript"></script>
    <script src="main.js" type="javascript"></script>
</head>

    Male needs to be a String literal

    When the interpreter encounters male within the Person constructor it looks for a variable, which it cannot find.

    function  main()
{
    var employee = new Person("Richard", 23, "male");
    document.getElementById("mainBody").innerHTML = employee.getName();
}

    The code should call the main function.

    Without a call to the main function the code is never kicked off.

    function  main()
{
    var employee = new Person("Richard", 23, "male");
    document.getElementById("mainBody").innerHTML = employee.getName();
}

main();

    Working Example: http://jsfiddle.net/R7Ybn/

    0 讨论(0)
  • 生来不讨喜
    2021-02-20 12:00

    Currently JavaScript is not clever enough to find your dependencies without help.

    You need:

    <!DOCTYPE HTML>
<HTML>
<head>
    <title>javascript test</title>
    <script src="person.js" type="javascript"></script>
    <script src="Job.js" type="javascript"></script>
    <script src="main.js" type="javascript"></script>
</head>
<body>
    <p id="mainBody"></p>
</body>
</HTML>

    Note:

    If you want on-demand load of the dependencies then you can use AMD (Asynchronous Module Definition) with requirejs or something else.

    Using AMD you can define something like:

    define(['Job', 'person'], function (job, person) {
    //Define the module value by returning a value.
    return function () {};
});

    The define method accepts two arguments: dependencies and function which defines the module. When all dependencies are loaded they are passed as arguments to the function where is the module definition.

    One more thing to notice is that Person and Job are not classes. They are just functions (constructor functions) which produces objects based on rules in their definitions.

    0 讨论(0)
  • 你的背包
    2021-02-20 12:00

    You need to return the object created by Person in order for it to constitute a new instance of the Person prototype.

    return(this);
    0 讨论(0)
  • 误落风尘
    2021-02-20 12:05

    This isn't working because, according to your HTML code, the browser is only loading main.js

    <script src="main.js" type="javascript"></script>

    Since Javascript runs in the browser, not on the server where the other files are, the browser will try to execute main.js and fail, since it doesn't have access to the classes in the other files. If you include each one of the files (making sure that every file is included after the one it requires), you should have more success.

    For example:

    <script src="Job.js" type="javascript"></script>
<script src="person.js" type="javascript"></script>
<script src="main.js" type="javascript"></script>
    0 讨论(0)
 看不清?
提交回复
热议问题