本篇文章是講解了一個demo實例,就是怎樣獲取類的結構,以及應該註意的事項,若有什麼建議或意見歡迎前來打擾。 ...
目錄結構:
contents structure [-]
為什麼需要獲取類結構的代碼
筆者認為主要是方便,如果一個項目很大或是引用了其它地方的js文件,如果順著src文件查找會很麻煩。為了對代碼理解的更好,還需要對javaScript的類有所瞭解,更多情況讀者可以參考JavaScript定義類的三種方法。
關於javascript中對類的簡介
其實Javascript中沒有類這個定義,但是有類這個概念。很多人都寫過這樣的代碼,就是一個關鍵字 function,然後定義一個方法名,方法名後緊跟一對括弧。
定義類的方法
第一種
function Cat() { this.name = "大毛"; }
或是
Cat.prototype.makeSound = function(){ alert("喵喵喵"); }
然後通過
var cat = new Cat();
創建對象,和
cat.makeSound();
來調用。
第二種
通過Object.create()創建
var cat={ name:"guaiguai" } var q=Object.create(cat);
不過這種方式下,也可以直接用
cat.name
調用。
Demo
HTML頁面
<!DOCTYPE html> <html> <head> <title>showProperty.html</title> <meta name="content-type" content="text/html; charset=UTF-8"> <script src="date.js"></script> </head> <body> <h1>show Object detail</h1> <script> var num=new date(); var property="<h2>property:</h2>"; var functions="<h2>function:</h2>"; var complete="<h2>complete:</h2>" //get complete information complete=complete+date; //through function and property for(prop in num){ if(typeof(num[prop])=="function"){ functions=functions+prop+":"+num[prop]+"<br>"; }else property=property+prop+":"+num[prop]+"<br>"; } //print document.write(complete+"<br>"+property+"<br>"+functions); </script> </body> </html>
data文件
function date() {
var year;
var month;
var day;
this.year=new Date().getFullYear();
this.month=new Date().getMonth();
this.day=new Date().getDate();
var fun;
this.fun=function(){
alert("I am coming fun1");
this.year=new Date().getFullYear()-1;
this.month=new Date().getMonth()-1;
this.day=new Date().getDay()-1;
}
}
註意事項
上面這段代碼只能測試從外面連接進來的js文件里的類,而js自帶的類就不行,比如:將上面的
var num=new date();
換成
var num=new Date();
就不行,這種情況下是不會顯示時間類的結構的,除非在覆蓋後,才會顯示。
參考文章
http://www.ruanyifeng.com/blog/2012/07/three_ways_to_define_a_javascript_class.html
http://www.jb51.net/article/20430.htm
http://www.cnblogs.com/xcj26/archive/2013/04/08/3006023.html
本文為博主原創文章,如需轉載請註明出處。