我正在学习JavaScript。我来自C#背景。在C#中,存在部分类的概念。换句话说,一种跨文件拆分类定义的方法。有没有办法在JavaScript中执行此操作?
目前,我有一个像这样的目录结构:
/
MyClass.js
child-folder
MyClassAdditions.js
MyClass.js
function MyClass() {
}
有没有办法从MyClassAdditions.js
向MyClass添加其他功能?如果是这样,怎么样?
答案 0 :(得分:2)
更新2018-05-21 - JavaScript现在有正式的类,语法如下:
class MyClass {
constructor(param1) {
this.param1 = param1;
}
// This is the same as MyClass.prototype.printParams
printPrams() {
console.log("The value of param1 is", this.param1);
}
}
2015年的原始答案:
虽然JS目前没有正式类,但您可以创建可以实例化的构造函数对象。您甚至可以扩展这些对象或稍后添加它们。这是一个简单的例子:
// create your constructor
var MyClass = function(param1) {
// create instance properties here
this.param1 = param1;
};
// all instances of your class will point to the constructors prototype
MyClass.prototype.printParams = function () {
console.log("The value of param1 is", this.param1);
};
// lets create two instances so we can see how the prototype thing works
var foo = new MyClass("foo");
var bar = new MyClass("bar");
foo.printParams(); // => The value of param1 is foo
bar.printParams(); // => The value of param1 is bar
foo.param1 = "oof";
foo.printParams(); // => The value of param1 is oof
// Now, lets change how printParams works.
// Remember, we still have instances of foo and bar already created.
// Since they both point to their constructors prototype, you
// can change things later... at any time.
MyClass.prototype.printParams = function () {
console.log("PARAM1 SAID WHAT??", this.param1);
};
MyClass.prototype.sayNothing = function () {
console.log("nothing");
};
// All instances get these new methods, yay prototypal inheritance
foo.printParams(); // => PARAM1 SAID WHAT?? oof
bar.printParams(); // => PARAM1 SAID WHAT?? bar
foo.sayNothing(); // => nothing
bar.sayNothing(); // => nothing
// Lets say we want foo to have it's own sayNothing method,
// you can define one on the instance itself - not really cool, but doable
foo.sayNothing = function () {
console.log("nothing at all");
// If you want to be cool, you can call the shared prototype method too
this.constructor.prototype.sayNothing.call(this);
};
// bar is still going to use the method defined on the prototype
// while foo will have its own implementation of sayNothing
foo.sayNothing(); // => nothing at all
// => nothing
bar.sayNothing(); // => nothing
答案 1 :(得分:0)
由于我有类似的问题,我推荐这种方式,我认为你无处可寻,我发现每个部分都在一个单独的文件中:
<强> MyClass = {}
强>
MyClass.js
文件中,您可以定义一些这样的功能和属性: MyClass.laptop = {
brand : "Dell",
model: "1525",
color: "silver",
getBrandAndModel: function(){
return MyClass.laptop.brand + ", " + MyClass.laptop.model;
},
getBrandAndColor: function(){
return MyClass.laptop.brand + ", " + MyClass.laptop.color;
},
colorizeIt: function(colorName){
return MyClass.laptop.brand + ", " + colorName;
}
}
MyClassAdditions.js
中你会这样: MyClass.cellphone = {
brand : "Samsung",
color: "Black",
width: 8,
height: 15,
getDimention: function(){
return MyClass.cellphone.width + " * " + MyClass.cellphone.height;
},
}
通过这种方式,您将两个独立的js文件中的两个部分添加到名为 MyClass 的对象中。
现在测试这些示例以确保它确实有效:
MyClass.laptop.brand //"Dell"
MyClass.laptop.getBrandAndColor() //"Dell, silver"
MyClass.cellphone.color //"Black"
MyClass.cellphone.getDimention() //"8 * 15"
就像您首先创建了以下对象一样:
MyClass = {
laptop : {
brand : "Dell",
model: "1525",
color: "silver",
getBrandAndModel: function(){
return MyClass.laptop.brand + ", " + MyClass.laptop.model;
},
getBrandAndColor: function(){
return MyClass.laptop.brand + ", " + MyClass.laptop.color;
},
colorizeIt: function(colorName){
return MyClass.laptop.brand + ", " + colorName;
}
},
cellphone :{
brand : "Samsung",
color: "Black",
width: 8,
height: 15,
getDimention: function(){
return MyClass.cellphone.width + " * " + MyClass.cellphone.height;
},
}
}
顺便说一句,您可以通过关键字delete
删除对象的一部分,如下所示:
delete MyClass.cellphone
现在MyClass.cellphone
返回undefined
,而MyClass.laptop
返回对象。