前端JS數據類型

JS 5大原始類型:Undefined、Null、Boolean、Number 和 String。

原始數據值是一種沒有額外屬性和方法的單一簡單數據值。

typeof 運算符可返回以下原始類型之一:

  • string
  • number
  • boolean
  • undefined
typeof "Bill"              // 返回 "string"
typeof 3.14                // 返回 "number"
typeof true                // 返回 "boolean"
typeof false               // 返回 "boolean"
typeof x                   // 返回 "undefined" (假如 x 沒有值)

Undefined 與 Null 的區別

Undefined 與 null 的值相等,但類型不相等:

typeof undefined              // undefined
typeof null                   // object
null === undefined            // false
null == undefined             // true

 

複雜數據

typeof 運算符可返回以下兩種類型之一:

  • function
  • object

typeof 運算符把對象、數組或 null 返回 object。

typeof 運算符不會把函數返回 object。

typeof {name:'Bill', age:62} // 返回 "object"
typeof [1,2,3,4]             // 返回 "object" (並非 "array",參見下面的註釋)
typeof null                  // 返回 "object"
typeof function myFunc(){}   // 返回 "function"

typeof 運算符把數組返回爲 "object",因爲在 JavaScript 中數組即對象。

 

引用類型

引用類型通常叫做類(class),也就是說,遇到引用值,所處理的就是對象。

對象是由 new 運算符加上要實例化的對象的名字創建的。例如,下面的代碼創建 Object 對象的實例:

var o = new Object();

Object 對象

Object 對象自身用處不大,不過在瞭解其他類之前,還是應該瞭解它。因爲 ECMAScript 中的 Object 對象與 Java 中的 java.lang.Object 相似,ECMAScript 中的所有對象都由這個對象繼承而來,Object 對象中的所有屬性和方法都會出現在其他對象中,所以理解了 Object 對象,就可以更好地理解其他對象。

Object 對象具有下列屬性:

constructor

對創建對象的函數的引用(指針)。對於 Object 對象,該指針指向原始的 Object() 函數。

Prototype

對該對象的對象原型的引用。對於所有的對象,它默認返回 Object 對象的一個實例。

Object 對象還具有幾個方法:

hasOwnProperty(property)

判斷對象是否有某個特定的屬性。必須用字符串指定該屬性。(例如,o.hasOwnProperty("name"))

IsPrototypeOf(object)

判斷該對象是否爲另一個對象的原型。

PropertyIsEnumerable

判斷給定的屬性是否可以用 for...in 語句進行枚舉。

ToString()

返回對象的原始字符串表示。對於 Object 對象,ECMA-262 沒有定義這個值,所以不同的 ECMAScript 實現具有不同的值。

ValueOf()

返回最適合該對象的原始值。對於許多對象,該方法返回的值都與 ToString() 的返回值相同。

註釋:上面列出的每種屬性和方法都會被其他對象覆蓋。

 

String 對象

String 對象是 String 原始類型的對象表示法,它是以下方式創建的:

var oStringObject = new String("hello world");

String 對象的 valueOf() 方法和 toString() 方法都會返回 String 類型的原始值:

alert(oStringObject.valueOf() == oStringObject.toString());	//輸出 "true"

如果運行這段代碼,輸出是 "true",說明這些值真的相等。

註釋:String 對象是 ECMAScript 中比較複雜的引用類型之一。同樣,本節的重點只是 String 類的基本功能。更多的高級功能請閱讀本教程相關的章節,或參閱 JavaScript String 對象參考手冊

length 屬性

String 對象具有屬性 length,它是字符串中的字符個數:

var oStringObject = new String("hello world");
alert(oStringObject.length);	//輸出 "11"

這個例子輸出的是 "11",即 "hello world" 中的字符個數。注意,即使字符串包含雙字節的字符(與 ASCII 字符相對,ASCII 字符只佔用一個字節),每個字符也只算一個字符。

charAt() 和 charCodeAt() 方法

String 對象還擁有大量的方法。

首先,兩個方法 charAt() 和 charCodeAt() 訪問的是字符串中的單個字符。這兩個方法都有一個參數,即要操作的字符的位置。

charAt() 方法返回的是包含指定位置處的字符的字符串:

var oStringObject = new String("hello world");
alert(oStringObject.charAt(1));	//輸出 "e"

在字符串 "hello world" 中,位置 1 處的字符是 "e"。在“ECMAScript 原始類型”這一節中我們講過,第一個字符的位置是 0,第二個字符的位置是 1,依此類推。因此,調用 charAt(1) 返回的是 "e"。

如果想得到的不是字符,而是字符代碼,那麼可以調用 charCodeAt() 方法:

var oStringObject = new String("hello world");
alert(oStringObject.charCodeAt(1));	//輸出 "101"

這個例子輸出 "101",即小寫字母 "e" 的字符代碼。

concat() 方法

接下來是 concat() 方法,用於把一個或多個字符串連接到 String 對象的原始值上。該方法返回的是 String 原始值,保持原始的 String 對象不變:

var oStringObject = new String("hello ");
var sResult = oStringObject.concat("world");
alert(sResult);		//輸出 "hello world"
alert(oStringObject);	//輸出 "hello "

在上面這段代碼中,調用 concat() 方法返回的是 "hello world",而 String 對象存放的仍然是 "hello "。出於這種原因,較常見的是用加號(+)連接字符串,因爲這種形式從邏輯上表明瞭真正的行爲:

var oStringObject = new String("hello ");
var sResult = oStringObject + "world";
alert(sResult);		//輸出 "hello world"
alert(oStringObject);	//輸出 "hello "

indexOf() 和 lastIndexOf() 方法

迄今爲止,已討論過連接字符串的方法,訪問字符串中的單個字符的方法。不過如果無法確定在某個字符串中是否確實存在一個字符,應該調用什麼方法呢?這時,可調用 indexOf() 和 lastIndexOf() 方法。

indexOf() 和 lastIndexOf() 方法返回的都是指定的子串在另一個字符串中的位置,如果沒有找不到子串,則返回 -1。

這兩個方法的不同之處在於,indexOf() 方法是從字符串的開頭(位置 0)開始檢索字符串,而 lastIndexOf() 方法則是從字符串的結尾開始檢索子串。例如:

var oStringObject = new String("hello world!");
alert(oStringObject.indexOf("o"));		輸出 "4"
alert(oStringObject.lastIndexOf("o"));	輸出 "7"

在這裏,第一個 "o" 字符串出現在位置 4,即 "hello" 中的 "o";最後一個 "o" 出現在位置 7,即 "world" 中的 "o"。如果該字符串中只有一個 "o" 字符串,那麼 indexOf() 和 lastIndexOf() 方法返回的位置相同。

localeCompare() 方法

下一個方法是 localeCompare(),對字符串進行排序。該方法有一個參數 - 要進行比較的字符串,返回的是下列三個值之一:

  • 如果 String 對象按照字母順序排在參數中的字符串之前,返回負數。
  • 如果 String 對象等於參數中的字符串,返回 0
  • 如果 String 對象按照字母順序排在參數中的字符串之後,返回正數。

註釋:如果返回負數,那麼最常見的是 -1,不過真正返回的是由實現決定的。如果返回正數,那麼同樣的,最常見的是 1,不過真正返回的是由實現決定的。

示例如下:

var oStringObject = new String("yellow");
alert(oStringObject.localeCompare("brick"));		//輸出 "1"
alert(oStringObject.localeCompare("yellow"));		//輸出 "0"
alert(oStringObject.localeCompare("zoo"));		//輸出 "-1"

在這段代碼中,字符串 "yellow" 與 3 個值進行了對比,即 "brick"、"yellow" 和 "zoo"。由於按照字母順序排列,"yellow" 位於 "brick" 之後,所以 localeCompare() 返回 1;"yellow" 等於 "yellow",所以 localeCompare() 返回 0;"zoo" 位於 "yellow" 之後,localeCompare() 返回 -1。再強調一次,由於返回的值是由實現決定的,所以最好以下面的方式調用 localeCompare() 方法:

var oStringObject1 = new String("yellow");
var oStringObject2 = new String("brick");

var iResult = oStringObject1.localeCompare(oStringObject2);

if(iResult < 0) {
  alert(oStringObject1 + " comes before " + oStringObject2);
} else if (iResult > 0) {
  alert(oStringObject1 + " comes after " + oStringObject2);
} else {
  alert("The two strings are equal");
}

採用這種結構,可以確保這段代碼在所有實現中都能正確運行。

localeCompare() 方法的獨特之處在於,實現所處的區域(locale,兼指國家/地區和語言)確切說明了這種方法運行的方式。在美國,英語是 ECMAScript 實現的標準語言,localeCompare() 是區分大小寫的,大寫字母在字母順序上排在小寫字母之後。不過,在其他區域,情況可能並非如此。

slice() 和 substring()

ECMAScript 提供了兩種方法從子串創建字符串值,即 slice() 和 substring()。這兩種方法返回的都是要處理的字符串的子串,都接受一個或兩個參數。第一個參數是要獲取的子串的起始位置,第二個參數(如果使用的話)是要獲取子串終止前的位置(也就是說,獲取終止位置處的字符不包括在返回的值內)。如果省略第二個參數,終止位就默認爲字符串的長度。

與 concat() 方法一樣,slice() 和 substring() 方法都不改變 String 對象自身的值。它們只返回原始的 String 值,保持 String 對象不變。

var oStringObject = new String("hello world");
alert(oStringObject.slice("3"));		//輸出 "lo world"
alert(oStringObject.substring("3"));		//輸出 "lo world"
alert(oStringObject.slice("3", "7"));		//輸出 "lo w"
alert(oStringObject.substring("3", "7"));	//輸出 "lo w"

在這個例子中,slice() 和 substring() 的用法相同,返回值也一樣。當只有參數 3 時,兩個方法返回的都是 "lo world",因爲 "hello" 中的第二個 "l" 位於位置 3 上。當有兩個參數 "3" 和 "7" 時,兩個方法返回的值都是 "lo w"("world" 中的字母 "o" 位於位置 7 上,所以它不包括在結果中)。

爲什麼有兩個功能完全相同的方法呢?事實上,這兩個方法並不完全相同,不過只在參數爲負數時,它們處理參數的方式才稍有不同。

對於負數參數,slice() 方法會用字符串的長度加上參數,substring() 方法則將其作爲 0 處理(也就是說將忽略它)。例如:

var oStringObject = new String("hello world");
alert(oStringObject.slice("-3"));		//輸出 "rld"
alert(oStringObject.substring("-3"));	//輸出 "hello world"
alert(oStringObject.slice("3, -4"));		//輸出 "lo w"
alert(oStringObject.substring("3, -4"));	//輸出 "hel"

這樣即可看出 slice() 和 substring() 方法的主要不同。

當只有參數 -3 時,slice() 返回 "rld",substring() 則返回 "hello world"。這是因爲對於字符串 "hello world",slice("-3") 將被轉換成 slice("8"),而 substring("-3") 將被轉換成 substring("0")。

同樣,使用參數 3 和 -4 時,差別也很明顯。slice() 將被轉換成 slice(3, 7),與前面的例子相同,返回 "lo w"。而 substring() 方法則將兩個參數解釋爲 substring(3, 0),實際上即 substring(0, 3),因爲 substring() 總把較小的數字作爲起始位,較大的數字作爲終止位。因此,substring("3, -4") 返回的是 "hel"。這裏的最後一行代碼用來說明如何使用這些方法。

toLowerCase()、toLocaleLowerCase()、toUpperCase() 和 toLocaleUpperCase()

最後一套要討論的方法涉及大小寫轉換。有 4 種方法用於執行大小寫轉換,即

  • toLowerCase()
  • toLocaleLowerCase()
  • toUpperCase()
  • toLocaleUpperCase()

從名字上可以看出它們的用途,前兩種方法用於把字符串轉換成全小寫的,後兩種方法用於把字符串轉換成全大寫的。

toLowerCase() 和 toUpperCase() 方法是原始的,是以 java.lang.String 中相同方法爲原型實現的。

toLocaleLowerCase() 和 toLocaleUpperCase() 方法是基於特定的區域實現的(與 localeCompare() 方法相同)。在許多區域中,區域特定的方法都與通用的方法完全相同。不過,有幾種語言對 Unicode 大小寫轉換應用了特定的規則(例如土耳其語),因此必須使用區域特定的方法才能進行正確的轉換。

var oStringObject = new String("Hello World");
alert(oStringObject.toLocaleUpperCase());	//輸出 "HELLO WORLD"
alert(oStringObject.toUpperCase());		//輸出 "HELLO WORLD"
alert(oStringObject.toLocaleLowerCase());	//輸出 "hello world"
alert(oStringObject.toLowerCase());		//輸出 "hello world"

這段代碼中,toUpperCase() 和 toLocaleUpperCase() 輸出的都是 "HELLO WORLD",toLowerCase() 和 toLocaleLowerCase() 輸出的都是 "hello world"。一般來說,如果不知道在以哪種編碼運行一種語言,則使用區域特定的方法比較安全。

提示:記住,String 對象的所有屬性和方法都可應用於 String 原始值上,因爲它們是僞對象。

instanceof 運算符

在使用 typeof 運算符時採用引用類型存儲值會出現一個問題,無論引用的是什麼類型的對象,它都返回 "object"。ECMAScript 引入了另一個 Java 運算符 instanceof 來解決這個問題。

instanceof 運算符與 typeof 運算符相似,用於識別正在處理的對象的類型。與 typeof 方法不同的是,instanceof 方法要求開發者明確地確認對象爲某特定類型。例如:

var oStringObject = new String("hello world");
alert(oStringObject instanceof String);	//輸出 "true"

這段代碼問的是“變量 oStringObject 是否爲 String 對象的實例?”oStringObject 的確是 String 對象的實例,因此結果是 "true"。儘管不像 typeof 方法那樣靈活,但是在 typeof 方法返回 "object" 的情況下,instanceof 方法還是很有用的。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章