JavaScript的面向对象

最新推荐文章于 2024-09-23 08:37:48 发布

shankaipingo

最新推荐文章于 2024-09-23 08:37:48 发布

阅读量592

点赞数

分类专栏： asp.net 文章标签： javascript function prototype object prototype扩展 string

asp.net 专栏收录该内容

55 篇文章 0 订阅

订阅专栏

Author:尹伟铭

Blog:http://my.donews.com/yinwm/

停了一段时间，今天说说JavaScript的面向对象
js不是一个天生的oo的语言。但是他的函数是可以担负面向对象的概念的。并且js也内置了很多的对象，比如String，Date等等。

js有一个关键字new，可以认为是实例化一个function的对象，把function作为一个class。
比如
function MyObj () {
}
var myObj = new MyObj();
这个时候，myObj就是MyObj的一个实例。

有两点应该具体的说一下
1，JavaScript是一个prototype的语言
2，this在JavaScript里面的应用

首先我们说一下prototype，prototype是一个function的属性，也可以认为是一个类的属性。他用来记录这个类有那些方法。
比如我们要给MyObj定义一个sayHello的方法，我们可以这样写
MyObj.prototype.sayHello = function () {
alert("Hello");
}
这个时候，我们就可以调用myObj.sayHello()执行这个方法。

而this则表示这个类本身（严格意义上说，应该是这个函数本身），比如
MyObj.prototype.sayBye = function () {
alert("bye" + this.name);
}
那么这里的this，就是实例变量本身。myObj.sayBye()。函数里面的this就是表示myObj。那么我们就可以实现带参数的构造函数。

function MyObj2(name) {
this.name = name;
}
var myO2 = new MyObj2("tom");
这样，我们就可以实现一般情况下使用的面向对象了。

需要主意的是，JavaScript没有属性的共有私有机制，我们可以通过myO2.name访问他的name属性。而且js也不是强行规定的，我们要访问 myO2.age也是可以的，但是myO2并没有age的属性（或者说重来没有给age赋值）那么得到的就是undefined。
通过这个，我们就可以用Object来实现平常使用的Map（java语言，对于python应该是字典类型）。
var m = new Object();
m["name"] = “tom";
m["age"] = 20;
alert(m["name"]);
注1：对于alert，JavaScript调用的是这个object的toString函数，如果没有，则会显示 ie:[object] ff:[object, Object]
注2：在js当中，new Object和{}是一样的，我们可以写 var m = {};
这也是js中简单的map的实现。不好的地方是遍历不方便，因为没有地方记录有那些key
for (var i in m) 这种遍历方法，会把所有的对于object进行扩展的方法都显示出来。

对Object的扩展，是通过对Object的prototype添加方法实现的。
比如js的String方法是没有trim的，我们可以自己做一个实现然后通过扩展String来提供这个方法
String.prototype.trim = function () {}
var a = " 123 “.trim();

上面提到了一下this，之所以说一下this，是因为他并不完全等同于C＋＋或者Java里面的this变量。
this在js中表示紧贴着调用地点的，非prototype扩展的方法。
比如上面提到的
MyObj.prototype.sayBye = function () {
alert("Bye" + this.name);
}
这个里面的this，紧贴的非prototype的函数是MyObj（再次注意，js中class是通过函数实现的），所以this.name就是实例变量。
但是在这种情况
MyObj.prototype.doSomething = function () {
todo(function () {
alert(this.name);
});
}
这个时候，this表示的是这个匿名函数
function () {
alert(this.name)
}
那么这里就会出现错误，如果想要这样使用，应该使用辅助变量。
MyObj.prototype.doSomething = function () {
var me = this; //把自己的reference赋值给变量me
todo (function () {
alert(me.name); //通过me来访问myObj实例
});
}
而且所有的实例变量必须通过this来进行访问，直接写变量名称会认为是全局的变量。
上例中的alert(this.name)是正确的，而alert(name)是错误的。