JavaScript教學 - 資料型態(Data Type) - 下
介紹JavaScript中的資料型態(型別)，包含物件(Object)、陣列(Array)、未定義(undefined)空值(null)、和函式(Function)。
5. 陣列(Array)
5.1 語法
在JavaScript中可以使用三種方式來建立陣列：
- Array物件建構，參數為初始的陣列元素，當參數只有一個且為數字型別時，表示宣告陣列的長度。
- Array函式，同上。
- Array實字，可直接建立陣列元素，無法宣告陣列長度。
一些範例如下：
console.log(new Array(178, 169.99, '30cm', new Array(9527))); // [178, 169.99, "30cm", Array[9527]]，最後一個元素為長度9527的陣列 console.log(Array(178, 169.99, '30cm', Array(9527))); // [178, 169.99, "30cm", Array[9527]]，同上 console.log([178, 169.99, '30cm', [9527]]); // [178, 169.99, "30cm", Array[1]]，最後一個元素為包含一個元素9527的陣列
事實上在JavaScript中並不需要特別去指定陣列的長度，他會動態的擴充，而又由於建構或函式的參數有兩種情況，容易混淆，所以直接使用實字的方式是最好的。
5.2 元素的存取
我們使用中括號([])加上索引值(index)來表示陣列中的元素，例如：array[123]，以此方式可以取得或修改陣列元素的內容。以下為存取陣列的相關範例：
var ar = new Array(); ar[0] = 178; ar[1] = 169.99; ar[2] = '30cm'; console.log(ar); // [178, 169.99, "30cm"] console.log(ar.length); // 3 ar[9] = 'Lala'; console.log(ar); // [178, 169.99, "30cm", 9: "Lala"] console.log(ar.length); // 10 console.log(ar[3]); // undefined console.log(ar[10]); // undefined console.log(ar[-1]); // undefined
5.3 陣列的判斷
上一篇文章提到使用typeof可以判斷型別，但是陣列取得的結果是object，要更進一步精確的判斷陣列，可以用以下三種方式：
- 利用Array.isArray()函式。
- 利用instanceof運算子判斷是否為Array類別。
- 利用Object.prototype.toString()函式判斷字串。
console.log(Array.isArray([])); // true console.log([] instanceof Array); // true console.log(Object.prototype.toString.call([]) == '[object Array]'); // true
isArray在ECMAScript v5中才有定義，而instanceof必須是同一個window下建立的物件才會正確，也就是如果網頁有多個frame，可能會判斷錯誤，所以利用字串判斷的方式是目前較好的做法。
6. 物件(Object)
6.1 語法
在JavaScript中可以使用兩種方式來建立物件：
- Object物件建構。
- Object實字，可直接建立物件成員。
使用實字的語法與Json類似，利用大括號({})、Key和Value組成，Key的部分可以是字串格式，一些範例如下：
var obj = new Object();
obj.x = 1;
obj.y = 2;
console.log(obj); // Object {x: 1, y: 2}
console.log({x: 1, 'y': 2}); // Object {x: 1, y: 2}
6.2 屬性的存取
JavaScript物件的屬性能夠使用兩種方式存取：
- 利用(.)運算子。
- 關聯式陣列。
關聯式陣列使用字串作為索引鍵，因此能夠做動態的變化，一些範例如下：
var obj = {n1: 1};
obj.n2 = 2;
obj['n3'] = 3;
var str = '';
for(var i = 1;i <= 3;++i)
str += obj['n' + i];
console.log(str); // 123
6.3 轉型
Object作為函式使用時，表示轉型為物件，基本上只用來將布林、數值和字串轉成對應的物件類別，而參數為null或undefined時則相當於建立新物件，但本意是轉型故不列入上述方法之一。
console.log(Object(169.99)); // Number
console.log(Object('30cm')); // String
console.log(Object(false)); // Boolean
7. 未定義(undefined)
7.1 語法
JavaScript中並不存在保留字能夠直接使用未定義這個特殊值，但JavaScript中預設了一個值為未定義的變數，變數名稱同樣命名為undefined。除此之外可以簡單利用下面兩種方式產生undefined的資料：
- 宣告無初始值變數。
- 使用void運算子。
利用這些方式可以進一步進行判斷，一些範例如下：
var myundefined;
var myundefined2 = void 0;
console.log(undefined); // undefined
console.log(myundefined); // undefined
console.log(myundefined2); // undefined
function func(val, opt) {
if(opt == undefined)
opt = true;
if(opt)
console.log('Default case:' + val);
else
console.log('Other case:' + val * 2);
}
func(123, false); // Other case:246
func(123); // Default case:123
7.2 全域變數
承接上文，undefined是JavaScript預設的一個全域變數，就像document之類的變數一樣，並不是一個保留字，這意思是不正確的使用可能會造成無法預料的結果：
console.log('undefined' in window); // true, 全域變數
undefined = 'trap';
console.log(undefined); // 在舊的瀏覽器結果會是 trap
現在較新的瀏覽器會防止你修改undefined這個變數，但較舊的瀏覽器，例如IE8以前的版本仍然會存在這個問題。
7.3 安全的使用undefined
承上一節所述，未避免其他地方有人修改了undefined的值而造成錯誤，我們可以自行建立undefined變數確保資料正確，如以下兩種方法：
// 宣告區域變數不指定初始值
var undefined;
console.log(undefined); // undefined
// 利用function建立區域範圍, 使用undefined參數名稱但不給值
(function(undefined){
console.log(undefined); // undefined
}())
7.4 變數比較
由於未定義意思空值類似，都是表示沒有資料，所以在比較上是相等的，但特別需要注意的是，未定義只和未定義與空值相等。
console.log(undefined == undefined); // true console.log(undefined == null); // true console.log(undefined == 0); // false console.log(undefined == false); // false
8. 空值(null)
8.1 語法
空值的值只有null一種，只能是小寫，表示沒有資料。
console.log(null); // null
8.2 變數比較
和未定義類似，空值只和空值與未定義相等。
console.log(null == null); // true console.log(null == undefined); // true console.log(null == 0); // false console.log(null == false); // false
8.3 移除變數
null本身表示沒有資料，可以指派給變數，但意思並不代表移除變數(未定義亦是如此)，必須使用delete運算子來移除變數：
var obj = {year: 2012, month:12, day: 21};
obj.day = null;
obj.month = undefined;
delete obj.year;
console.log(obj); // Object {day: null, month: undefined}
需注意只能用來移除以物件屬性建立的變數。
9. 函式(Function)
9.1 語法
在JavaScript中函式是一個特殊的型別，可以像是變數一樣操作，一般有以下三種方式可以建立函式：
- 函式敘述(statement)。
- 函式實字。
- 函式物件建構，最後一個參數為函式主體，前面的參數為函式介面參數名稱。
一些範例如下：
// 函式敘述
function func(x) { return x * x; }
// 函式實字
var func2 = function(x) { return x * x; };
var func3 = function square(x) { return x * x; };
var func4 = new Function('x', 'return x * x');
console.log(func(2)); // 4
console.log(func2(2)); // 4
console.log(func3(2)); // 4
console.log(func4(2)); // 4
console.log(func); // function func(x) { return x * x; }
console.log(func2); // function (x) { return x * x; }
console.log(func3); // function square(x) { return x * x; }
console.log(func4); // function anonymous(x) { return x * x }
從上面的範例可以看到，使用函式敘述的函式內部名稱會和函式名稱一致，函式實字則可省略，而函式物件則使用anonymous的名稱。
延伸閱讀
