javascript物件導向入門基礎詳細介紹

什麼是對象

簡單點說，程式設計語言中的對象是對現實中事物的簡化。例如，我們一個人就是一個對象，但是程式設計語言很難完全描述一個這樣複雜的對象。所以我們必須做出簡化，首先，將人簡化成屬性和行為的組合，然後僅僅保留對程式有意義的幾個屬性以及行為。例如，我們做一個統計某學校的人的身高的程式，那麼我們在這個程式中就可以把人的行為省略掉，只保留行為，並且只保留身高這一個屬性。這樣，我們就得到了一個最簡單的對象。

JavaScript字串對象

對象的屬性
其實我們之前在HTML DOM中已經就是在使用對象了。例如，我們知道，DOM節點有一些資訊、例如nodeName、nodeType等，其實這些資訊就是節點對象的屬性。下面我們以字串為例來看看對象的屬性。

字串的屬性
var s = "我有個7個字元";定義了s這個字串之後，我們就有了一個字串對象，我們可以訪問它的長度屬性(length)，這個屬性不需要我們定義，它是一個內建的屬性。訪問的方式如下:

s.length點擊下面的按鈕看看字串的長度。

alert(s.length)
字串對象的方法(行為)
同樣，對象也可以有行為，以字串對象為例，我們可以讓字串返回某一個位置的字母或文字，這就是一個行為。可以用後面的按鈕簡單地體驗一下字串的各個屬性與方法，本文最後會詳細地解釋各個方法的使用方法。

複製代碼 代碼如下:<script type="text/javascript">
var s = "我有個7個字元";var str = "字元" + "串"; //兩個字串相加
alert(str)
</script>

使用字串的length屬性為字串的長度。

alert(str.length)
使用charAt方法返回指定位置的字元。

alert(str.charAt(0))
alert(str.charAt(1))

substring方法從字串中截取一個子字串。

alert(str.substring(0,2))
indexOf返回字串中指定字元或字串的位置，如果字元不存在就返回-1。

alert(str.indexOf('符')
lastIndexOf方法返回一個字串中某字元最後一次出現的位置。

date對象

執行個體JavaScript date代碼
我們先來看一段使用了date對象的JS代碼。點擊下面的幾個按鈕就可以看到各個變數的值了。

複製代碼 代碼如下:<script type="text/javascript">
var today = new Date(); //建立一個Date對象
var todayStr = today.toString();//把日期轉化為字串
var todayLocal = today.toLocaleString();//轉換為本地字串
var date = today.getDate();//查詢當月日期
var day = today.getDay();//查詢當前星期幾
var month = today.getMonth();//查詢月份
var year = today.getFullYear();//查詢年份
alert(todayStr);
alert(todayLocal);
alert(date);
alert(day);
alert(month);
alert(year);
</script>

建立一個Date對象
我們使用如下這個語句來建立一個Date對象。

var today = new Date();執行之後，today變數裡就儲存了建立的Date對象。

字串對象的方法(行為)
JavaScript date物件查詢（get）方法
JavaScript date對象設定（set）方法
JavaScript date對象轉換（to）方法
JavaScript Date對象應用執行個體——時鐘代碼
本代碼轉自w3schools.com。 複製代碼 代碼如下:<script type="text/javascript">
function startTime(){var today=new Date();
var h=today.getHours();
var m=today.getMinutes();
var s=today.getSeconds();//當數字小於10的時候在前面加一個0
m=checkTime(m);s=checkTime(s);
document.getElementById('clock').innerHTML=h+":"+m+":"+s;//每隔500毫秒重新執行一次
startTimet=setTimeout('startTime()',500);}
function checkTime(i){
if (i<10){
i="0" + i;
}
return i;
}
</script>

數組對象

建立一個JavaScript數組 複製代碼 代碼如下:<script type="text/javascript">
//笨方法
var arr = new Array("HTML","CSS","JavaScript","DOM");
//省事一點的方法
var arr = ["HTML","CSS","JavaScript","DOM"];
與字串對象一樣，數組也有一個length屬性，不過它的意思是數組包含元素的個數。點擊下面的按鈕可以看到arr的長度為4。
alert(arr.length)
</script>

執行個體JavaScript數組代碼

下面是一段簡單的使用數組的JS代碼，可以點擊後面的按鈕來觀察各個變數的值。 複製代碼 代碼如下:<script type="text/javascript">
var arr = new Array("HTML","CSS","JavaScript","DOM");
var arr2 = new Array("ASP.NET","PHP","J2EE","Python","Ruby");
var joinArr = arr.join();
var bigArr = arr.concat(arr2);
var sortArr = bigArr.sort();
</script>

arr[n]返回數組指定位置的元素，n叫做下標，從0開始。 可以點擊下面的按鈕來查看arr各個位置上的元素。 複製代碼 代碼如下:alert(arr[0]) //位置0，也就是第一個元素
alert(arr[1])
alert(arr[2])
alert(arr[3])

從上面的代碼可以看到，在調用了數組的幾個方法之後得到了joinArr、bigArr、sortArr這幾個變數，這些方法將在後面具體介紹。可以先觀察變數的值來猜猜這些方法的作用。

數學對象
例JavaScript Math代碼

複製代碼 代碼如下:<script type="text/javascript">
var num = Math.PI;
var rNum = Math.round(num);//四捨五入
</script>

我們首先吧Math.PI的值儲存在num中，這是一個JS內建的常量，可以點擊下面的按鈕來查看它的值。
alert(num)
rNum則是num經過四捨五入的值。

alert(rNum)
random方法則產生一個0-1之間的隨機值。試著多點擊幾次下面的按鈕，可以發現得到的數字會不斷改變。

alert(Math.random())

函數對象

在JavaScript中，函數也是對象，我們使用下面以下語句定義一個函數的時候，其實是定義了一個Function類型的對象。 複製代碼 代碼如下:function add(a,b){
return a+b;
}

為了說明這個問題，我們可以使用Function的建構函式來定義一個add函數： 複製代碼 代碼如下:<script type="text/javascript">
var add = new Function('a','b','return a+b');
alert(add(1,2));
</script>

使用這種方法定義的函數和上面的函數完全一樣，不過這種文法比較麻煩，一般不會使用。
（函數）Function對象的call方法
call是一個非常有用的方法，它可以控制函數的運行環境，即控制函數內部this所指向的對象。下面的例子可以說明這個問題：
function whatsThis(){ alert(this); }我們調用以上函數的時候，將會看到this指向的是window，實驗一下：
whatsThis()
但是如果使用call，我們則可以控制函數內部this的指向，例如：
whatsThis.call(document)()
以上代碼使用function對象的call方法將函數內部的this指向了document。
如果原來的函數需要接受參數，例如add函數，可以使用如下形式：
add.call(document,1,2)也就是說，call的第一個參數是要綁定給this的對象，而1和2則是原來的add函數需要接受的參數。
（函數）Function對象的apply方法
apply的使用方法與call基本一致，只是參數是以數組的形式傳遞的，還是以add函數為例：
add.call(document,[1,2])可以看到，原函數add需要接受的兩個數字參數是以一個數組的形式傳遞進apply的。
（函數）Function對象的caller屬性
function whoCalls(){ alert(whoCalls.caller); } function SheCalls(){ whoCalls(); }whoCalls()SheCalls()
使用caller屬性，可以瞭解誰調用了當前函數。注意，只有在函數體內部caller才有效。
（函數）Function對象的arguments屬性
javascript的函數可以接受任意數量的參數，所以定義的時候，參數的個數作並不會限制函數的這個能力。在函數中，我們可以使用arguments來訪問傳入函數的參數，例如：
function howmany(){ var num = arguments.length; alert(num); }howmany函數會輸出傳遞如函數參數的個數，點擊下面的連個按鈕實驗一下。
howmany(1,2,3,4)howmany(1,2,3,4,5,6,7,8)
函數arguments.callee
我們已經知道function會有arguments屬性，而arguments.callee則是當前正在執行的函數，例如：
function whoAmI(){ alert(arguments.callee); }whoAmI()
執行以上函數會顯示出當前函數的原始碼。當然了，我們可以再次調用callee，這主要用於匿名函數遞迴。