标签归档:Javascript 对象

揭开Javascript对象神秘的面纱

学习Javascript快四年了。因为最初是从实践开始学的,真正系统的学习到了06年才开始。虽然学的时间够长了,曾经经历过两次瓶颈,第一次就是JS的对象。在初级教程中,JavaScript创建对象的方法基本上都是function,而且网网一带而过。所以如果只是买一本Javascript入门书开始学习JavaScript很容易遇到瓶颈。今天我写这篇文章,算是帮帮比我还菜的菜鸟,快速掌握Javscript创建对象的方法吧。
首先来介绍一下在Javascript书籍上最常见的一中方式function方式
function 对象名() {
this.变量1=变量1的值;
this.变量2=变量2的值;
this.函数1= function() {
函数体
};
this.函数2= function() {
函数体
};
……;
}
说明:
(1)其内的变量或者函数前必需写上this关键字;
(2)对象的内容与值以等号分隔,成对出现;
(3)包含的变量或者函数之间以分号分隔。
(4)函数需要写在function(){}的大括号之内。
例子:

function miaoqiyuan() {
	this.name="苗启源";
	this.nickname="飞猫,mqycn";
	this.homeurl=function() {
		alert("http://www.miaoqiyuan.cn");
	};
	this.gohome=function() {
		location.href="http://www.miaoqiyuan.cn";
	}
}

第二种:JSON方式
var 对象名 = {
变量1: 变量1的值,
变量2: 变量2的值,
函数1: function(){
函数体
},
函数2: function(){
函数体
},
……
};
说明:
(1)大括号内直接填写变量或者函数;
(2)对象的内容与值以冒号分隔,成对出现;
(3)包含的变量或者函数之间以逗号分隔;
(4)函数需要写在function(){}的大括号之内。
例子:

var miaoqiyuan = {
	name:"苗启源",
	nickname:"飞猫,mqycn",
	homeurl: function() {
		alert("http://www.miaoqiyuan.cn");
	},
	gohome: function() {
		location.href="http://www.miaoqiyuan.cn";
	}
};

第三种:原型方式
var 对象名 = {};
对象名.prototype.变量1=变量1的值;
对象名.prototype.变量2=变量2的值;
对象名.prototype.函数1= function() {
函数体
};
对象名.prototype.函数2= function() {
函数体
};
……;
说明:
(1)初始对象体内可以不定义任何东西;
(2)在要定义的变量前加“对象名.prototype.”的格式;
(3)对象的内容与值以等号分隔,成对出现;
(4)包含的变量或者函数之间以分号分隔,也可以省去分号。
(5)函数需要写在function(){}的大括号之内。

例子:

var data = {};
	data.prototype.name ="苗启源";
	data.prototype.nickname ="mqycn,飞猫";
	data.prototype.homeurl = function() {
		alert("http://www.miaoqiyuan.cn");
	};
	data.prototype.gohome= function() {
		location.href="http://www.miaoqiyuan.cn";
	};

第四种为create方式,该方式利用了Prototype JavaScript组件库,很少见有人用。
var 对象名 = Class.create();
Object.extend(对象名.prototype, {
变量1: 变量1的值,
变量1: 变量1的值,
函数1: function() {
函数体
},
函数2: function() {
函数体
},
……
}
);
说明:
(1)对象的创建使用了Prototype库中的Class.create()函数;
(2)对象的内容使用Prototype库中的Object.extend()函数来扩展;
(3)被扩展的对象在传入Object.extend函数时一定要带上prototype,
(4)扩展内容被大括号包含,其内与JSON方式的定义格式完全相同。
例子:

var data = Class.create();
Object.extend(dta.prototype, {
	name:"苗启源",
	nickname:"飞猫,mqycn",
	homeurl: function() {
		alert("http://www.miaoqiyuan.cn");
	},
	gohome: function() {
		location.href="http://www.miaoqiyuan.cn";
	}
});

通过上面的四种方法就可以定义对象了,使用对象的方法比较简单了:
var flycat = new miaoqiyuan();
这样就创建了一个名为flycat的对象。
创建了对象,引用的方法有两种,点号方式引用、数组方式引用。
这就很简单了,flycat[“name”],flycat.name。
我学Javscript是从实践开始的,没有系统的学过。有些定义可能叫的不是很准确。欢迎大家与我讨论。本文的原始地址为:http://www.miaoqiyuan.cn/p/javascript-object