JavaScript面向对象程序设计(3): 对象

简介:
1. 对象
 
对象是面向对象程序设计的基础概念之一,只需看看这个名字就已经知道了。在我们熟悉的面向对象语言中,比如Java或者C++,都有着类似的对象定义方法。比如,我们想定义一个类,名字叫Person,有两个属性:name和age,另外有一个方法,将显示出这个Person对象的名字和年龄,那么我们可以用下面的代码实现:
 
Java:
 
public  class Person {    
         private String name;    
         private  int age;    

         public String getName() {    
                 return name;    
        }    

         public  void setName(String name) {    
                 this.name = name;    
        }    

         public  int getAge() {    
                 return age;    
        }    

         public  void setAge( int age) {    
                 this.age = age;    
        }    

         public  void introduction() {    
                System.out.println( "My name is " +  this.name +  ", my age is " +  this.age);    
        } 

         public  static  void main(String[] args) { 
                Person p =  new Person(); 
                p.setName( "Tom"); 
                p.setAge(20); 
                p.introduction(); 
        } 
}
 
C++的实现也是类似的,这里不再赘述。
 
我们先来看一下这个类的定义:首先声明属性,然后定义属性的getter和setter方法,用来外界访问私有变量,最后定义了它自己的方法。这是一个比较常见的定义方式,以至于以后的很多语言,比如C#,都采用这种定义。
 
那么,什么是对象呢?对象不过是具有特定属性和方法的集合。虽然这并不是一个严格的定义,但是将属性和它的名字(不妨我们把它的方法也看作是它的属性,这并没有什么不同)放在一起,形成一个集合,这就是对象。也就是说,简单来看,对象就是这种具有“键-值”对的形式。
 
2. JavaScript的对象
 
“键-值”对的形式……这个样子看上去是不是有些面熟?Bingo!对了!这不就是数组的形式吗?嗯,恭喜你想到这一点!的确,在JavaScript中,对象的定义就是像数组的定义。下面,我们在JavaScript中对这个Person进行一下定义:
 
var Person = {    
         "name""Tom",    
         "age": 20,    
         "introduction"function() {    
                alert( "My name is " +  this.name +  ", my age is " +  this.age);    
        }    
};    
Person.introduction();
 
来看一下这段代码。看上去很像数组的定义,只不过数组一般使用数字类型作为下标,而这里我们使用的是字符串。回想一下,其实在JavaScript中,字符串也是可以作为数组下标的,不是吗?好了,这里我们声明了一个对象Person,它有一个name,还有一个age,而且还有一个方法显示出这两个属性。
 
在JavaScript中,对象就是“键-值”对的形式,具体来说是"string-as-key": object-as-value的形式。也就是说,这个键必须是string类型的,而值可以是任何类型的。那么,方法呢?其实,JavaScript中的function也是一个类型,这个在后面会有描述的,这里仅仅先知道就可以了。这种数学上成为二元组的样式很常见,数组就是这样的,只不过数组的键必须是int。同样,JavaScript的对象也是一个特殊的二元组,只不过键是string类型的。这是不是就像是一种散列?或者说是哈希表?就是这个样子!
 
如果说你觉得每个属性名都要加一个引号觉得很别扭,那么你大可不加!像下面的语句,JavaScript完全认为你的正确的:
 
var Person = { 
        name:  "Tom"
        age: 20, 
        introduction:  function() { 
                alert( "My name is " +  this.name +  ", my age is " +  this.age); 
        } 

Person.introduction();
 
我比较习惯于这种写法,看上去和Java等语言差不多。
 
3. 属性的使用
 
JavaScript中属性的使用或许比较特别。看下面试图使用Person的name属性的四个语句,看上去都差不多,实际上也确实如此:
 
alert(Person.name); 
// alert(Person."name"); 
alert(Person[ "name"]); 
alert(Person[name]);
 
除去注释掉的一句,其他的三个语句都能够通过解释(由于JavaScript是解释型语言,不是编译型的,因此这里不说是编译),但是只有1、3句能够取出name属性!第一句和Java没有什么区别,后面的两个显得比较特别,第三句看上去像什么?对了!数组元素的访问!这进一步验证了JavaScript中的数组和对象“本是同根生”。那么,第四句呢?当然是返回undefined!因为数组下标必须是数字或者字符串嘛!
 
熟悉Java的话或许会对introduction函数有些疑问。Java程序员不会时时刻刻把this加上,除非哪天心血来潮,才会加上这个this。但是,如果你想在JavaScript中偷懒,去掉this,结果只会是报错。这是怎么回事呢?简单来说,在这里的this关键字是必不可少的!这是JavaScript与其他语言的不同。具体为什么,会在以后的文章中说明,现在只是知道就好了——不要在这里偷懒哦~~
 
4. 更多属性的操作
 
现在对JavaScript对象属性的认识应该在这样一点上:JavaScript的对象就是一个二元组,或者说就是一个散列或哈希表。如果能明白这一点,就不会对下面的操作有所奇怪了:
 
var Person = {};  // 创建一个空对象 
Person.name =  "Tom"// 添加一个属性name,并赋值为Tom 
Person[ "age"] = 20;  // 用另外的办法新增属性 
Person.introduction =  function () { 
        alert( "My name is " +  this.name +  ", my age is " +  this.age); 
}; 
Person.introduction(); 
for( var field  in Person) {  // 使用foreach循环列出对象中所有属性 
        alert( "field name: " + field +  "; value: " + Person[field]); 

delete Person.name;  // 删除name属性 
Person.introduction(); 
alert(name  in Person);  // 使用in操作符判断属性是否存在
 
5. 对象的constructor属性
 
在JavaScript中,每个对象都有一个constructor属性。这个constructor属性用来记录对象初始化时的构造函数名字。例如:
 
var date =  new Date(); 
alert(date.constructor); 
alert(date.constructor ==  "Date");  // false 
alert(date.constructor == Date);  // true
 
嗯,这个Date是JavaScript的内置对象。这里的代码看上去很平常。不过,如果你要使用自己写的对象,比如前面的Person,就会发现它的constructor对象怎么是Object?这里有两个问题:第一,我们并没有给Person constructor属性,它怎么会有的?第二,这个constructor属性怎么是object,而不是我们的Person呢?
 
对于第一个问题,很明显,是JavaScript给我们加上的。事实上,每个JavaScript对象都会有这样一个属性。那么,它的值又怎么是Object呢?这个问题,在我们说道new这个运算符的时候会给大家说明的。这里请大家注意,本文中的对象其实是指的单独的使用new之后得到的对象。也就是说,那个constructor属性是在new运算符的时候获得的。这就涉及到构造函数了——不过这不是本文的重点,以后再说吧~~ :-)

本文转自 FinderCheng 51CTO博客,原文链接:http://blog.51cto.com/devbean/163817

相关文章
|
8天前
|
JavaScript
JS 获取对象数据类型的键值对的键与值
JS 获取对象数据类型的键值对的键与值
|
18天前
|
JavaScript 前端开发
Math对象:JavaScript中的数学工具
Math对象:JavaScript中的数学工具
26 1
|
JavaScript 前端开发 Java
深入JS面向对象(原型-继承)(一)
深入JS面向对象(原型-继承)
30 0
N..
|
25天前
|
存储 JavaScript 前端开发
JavaScript中的对象
JavaScript中的对象
N..
10 0
|
1月前
|
JavaScript 前端开发
JavaScript对象系列(菜菜出品,必看!!!)
JavaScript对象系列(菜菜出品,必看!!!)
|
2月前
|
JavaScript 前端开发
JS将两个数组和合并成数组包对象格式的方法
JS将两个数组和合并成数组包对象格式的方法
25 0
|
11天前
|
JavaScript 算法
原生JS完成“一对一、一对多”矩形DIV碰撞检测、碰撞检查,通过计算接触面积(重叠覆盖面积)大小来判断接触对象DOM
原生JS完成“一对一、一对多”矩形DIV碰撞检测、碰撞检查,通过计算接触面积(重叠覆盖面积)大小来判断接触对象DOM
|
1月前
|
存储 JavaScript 前端开发
在JavaScript中,对象和数组是如何进行扩展的?
在JavaScript中,对象和数组是如何进行扩展的?
22 4
|
3天前
|
JavaScript
【Js】检查Date对象是否为Invalid Date
【Js】检查Date对象是否为Invalid Date
5 0
|
3天前
|
存储 JavaScript 前端开发
JavaScript的引用数据类型主要包括对象
【4月更文挑战第16天】JavaScript的引用数据类型主要包括对象
16 4