首页 > 代码库 > Javascript的面向对象基础

Javascript的面向对象基础

今天学习了一些关于javascript面向对象的基础,之前在网上也陆续接触过一些,不过都感觉理解的不够透彻,所以今天做一个小结。

首先javascript的面向对象还要从何为对象说起,所谓对象可以看作是一个黑盒子,你并不清除它内部实现功能的原理,但是你只要了解它是如何使用的,并且能够用它自带的功能完成自己想要做的事情,基本上来说这就是面向对象的思想。其实面向对象的思想生活中随处可见,电视机,电冰箱,空调等等,都可以看作是对象,拿一般人来说,无需知道它们的工作原理,但只要按说明书去使用即可。

回归到javascript来说的话,在实际写代码的过程中,其实都已接触到面向对象,只不过很多时候是在使用上,使用一些预设的功能,比如用Date()创建日期对象再用其预设的方法getDate(),getFullYear()等可以实现调用时间日期等功能,Array()创建数组对象再用其预设的方法push(),pop(),shift(),splice()等可以实现数据存取等功能。而从使用面向对象,到自己编写面向对象,是学习javascript必经的过程。

 

自己编写面向对象的话,还要从一些小知识点细细去说。

Step1:

变量---属性  

函数---方法

对于初学javascript的童鞋来说,声明变量/函数是家常便饭,但是可能对属性/方法的概念就比较模糊了。以下的代码可以加以说明:

/*变量与函数*/var a = 1;    //声明一个变量并赋值为1function b()  //声明一个函数b,它的功能为弹出变量a{  alert(a);}b();       //执行函数b/*属性与方法*/var obj = new Object();  //新建一个名为obj的空对象obj.a = 1;          //给obj对象添加a属性并赋值为1obj.b = function()    //给obj对象添加b方法,它的功能为弹出obj对象的属性a{  alert(obj.a); }obj.b();          //执行obj对象的方法b

 

以上两段代码的执行结果都是一样,都是弹出1,只不过前者是以变量/函数实现,后者是属性/方法,其实说白了,变量之于属性,函数之于方法,是一个东西,只不过变量/函数是自由的,是不属于任何人的,而属性/方法是属于obj对象的。

PS:1.如果较真的话,其实变量/函数是若不是局部声明的话,默认为window对象的。2.系统自带的对象(如Array()对象等)也是可以添加属性与方法的,只不过这些对象已经有默认的属性与方法,若自行添加可能会覆盖原有的属性与方法,容易出问题,所以一般还是新建空白对象。

 

Step2:

this的指向

关于this的指向,说的再多不如一句话,不完全的说法:指代当前发生事件的对象,补充完全的说法:当前的方法属于谁那么就是指代谁。

一段代码说明如下:

var obj = new Object();obj.a = 1;obj.b = function(){  alert(this.a);  console.log(this); }obj.b();

可以看到这段与之前的属性与方法的代码大致一样,只不过将obj替换为this,执行结果一样,说明this指代的就是b方法的主人obj。

当然也可以在b方法中将this打印出来,结果其实就是obj对象。