JS面向对象
Javascript面向对象
1、构造函数生成对象
[@more@]
//定义一个类 Person ，function表示数据类型
function Person(name,sex){
//属性赋值
this.name = name;
this.sex = sex;
this.age = 18 ;
//定义方法
this.say = function(){
document.write("
"+this.name+" say hi!");
}
}
/*
原型法添加形为：可以用来扩展该对象的功能
obj.prototype 返回对象的引用，可以为对象定义方法和属性
对象的新实例“继承”赋予该对象原型的操作
*/
Person.prototype.run = function(){
document.write("
"+this.name+" say running!");
};
/* //prototype还可以这样使用，如果这样用，会丢失前面的定义
Person.prototype = {
jump:function(){
document.write("
"+this.name+" say jumping!");
},
read:function(){
document.write("
"+this.name+" say reading!");
}
};*/
//实例化对象
var p1 = new Person("张小华","男");
//执行对象方法
p1.say();
p1.run();
var p2 = new Person("周振华","男");
p2.say();
p2.run();
//p2.jump();
//p2.read();
//定义一个新的类Teacher，定义两个属性
function Teacher(name,sex){
this.name = name;
this.sex = sex;
}
//从Person的原型中获得了方法run
Teacher.prototype = Person.prototype;
var t1 = new Teacher("毛老师","女");
t1.run();
//t1.say(); //方法无效，没有定义
//遍历对象的所有属性和方法的定义
for(var tmp in t1)
{
document.write("
"+tmp+" 类型："+typeof(tmp)+" 内容："+t1[tmp]);
}
// -->
//定义一个类 Person ，function表示数据类型
function Person(name,sex){
//属性赋值
this.name = name;
this.sex = sex;
this.age = 18 ;
//定义方法
this.say = function(){
document.write("
"+this.name+" say hi!");
}
}
/*
原型法添加形为：可以用来扩展该对象的功能
obj.prototype 返回对象的引用，可以为对象定义方法和属性
对象的新实例“继承”赋予该对象原型的操作
*/
Person.prototype.run = function(){
document.write("
"+this.name+" say running!");
};
/* //prototype还可以这样使用，如果这样用，会丢失前面的定义
Person.prototype = {
jump:function(){
document.write("
"+this.name+" say jumping!");
},
read:function(){
document.write("
"+this.name+" say reading!");
}
};*/
//实例化对象
var p1 = new Person("张小华","男");
//执行对象方法
p1.say();
p1.run();
var p2 = new Person("周振华","男");
p2.say();
p2.run();
//p2.jump();
//p2.read();
//定义一个新的类Teacher，定义两个属性
function Teacher(name,sex){
this.name = name;
this.sex = sex;
}
//从Person的原型中获得了方法run
Teacher.prototype = Person.prototype;
var t1 = new Teacher("毛老师","女");
t1.run();
//t1.say(); //方法无效，没有定义
//遍历对象的所有属性和方法的定义
for(var tmp in t1)
{
document.write("
"+tmp+" 类型："+typeof(tmp)+" 内容："+t1[tmp]);
}
// -->
2、JSON对象生成法
JavaScript Object Notation(缩写JSON)
JSON 的形式就是用大括“{}”号包括起来的项目列表，每一个项目间并用逗号“,”分隔，
而项目就是用冒号“:”分隔的属性名和属性值。这是典型的字典表示形式， 也再次表明了
JavaScript 里的对象就是字典结构。不管多么复杂的对象，都可以被一句JSON 代码来创建
并赋值。JSON 就是JavaScript 对象最好的序列化形式，它比XML 更简洁也更省空间。
对象可以作为一个JSON 形式的字符串，在网络间自由传递和交换信息。 而当需要将这个
JSON 字符串变成一个JavaScript 对象时， 只需要使用eval 函数这个强大的数码转换引擎，
就立即能得到一个JavaScript 内存对象。正是由于JSON 的这种简单朴素的天生丽质，才使
得她在AJAX 舞台上成为璀璨夺目的明星。
view plaincopy to clipboardprint?
var p1 = {
name:"小王",
sex:"女",
say:function(){
document.write("
"+this.name+" , "+this.sex+" , say hi!");
}
};
//JSON对象表示法 prototype 属性是不是没用了
try{
p1.prototype.hello = function(){
document.write("
"+this.name+" , "+this.sex+" , say hi!");
};
p1.hello();
}catch(ex){
document.write("
错误代号："+(ex.number & 0xffff) + " ， 错误信息："+ex.description);
}
//调用对象p1的方法
p1.say();
//有一天，小王由于受到撞伤，失忆了！
delete p1.name;
p1.say();
//document.write("
"+p1[say]);
//再后来，小王受到毒人下毒，变哑巴了
delete p1.say;
try{
p1.say();
}catch(ex){
document.write("
对象的say()方法没有找到！
错误号："+(ex.number & 0xFFFF)+
" ，错误描述："+ex.description);
}
// -->
var p1 = {
name:"小王",
sex:"女",
say:function(){
document.write("
"+this.name+" , "+this.sex+" , say hi!");
}
};
//JSON对象表示法 prototype 属性是不是没用了
try{
p1.prototype.hello = function(){
document.write("
"+this.name+" , "+this.sex+" , say hi!");
};
p1.hello();
}catch(ex){
document.write("
错误代号："+(ex.number & 0xffff) + " ， 错误信息："+ex.description);
}
//调用对象p1的方法
p1.say();
//有一天，小王由于受到撞伤，失忆了！
delete p1.name;
p1.say();
//document.write("
"+p1[say]);
//再后来，小王受到毒人下毒，变哑巴了
delete p1.say;
try{
p1.say();
}catch(ex){
document.write("
对象的say()方法没有找到！
错误号："+(ex.number & 0xFFFF)+
" ，错误描述："+ex.description);
}
// -->
3、命名空间
view plaincopy to clipboardprint?
//声明全局对象namespace，用于注册命名空间
namespace = new Object();
//注册命名空间，fullNS为命名空间全路径
namespace.register = function(fullNS){
var nsArr = fullNS.split('.');
var sEval = "";
var sNS = "";
for(var i=0;i
sNS += nsArr[i];
sEval += "if(typeof("+sNS+") == 'undefined') " + sNS + " = new Object();";
}
if(sEval!="")eval(sEval);
}
//注册自己的命名空间
namespace.register("com.js");
//在此命名空间中注册一个类（采用构造函数生成对象法）
com.js.Person = function(name,sex){
this.name = name ;
this.sex = sex;
this.say = function(){
document.write("
姓名："+this.name+" ，性别："+this.sex);
}
};
//通过prototype扩展Person的行为
com.js.Person.prototype.run = function(){
document.write("
"+this.name+" 会跑！");
};
//定义对象
var p = new com.js.Person("张三","男");
p.say();
p.run();
//在此命名空间注册对象Teacher（采用JSON对象法）
/*注意不能写成 var com.js.Teacher = {code}*/
com.js.Teacher = {
name:"胡月",
sex :"女",
teach:function(){
document.write("
"+this.name+"老师在上课，性别"+this.sex);
}
};
//对象Teacher的使用 ，取别名t
var t = com.js.Teacher;
t.name = "小桃";
t.teach();
//t.sing();
// -->
//声明全局对象namespace，用于注册命名空间
namespace = new Object();
//注册命名空间，fullNS为命名空间全路径
namespace.register = function(fullNS){
var nsArr = fullNS.split('.');
var sEval = "";
var sNS = "";
for(var i=0;i
sNS += nsArr[i];
sEval += "if(typeof("+sNS+") == 'undefined') " + sNS + " = new Object();";
}
if(sEval!="")eval(sEval);
}
//注册自己的命名空间
namespace.register("com.js");
//在此命名空间中注册一个类（采用构造函数生成对象法）
com.js.Person = function(name,sex){
this.name = name ;
this.sex = sex;
this.say = function(){
document.write("
姓名："+this.name+" ，性别："+this.sex);
}
};
//通过prototype扩展Person的行为
com.js.Person.prototype.run = function(){
document.write("
"+this.name+" 会跑！");
};
//定义对象
var p = new com.js.Person("张三","男");
p.say();
p.run();
//在此命名空间注册对象Teacher（采用JSON对象法）
/*注意不能写成 var com.js.Teacher = {code}*/
com.js.Teacher = {
name:"胡月",
sex :"女",
teach:function(){
document.write("
"+this.name+"老师在上课，性别"+this.sex);
}
};
//对象Teacher的使用 ，取别名t
var t = com.js.Teacher;
t.name = "小桃";
t.teach();
//t.sing();
// -->
view plaincopy to clipboardprint?
//声明一个全局对象
namespace = new Object();
//定义注册命名空间的方法
namespace.register = function(fullNS){
var parent = window;
var strs = fullNS.split('.');
for(var i=0;i
parent[strs[i]] = new Object();
}
parent = parent[strs[i]];
}
};
//注册需要的命名空间
namespace.register("com.js");
//定义一个类
com.js.Person = function(name,age){
this.name = name;
this.age = age;
this.say = function(){
document.write("
姓名："+this.name+" ，年龄："+this.age);
};
};
//扩展功能
com.js.Person.prototype.run = function(){
document.write("
姓名："+this.name+" , 我会跑了！");
};
//定义一个对象测试
var p = new com.js.Person("丽娟",18);
p.say();
p.run();
//下面操作无效
try{
p.prototype.jump = function(){
document.write("
姓名："+this.name+" ， 我会跳了！");
};
p.jump();
}catch(ex){
document.write("
错误代码："+ (ex.number&0xffff) +" ，错误信息"+ex.description);
}
// -->
//声明一个全局对象
namespace = new Object();
//定义注册命名空间的方法
namespace.register = function(fullNS){
var parent = window;
var strs = fullNS.split('.');
for(var i=0;i
parent[strs[i]] = new Object();
}
parent = parent[strs[i]];
}
};
//注册需要的命名空间
namespace.register("com.js");
//定义一个类
com.js.Person = function(name,age){
this.name = name;
this.age = age;
this.say = function(){
document.write("
姓名："+this.name+" ，年龄："+this.age);
};
};
//扩展功能
com.js.Person.prototype.run = function(){
document.write("
姓名："+this.name+" , 我会跑了！");
};
//定义一个对象测试
var p = new com.js.Person("丽娟",18);
p.say();
p.run();
//下面操作无效
try{
p.prototype.jump = function(){
document.write("
姓名："+this.name+" ， 我会跳了！");
};
p.jump();
}catch(ex){
document.write("
错误代码："+ (ex.number&0xffff) +" ，错误信息"+ex.description);
}
// -->
4、封装
view plaincopy to clipboardprint?
function MyObje(){
//局部变量，外面无法访问
var name ;
var sex ;
//封装
function setName(_name){
name = _name;
};
function getName(){
return name;
};
function setSex(_sex){
if(_sex=="男"||_sex=="女"){
sex = _sex;
}else{
sex = "男"; //这里是设置默认值
document.write("
性别设置出错，已为您设置默认值男");
}
};
function getSex(){
return sex;
};
//返回一个JSON格式定义的匿名构造函数，即返回一个对象
return {
setName:setName,
getName:getName,
setSex:setSex,
getSex:getSex
};
}
var obj = new MyObje();
obj.setName("王五");
obj.setSex("太监");
document.write("
对象obj的名字为："+obj.getName()+"，性别为："+obj.getSex());
function T(){
this.name = "张三";
this.say = function(){
document.write("
"+this.name+"说你好！");
}
}
var t = new T();
t.say();
t.name = "李四";
t.say();
name = "王五";
t.say();
var m = {
name:"小三",
say:function(){
document.write("
"+this.name+"说你好！");
}
};
m.say();
m.name = "小四";
m.say();
// -->
function MyObje(){
//局部变量，外面无法访问
var name ;
var sex ;
//封装
function setName(_name){
name = _name;
};
function getName(){
return name;
};
function setSex(_sex){
if(_sex=="男"||_sex=="女"){
sex = _sex;
}else{
sex = "男"; //这里是设置默认值
document.write("
性别设置出错，已为您设置默认值男");
}
};
function getSex(){
return sex;
};
//返回一个JSON格式定义的匿名构造函数，即返回一个对象
return {
setName:setName,
getName:getName,
setSex:setSex,
getSex:getSex
};
}
var obj = new MyObje();
obj.setName("王五");
obj.setSex("太监");
document.write("
对象obj的名字为："+obj.getName()+"，性别为："+obj.getSex());
function T(){
this.name = "张三";
this.say = function(){
document.write("
"+this.name+"说你好！");
}
}
var t = new T();
t.say();
t.name = "李四";
t.say();
name = "王五";
t.say();
var m = {
name:"小三",
say:function(){
document.write("
"+this.name+"说你好！");
}
};
m.say();
m.name = "小四";
m.say();
// -->
5、继承
原型继承法
view plaincopy to clipboardprint?
/* prototype是属性对象的，不能应用于对象的实例 */
//通过构造函数的方式生成对象
function Father(name,sex,age){
this.name = name ;
this.sex = sex;
this.age = age;
this.say = function(){
document.write("
Hi，大家好！我是"+this.name+"，今年 "+this.age+" 岁了！");
};
}
//生成父亲对象
var father = new Father("张三","男",28);
Father.prototype.money = function(){
document.write("
"+this.name+"财产为："+this.age*10000);
};
//生成儿子对象
function Son(){}
//儿子继承父亲的财产
Son.prototype = new Father();
var son = new Son();
son.name = "张小三";
son.sex = "男";
son.age = 0;
son.say();
son.money();
father.say();
father.money();
/*
instanceof 实例
从下面可以看出原型继承是真正的JS继承
*/
document.write("
对象son是否是Son的实例："+(son instanceof Son));
document.write("
对象son是否是Father的实例："+(son instanceof Father));
document.write("
对象son是否是Object的实例："+(son instanceof Object));
// -->
/* prototype是属性对象的，不能应用于对象的实例 */
//通过构造函数的方式生成对象
function Father(name,sex,age){
this.name = name ;
this.sex = sex;
this.age = age;
this.say = function(){
document.write("
Hi，大家好！我是"+this.name+"，今年 "+this.age+" 岁了！");
};
}
//生成父亲对象
var father = new Father("张三","男",28);
Father.prototype.money = function(){
document.write("
"+this.name+"财产为："+this.age*10000);
};
//生成儿子对象
function Son(){}
//儿子继承父亲的财产
Son.prototype = new Father();
var son = new Son();
son.name = "张小三";
son.sex = "男";
son.age = 0;
son.say();
son.money();
father.say();
father.money();
/*
instanceof 实例
从下面可以看出原型继承是真正的JS继承
*/
document.write("
对象son是否是Son的实例："+(son instanceof Son));
document.write("
对象son是否是Father的实例："+(son instanceof Father));
document.write("
对象son是否是Object的实例："+(son instanceof Object));
// -->
call继承法
view plaincopy to clipboardprint?
//定义类Person
function Person(name){
this.name = name;
this.sayHi = function(){
document.write("
Hi ，大家好！我是 "+this.name);
};
}
//定义类Worker
function Worker(name,salary){
this.salary = salary ;
//调用另一个对象的一个方法，用另一个对象Person代替当前对象Worker
Person.call(this,name);
this.work = function(){
document.write("
Hi，大家好！我是一名工人，叫 "+this.name+" 年薪为："+this.salary);
};
}
//定义对象工人
var worker = new Worker("王师傅",2000);
worker.sayHi();
worker.work();
//输出对象定义的构造器
alert("对象worker的定义构造函数为："+worker.constructor);
alert("对象worker的定义构造函数是否为Worker，"+(worker.constructor == Worker));
alert("对象worker的定义构造函数的数据类型："+(typeof worker.constructor));
/*
instanceof 实例
从下面可以看出worker并不是Person的实例，对this.superclass = Person的赋值
*/
document.write("
对象worker是否是Worker的实例："+(worker instanceof Worker));
document.write("
对象worker是否是Person的实例："+(worker instanceof Person));
document.write("
对象worker是否是Object的实例："+(worker instanceof Object));
// -->
//定义类Person
function Person(name){
this.name = name;
this.sayHi = function(){
document.write("
Hi ，大家好！我是 "+this.name);
};
}
//定义类Worker
function Worker(name,salary){
this.salary = salary ;
//调用另一个对象的一个方法，用另一个对象Person代替当前对象Worker
Person.call(this,name);
this.work = function(){
document.write("
Hi，大家好！我是一名工人，叫 "+this.name+" 年薪为："+this.salary);
};
}
//定义对象工人
var worker = new Worker("王师傅",2000);
worker.sayHi();
worker.work();
//输出对象定义的构造器
alert("对象worker的定义构造函数为："+worker.constructor);
alert("对象worker的定义构造函数是否为Worker，"+(worker.constructor == Worker));
alert("对象worker的定义构造函数的数据类型："+(typeof worker.constructor));
/*
instanceof 实例
从下面可以看出worker并不是Person的实例，对this.superclass = Person的赋值
*/
document.write("
对象worker是否是Worker的实例："+(worker instanceof Worker));
document.write("
对象worker是否是Person的实例："+(worker instanceof Person));
document.write("
对象worker是否是Object的实例："+(worker instanceof Object));
// -->
apply与prototype联合使用继承法
view plaincopy to clipboardprint?
/*
method.apply(thisobj,args);
以对象thisobj来调用方法method，参数列表args要求为数组
在函数中arguments表示参数列表的数组
*/
//定义创建类的类，方法create返回创建对象的构造函数
var Class = {
create:function(){
return function(){
//保证init方法在对象创建后被调用
this.init.apply(this,arguments);
}
}
};
//创建类Student
var Student = Class.create();
//为类Student定义初始化对象的方法init()
Student.prototype = {
init:function(name){
this.name = name;
},
show:function(){
document.write("我是 "+this.name);
}
};
//用类Student创建对象s
var s = new Student("小明");
s.show();
// -->
/*
method.apply(thisobj,args);
以对象thisobj来调用方法method，参数列表args要求为数组
在函数中arguments表示参数列表的数组
*/
//定义创建类的类，方法create返回创建对象的构造函数
var Class = {
create:function(){
return function(){
//保证init方法在对象创建后被调用
this.init.apply(this,arguments);
}
}
};
//创建类Student
var Student = Class.create();
//为类Student定义初始化对象的方法init()
Student.prototype = {
init:function(name){
this.name = name;
},
show:function(){
document.write("我是 "+this.name);
}
};
//用类Student创建对象s
var s = new Student("小明");
s.show();
// -->
superclass继承法
view plaincopy to clipboardprint?
//定义类Person
function Person(name){
this.name = name;
this.sayHi = function(){
document.write("
Hi ，大家好！我是 "+this.name);
};
}
//定义类Worker
function Worker(name,salary){
this.salary = salary ;
//superclass 定义其父类
this.superclass = Person;
this.superclass(name);
this.work = function(){
document.write("
Hi，大家好！我是一名工人，叫 "+this.name+" 年薪"+this.salary);
};
}
//定义对象工人
var worker = new Worker("王师傅",2000);
worker.sayHi();
worker.work();
/*
instanceof 实例
从下面可以看出worker并不是Person的实例，对this.superclass = Person的赋值
*/
document.write("
对象worker是否是Worker的实例："+(worker instanceof Worker));
document.write("
对象worker是否是Person的实例："+(worker instanceof Person));
document.write("
对象worker是否是Object的实例："+(worker instanceof Object));
// -->
本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/ppjava2009/archive/2010/02/24/5323136.aspx
来自 “ ITPUB博客 ” ，链接：https://blog.itpub.net/23493047/viewspace-1033142/ ，如需转载，请注明出处，否则将追究法律责任。
