OOP在javascript中 [英] OOP In javascript

查看:139
本文介绍了OOP在javascript中的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想知道在Javascript中使用OOP的哪种方式最好的方式。



有这个原型的东西,你有功能风格的方式。但是两者都有非常糟糕的方法来继承基类。



所以我试图建立一种方法来实现这一点,而不必使用原型等。

  function Car(name){
this.Name = name;

this.FullName = function(){
return this.Name;
}
}

函数SpecialCar(名称,变体){
//BaseClass.apply(this,PARAMS as ARRAY);
Car.apply(this,[name]);

//新房产
this.Variant = variant;

//覆盖函数
this.FullName = function(){
return this.Name ++ this.Variant;
}
}

var audi = new Car(audi);
$(#result)。append(audi.FullName()+< br>);

var audia3 = new SpecialCar(audi,a3);
$(#result)。append(audia3.FullName()+< br>);

你可以在这里查看jsFiddle: http://jsfiddle.net/vu9ZF/2/



这是好还是只是坏 - 练习?



为了得到一些答案为什么其他方法更好会很好,因为我只是不明白。



<编辑编辑:谢谢大家快速回答我的问题!
我试图在自己的javascript中找到某种方式的OOP,而不是回答如何在javascript中进行操作。
我不喜欢使用原型的方式因为我使用c#的大部分工作时间而且在c#-like oop和prototype oop之间切换有点令人困惑。
但是评论中的某个人告诉我,避免原型并不是一个好主意,因此可能会下降。



感谢stackoverflow你的所有真棒&救了我这么多时间=)

解决方案

这就是它的完成方式:

  function Car(name){
this.name = name;
}

Car.prototype.fullName = function(){
return this.name;
}

函数SpecialCar(名称,变体){
Car.apply(this,arguments);
this.variant = variant;
}

SpecialCar.prototype = Object.create(Car.prototype);

SpecialCar.prototype.fullName = function(){
return this.name +''+ this.variant;
};

(你需要shim Object.create 对于IE8)



现场演示: http://jsfiddle.net/3Rehr/






因此,方法应该分配给构造函数的原型对象,到实例本身。



此外,为了使用超级构造函数预处理实例,只需执行以下操作:

  Car.apply(this,arguments); 

所以 this.base 的事情不是需要。


Im wondering which way of using OOP in Javascript ist best way to go with.

There is this prototype thing and you have the function style way. But both have very bad ways to inherit a base class.

So I tried to build a way to make this possible without having to use prototype and such.

function Car(name) {
    this.Name = name;

    this.FullName = function () {
        return this.Name;
    }
}

function SpecialCar(name, variant) {
    //BaseClass.apply(this, PARAMS AS ARRAY);
    Car.apply( this, [name] );

    //new property
    this.Variant = variant;

    //override function
    this.FullName = function () {
        return this.Name + " " + this.Variant ;
    }
}

var audi = new Car("audi");
$("#result").append(audi.FullName() + "<br>");

var audia3 = new SpecialCar("audi", "a3");
$("#result").append(audia3.FullName()+ "<br>");

You can check the jsFiddle here: http://jsfiddle.net/vu9ZF/2/

Is this okay or is it just bad-practice?

Would be very nice to get some answers why other ways are better because I just dont get it.

EDIT: Thank you all for answering me so fast! I was trying to find some way of OOP in javascript for myself, not answering on how to do oop in javascript. I dont like the way of using prototype for that because im using c# most of my worktime and its a bit confusing to switch between "c#-like oop" and "prototype oop". But someone in the comments told me that avoiding prototype isnt a good idea, soo ill drop that.

Thanks stackoverflow your all awesome & saved me so much time =)

解决方案

This is how it's done:

function Car ( name ) {
    this.name = name;
}

Car.prototype.fullName = function () {
    return this.name;
}

function SpecialCar ( name, variant ) {
    Car.apply( this, arguments );
    this.variant = variant;
}

SpecialCar.prototype = Object.create( Car.prototype );

SpecialCar.prototype.fullName = function () {
    return this.name + ' ' + this.variant;
}; 

(You need to shim Object.create for IE8)

Live demo: http://jsfiddle.net/3Rehr/


So, the methods should be assigned to the constructor's prototype object, not to the instances themselves.

Also, in order to pre-process the instance with the super-constructor, simply do this:

Car.apply( this, arguments );

so the this.base thing is not needed.

这篇关于OOP在javascript中的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆