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

什麼是物件

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

JavaScript字串物件

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

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

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

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

複製程式碼 程式碼如下:

使用字串的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程式碼。 🎜>

複製程式碼

程式碼如下: 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);




新一個Date物件

我們使用以下這個語句來建立一個Date物件。查詢（get）方法
JavaScript date物件設定（set）方法JavaScript date物件轉換（to）方法JavaScript Date物件應用實例－時脈程式碼
本程式碼轉自w3schools.com。 🎜>



複製程式碼


程式碼如下:





陣列物件

建立一個JavaScript陣列

複製程式碼

複製程式碼

複製程式碼



複製程式碼

複製程式碼

程式碼

實例JavaScript數組代碼


下面是一段簡單的使用陣列的JS程式碼，可以點選後面的按鈕來觀察各個變數的值。

複製代碼

代碼如下: 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();

arr[n]傳回陣列指定位置的元素，n叫做下標，從0開始。 可以點選下面的按鈕來查看arr各個位置上的元素。




複製程式碼

程式碼如下: alert(arr[0]) //位置0，也就是第一個元素alert(arr[1]) alert(arr[2])

alert(arr[3])

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

數學物件
例JavaScript Math程式碼

複製程式碼



複製程式碼


程式碼如下所示

我們首先吧Math.PI的值保存在num中，這是一個JS內建的常數，可以點擊下面的按鈕來查看它的值。

alert(num)

rNum則是num經過四捨五入的值。

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

alert(Math.random())

函數物件

在JavaScript中，函數也是對象，我們使用下面以下語句定義一個函數的時候，其實是定義了一個Function類型的物件。 複製程式碼

程式碼如下:


function add(a,b){
f a b;

} 為了說明這個問題，我們可以使用Function的建構子來定義一個add函數： 複製程式碼 程式碼如下:
使用這種方法定義的函數和上面的函數完全一樣，不過這種語法比較麻煩，一般不會使用。
（函數）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()
使用callerCalls(); }whoCalls()SheCalls()
使用callerCalls(); }whoCalls()SheCalls()
使用callerCalls(); }whoCalls()SheCalls()
使用callerCalls(); }whoCalls()SheCalls()
使用callerCalls(); }whoCalls()SheCalls()
使用callerCalls()；可以了解誰調用了當前函數。注意，只有在函數體內部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，這主要用於匿名函數遞歸。