文档06_JavaScript_面相对象
Javascript面向对象
由于javascript是弱的面向对象,所以在面向对象方面不是很彻底,它的面向对象是基于原型的。
示例01
View Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <script type="text/javascript"> Number.prototype.add=function(val1,val2){ return val1+val2}; Number.prototype.reduce=function(val1,val2){ return val1-val2}; var num=new Number(); var add=num.add(3,9); var reduce=num.reduce(9,3); var num2=new Number(); var add2=num2.add(3,6); var reduce2=num2.reduce(9,6); document.write("Number.prototype.add=function(val1,val2){ return val1+val2};<br/>"+ "Number.prototype.reduce=function(val1,val2){ return val1-val2};<br/>"+ "var num=new Number();<br/>"+ "var add=num.add(3,9);<br/>"+ "var reduce=num.reduce(9,3);<br/>"+ "var num2=new Number();<br/>"+ "var add2=num2.add(3,6);<br/>"+ "var reduce2=num2.reduce(9,6);<br/>"); document.write("result:<br/>") document.write("add:"+add); document.write("<br/>"); document.write("reduce:"+reduce); document.write("<br/>result:<br/>") document.write("add2:"+add2); document.write("<br/>"); document.write("reduce2:"+reduce2); </script> </head> <body> </body> </html>
以上示例影响对象本身
示例02
View Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <script type="text/javascript"> var num=new Number(); num.add=function(val1,val2){return val1+val2}; var add=num.add(5,9); document.write("add:"+add); var num2=new Number(); var add2=num2.add(1,9);//没有此函数 document.write("<br/>add2:"+add2);//不执行 </script> </head> <body> </body> </html> 不影响对象本身
示例03
自定义对象,运用函数
View Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <script type="text/javascript"> //简单自定义对象 var Book=function(strTitle){ this.title=strTitle; this.getTitle=function() { return this.title+",我卖10块钱";} this.setTitle=function(str_Title) { this.title=str_Title; } } var book=new Book("我是书"); document.write(book.title); document.write("<br/>"); document.write(book.getTitle()); document.write("<br/>"); book.setTitle("我是字典"); document.write(book.title); document.write("<br/>"); document.write(book.getTitle()); </script> </head> <body> </body> </html>
示例04
使用set 和 get
View Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <script type="text/javascript"> //不支持IE function Book(){ } function printValue() { document.write(this.Title);} var b=Book.prototype; b.__defineGetter__('title',function(){return this.MyTitle;}); b.__defineGetter__('title',function(t){ this.MyTitle=t;}); b.printTitle=printValue; var book=new Book; document.write(book.Title);//必须大写 document.write("<br/>"); book.Title="one book"; document.write(book.Title); document.write("<br/>"); book.printTitle(); </script> </head> <body> </body> </html>
示例05
一次性对象
View Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <script type="text/javascript"> //一次性对象 //数组形式创建 var Book={ title:"", num:"", print:function(){ return this.title;} } Book.title="good"; Book.num="one"; document.write(Book.title); document.write("<br/>"+Book.num); document.write("<br/>"+Book.print()); //从Object创建 var book2=new Object(); book2.title="我的书"; book2.write=function(){return this.title; } document.write("<br/>"); document.write(book2.title); document.write("<br/>"+book2.write()); //从函数对象方式创建 var book3=new Function() { this.title=""; this.prototype.MyWrite=function(){ return this.title+"123";}; } book3.title="第三种书"; document.write("<br/>"); document.write(book3.title); document.write("<br/>"+book3.MyWrite()); </script> </head> <body> </body> </html>
因缘际会的相遇,自当有非同寻常的结局
QQ交流群:110826636