I have two classes, say ParentClass
and ChildClass
in 2 separate files. I am directly invoking a function inside ChildClass
and I want to include the ParentClass
dynamically when the ChildClass
is invoked. I DON'T want to use any external library or packages such as jQuery
, require.js
etc. Also I DON'T want to use ES6
or nodejs require
as said here , because of browser compatibility issues.
Here is how my files looks like,
parentclass.js
var ParentClass = function(param1, param2) {
// Class related code here
};
ParentClass.prototype.parentClassFunction = function() {
// Code for the function here...
};
childclass.js
var ChildClass = function(param1, param2) {
// Some class related code here...
this.parentClassFunction();
// Some other code...
};
ChildClass.prototype = Object.create(ParentClass.prototype);
HTML file
.....
<head>
...
<script src="childclass.js"></script>
...
</head>
<body>
...
<script>
var value = new ChildClass(10, 20);
</script>
...
</body>
Is there any way by which I can achieve this? Your help is appreciated.
Thanks in advance. :)
NOTE : I had a brief look into this , this and this question.
Best option is to bundle all the files with a precompiler or something like that.
in your childclass.js you should use require('parentclass.js') or import use something like Browserify to solve the dependencies automagically.
Here are some links: - http://browserify.org/ - https://webpack.github.io/
If you are use ES6 features you can use import:
for example:
import { Childclass } from '/path/to/childclass';
Here is the documentation for import:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.