面向对象程序员JavaScript指南

 

1 、JavaScript 不是Java

JavaScript和Java的名字中蕴含着的大量的市场考虑，而实质相对很少。

JavaScript的关键特征：

变量是弱类型的

代码是动态解释的

JavaScript函数是正常对象

JavaScript对象是基于phototype的

2 、JavaScript 中的对象

创建一个新的JavaScript对象的最简单的方法是调用Object类内奸的构造函数：

var myObject=new Object()

这里对象Object初始化为空，即它不包含属性或者方法

2.1 、创建即时对象

JavaScript对象本质上是一个关联数组，由以名称作为键的字段和方法组成

使用 JavaScript 语句

JavaScript对象属性是可读/可写的，可以使用=操作符来赋值

myObject.shoeSize=”12”

也可以使用数组的语法来引用属性：

myObject[“shoeSize”]=”12”

也可以给对象动态添加一个新的函数：

myObject.speakYOurshoeSize=function(){

…

}

或者借助于一个预先定义的函数

function sayHello(){

…

}

myObject.sayHello=sayHello

注意，当分配预先定义的函数时，省略了圆括号。如果写成：

myObject.sayHello=sayHello()

那么将执行sayHello函数，并且用它的返回值来给myObject的sayHello属性赋值

可以将对象附加到其他对象上，从而创建复杂的数据模型

使用 JSON

JSON是语言的一个核心特征，它提供了一种创建数组和对象图的简单机制，为了理解JSON，需要知道JavaScript数组是如何工作的。

JavaScript有一个内建的Array类，可以使用new关键字初始化：

myLibrary.books=new Array()

数组可以按照数字来索引，也可以使用键值来关联

创建一个数组索引的快捷方法是使用方括号，将所有的成员写成一个用逗号分隔的值的列表，就象这样：

myLibrary.books=[book1,book2,book3]

为了创建JavaScript对象，我们使用花括号，将每个值写成“键：值”对的形式：

myLibrary.books={

bestseller：book1

cookbook：book2

}

键的内部也可以有空白，可以在JSON符号中使用引号来引用：

“Beat Seller”：book1

可以通过嵌套JSON符号来创建复杂对象层次的单行定义

我们可以使用任何JavaScript代码来赋值，甚至是自定义函数

可以混合和匹配使用JavaScript和JSON符号

通过内建的JavaScript Object和Array类以及JSON符号，可以创建人以复杂的对象层次。JavaScript业提供了创建对象的方法，为面向对象程序员提供了令人舒适的类定义的相似性

2.2 、构造函数、类和prototype 属性

在面向对象编程中，通常使用希望实例化的类的声明来创建对象。Java和JavaScript都支持new关键字，允许创建预先定义类别的对象的实例

JavaScript对象是相同基类（一个有能力在运行时将成员字段和函数与自己绑在一起的类）的实例

当使用一个特定的函数来构造对象时，prototype定义了将自动绑定在对象上的属性和函数

在JavaScript中，可以编写一些类似于Java声明的东西

var myObj=new MyObject()

但是我们没有定义类MyObject，而是定义了一个同名的函数。这里是一个简单的构造函数：

function MyObject(name,size){

this.name=name;

this.size=size

}

在构造函数中，设置为this属性的任何东西随后都可以作为对象的一个成员来使用

我们也可以在构造函数中声明一个函数

function MyObject(name,size){

this.name=name;

this.size=size

this.tellSize=function(){

 …

}

}

prototype属性是JavaScript对象的一个属性，在面向对象语言中没有对等物。函数和属性可以与构造函数的prototype关联起来。然后prototype和new关键字协同工作，当使用new调用函数时，函数prototype的所有属性和方法会附加到结果对象上

注意这里事件发生的顺序：在声明构造之后，我们才能饮用prototype属性，对象只继承那些再调用构造函数之前已经添加到prototype上的东西prototype属性可以在两次调用构造函数之间进行修改，并且可以附加任何东西到prototype上

2.3 、扩展内建类

prototype机制也可以与内建类协同工作

2.4 、JavaScript 对象的反射

如果我们希望发现一个JavaScript对象是否支持一个特定的属性或者方法，我们可以简单地测试它：

if(myObject.someProperty){

…

}

如果我们关心属性的类型，也可以使用instanceof操作符。这可以识别出少量基本的内建类型

if(myObject instanceof Array){

…

}

以及任何通过构造函数来定义的类定义：

if(myObject instanceof MyObject){

…

}

3 、方法和函数

3.1 、函数是一等公民

函数有点像Java的方法，调用时，也有参数和返回值，但是有一个关键的区别：Java方法天生捆绑在定义它的类上，不能与类脱离开存在；JavaScript函数是自由浮动的实体，自身就可以作为正常对象

在JavaScript中，Function是一个内建的对象类型。它包含可执行的代码，可以调用，但是它也是Object类的子孙，并且可以做JavaScript对象可以做的任何事情，例如使用名称来保存属性

Function可以通过call方法来执行：

var result=MyObject[‘dosomething’].call(MyObject,x,y,z)

Function.call()的第一个参数是在调用期间作为函数上下文使用的对象，随后的参数作为函数调用的参数

JavaScript函数的参数列表的长度不固定。JavaScript仅仅忽略任何额外的参数，并且给缺少的参数赋值undefined

3.2 、向对象附加函数

函数可以以内嵌的方式来定义：

var dosomething=function(x,y,z){…}

可以将预先定义的函数添加到预先定义的对象上（这种情况下，只有该对象可以调用这个函数，而不是从相同prototype继承的任何其他对象都可以）

我们也可以，添加函数使得类的每一个实例都能访问：在构造函数中将函数添加到新对象上，或者将函数附加到prototype属性

3.3 、从其他对象借用函数

function.call()的第一个参数是上下文对象，即特殊变量this被确定为的对象

3.4 、Ajax 事件处理和函数上下文

事件处理要么当作HTML标记的一部分来声明，例如：

<div id=’myDiv’ οnclick=’alert:alert(this.id)’><div>

要么以编程的方式来声明，例如：

function clickHandler(){alert(this.id)}

mydiv.οnclick= clickHandler

在编程方式下，我们传递的是一个Function对象的引用

当点击DOM元素的时候，Event对象作为了函数调用的参数，元素本身作为上下文对象