JavaScript學習小結(一)——JavaScript入門基礎_javascript技巧

一、JavaScript語言特點

1.1、JavaScript是基於對象和事件驅動的(動態)

　　它可以直接對使用者或客戶輸入做出響應，無須經過Web服務程式。它對使用者的響應，是採用以事件驅動的方式進行的。所謂事件驅動，就是指在首頁中執行了某種操作所產生的動作，就稱為“事件”。比如按下滑鼠，移動視窗，選擇菜單等都可以視為事件。當事件發生後，可能會引起相應的事件響應。

1.2、JavaScript是跨平台的

　　JavaScript是依賴於瀏覽器本身的，與作業系統無關。

二、JavaScript變數

2.1、定義變數

　　在定義變數時，統一使用"var 變數名"表示，例如：var str;甚至可以省略var這個關鍵字

2.2、JavaScript變數的類型如何決定

　　JavaScript中變數的資料類型是由JS引擎決定的

 var name="孤傲蒼狼";//name是string類型 var age=;//age是number類型 var flag=true;//flag是boolean類型 var email;//email只是聲明，沒有賦值，因此代表的類型是"undefined"，也就是無法確定 name=;//name自動變成了number類型

2.3、使用typeof關鍵字查看變數代表的具體資料類型

　　typeof 運算子有一個參數，即要檢查的變數或值。例如：

 var sTemp = "test string"; alert (typeof sTemp);  //輸出 "string" alert (typeof );  //輸出 "number"

對變數或值調用typeof運算子將返回下列值之一：

undefined - 如果變數是 Undefined 類型的

boolean - 如果變數是 Boolean 類型的

number - 如果變數是 Number 類型的

string - 如果變數是 String 類型的

object - 如果變數是一種參考型別或 Null 類型的

測試代碼：

<script type="text/javascript">   var name="孤傲蒼狼";//name是string類型   alert("name是"+typeof name+"類型");   var age=;//age是number類型   alert("age是"+typeof age+"類型");   var flag=true;//flag是boolean類型   alert("flag的類型是："+typeof flag);   name=;//name自動變成了number類型   alert("name變數重新賦值後，name的資料類型變成了："+typeof name);   var email;//email只是聲明，沒有賦值，因此代表的類型是"undefined"，也就是無法確定   alert("email的類型是："+typeof email );   var a=null; /* 為什麼 typeof 運算子對於 null 值會返回 "Object"。 這實際上是 JavaScript 最初實現中的一個錯誤，然後被 ECMAScript 沿用了。現在，null 被認為是對象的預留位置，從而解釋了這一矛盾，但從技術上來說，它仍然是原始值。 */   alert("a是"+typeof a +"類型");  </script>

運行結果：

 三、JavaScript資料類型

　　

　　JavaScript包含兩種不同資料類型：基礎資料型別 (Elementary Data Type)和引用資料類型。基本類型指的是簡單的資料，參考型別指由多個值構成的對象。當我們把值賦值給一個變數時，解析器首先要做的就是確認這個值是基本類型值還是參考型別值。

3.1、基礎資料型別 (Elementary Data Type)

　　常見的五種基礎資料型別 (Elementary Data Type)：

Boolean
Number
String
Undifined
Null　　

這五種基礎資料型別 (Elementary Data Type)可以直接操作儲存在變數中的實際值。

3.1.1、數實值型別(Number)和布爾類型(Boolean)

　　看下面的代碼：

 <script type="text/javascript">   var a = ;   var b = a;     b = ;   alert("a="+a);//列印a=      var b = true;   var b = b;     b = false;   alert("b="+b);//列印b=true </script>

　運行結果：

　　從運行結果可以看出，b的值是a值的一份拷貝，雖然，兩個變數的值是相等，但是兩個變數儲存兩不同的基礎資料型別 (Elementary Data Type)值。b只是儲存了a複製的一個副本。所以，當b的值改變成20時，a的值依然是10。兩個Boolean變數b1和b2同樣是基礎資料型別 (Elementary Data Type)，同樣儲存兩個不同的基本資料據類型值，b2儲存1複製的一個副本。所以，當b2的值改變成false時，b1的值依然是true。

下圖示範了這種基礎資料型別 (Elementary Data Type)賦值的過程：

棧記憶體

 

3.1.2、字串類型(String)

　　JavaScript中的字串String一個特殊的基礎資料型別 (Elementary Data Type)，在很多語言中，String是以對象的形式表示的，但在JavaScript裡，String是當作一種基礎資料型別 (Elementary Data Type)，是通值傳遞的方式來操作。但它是一個比較特殊的基本類型。

看下面例子：

<script type="text/javascript">   var strA = "這是字串";   var strB = strA;     strA = "這是另外一個字串";     alert("strB="+strB); </script>

運行結果：

　　

　　從運行結果可以看到，彷彿strA通過值傳遞的方式複製了一份給了strB。當strA改變的時候，strB並沒有改變，似乎我們已經可以下結論，String就是個基礎資料型別 (Elementary Data Type)。

可是，因為String是可以任意長度的，通過值傳遞，一個一個的複製位元組顯示效率依然很低，看起來String也可以當作參考型別。

看下面例子：

 var a = "myobject"; a.name = "myname";//為字串a動態添加name屬性 alert("a.name="+a.name); //訪問a的name屬性，

結果顯示：a.name=undefined

運行結果：

　　

　　運行結果顯示，String無法當作一個對象來處理。這也證明了一點：基本類型雖然也可以添加屬性，也不會報錯，經測試添加完之後卻是無法訪問的，實際上，javascript裡的String是不可以改變的，javascript也沒有提供任何一個改變字串的方法和文法。

看下面的例子：

 var b = "myobject"; b = b.substring(,); alert("b="+b); // b=bj

運行結果：

　　

　　這樣做，沒並有改變String字串"myobject"，只b引用了另一個字串"bj"，"myobject"被回收了。

　　所以可以這樣講，String實際上並不符合上面兩種資料類型分類。它是具有兩方面屬性介於兩都之間的一種特殊類型。

3.1.3、Null 類型

　　Null類型只有一個專用值 null，值 undefined 實際上是從值 null 派生來的，因此 ECMAScript 把它們定義為相等的。

  <script type="text/javascript">    alert("null == undefined的結果是："+(null == undefined)); //輸出 "true"  </script>

運行結果：

　　

　　儘管這兩個值相等，但它們的含義不同。undefined 是聲明了變數但未對其初始化時賦予該變數的值，null 則用於表示尚未存在的對象（typeof 運算子對於 null 值會返回 "Object"。）。如果函數或方法要返回的是對象，那麼找不到該對象時，返回的通常是 null。

3.1.4、Undefined 類型

　　Undefined 類型只有一個值，即 undefined。當聲明的變數未初始化時，該變數的預設值是 undefined。

var oTemp;

　　前面一行代碼聲明變數 oTemp，沒有初始值。該變數將被賦予值 undefined，即 undefined 類型的字面量。可以用下面的程式碼片段測試該變數的值是否等於 undefined：

 <script type="text/javascript">   var oTemp;   alert("oTemp == undefined的結果是："+(oTemp == undefined));//輸出 "true"  </script>

運行結果：

　　

　　運行結果顯示 "true"，說明這兩個值確實相等。

　　可以用 typeof 運算子顯示該變數所代表的的資料類型是undefined類型

 <script type="text/javascript">   var oTemp;   alert("typeof oTemp的結果是："+typeof oTemp); //輸出 "undefined"  </script>

　　值 undefined 並不同於未定義的值。但是，typeof 運算子並不真正區分這兩種值。考慮下面的代碼：

 <script type="text/javascript">   var oTemp;   alert("oTemp變數有聲明，typeof oTemp的結果是："+typeof oTemp); //輸出 "undefined"   alert("oTemp變數沒有聲明，typeof oTemp的結果是："+typeof oTemp); //輸出 "undefined"  </script>

運行結果：

　　兩個變數輸出的都是 "undefined"，即使只有變數 oTemp2 從未被聲明過。如果對oTemp2 使用除 typeof 之外的其他運算子的話，會引起錯誤，因為其他運算子只能用於已聲明的變數上。

　　下面的代碼將引發錯誤：

var oTemp; alert(oTemp == undefined);//'oTemp' 未定義

　　當函數無明確傳回值時，返回的也是值 "undefined"，如下所示：

function testFunc() {    //這是一個空函數，沒有傳回值 } alert("testFunc() == undefined的結果是："+(testFunc() == undefined)); //輸出 "true"

運行結果：

　　

3.2、引用資料類型

　　javascript引用資料類型是儲存在堆記憶體中的對象，JavaScript不允許直接存取堆記憶體空間中的位置和操作堆記憶體空間，只能通過操作對象在棧記憶體中的引用地址。所以參考型別的資料，在棧記憶體中儲存的實際上是對象在堆記憶體中的引用地址。通過這個引用地址可以快速尋找到儲存在堆記憶體中的對象。

看下面的例子：

 <script type="text/javascript">   var obj = new Object();   var obj = obj;   obj.name = "孤傲蒼狼";   alert(obj.name); // 孤傲蒼狼 </script>

運行結果：

　　

　　由上面例子，我們聲明了一個引用資料類型變數obj1，並把它賦值給了另外一個引用資料類型變數obj2。當我們obj2添加了一個name屬性並賦值" 孤傲蒼狼"。obj1同樣擁有了和obj2一樣的name屬性。說明這兩個引用資料類型變數指向同一個對象。obj1賦值給obj2，實際只是把這個對象在棧記憶體的引用地址複製了一份給了obj2，但它們本質上共同指向了堆記憶體中的同一個對象。

下面我們來示範這個引用資料類型賦值過程

　　　　

自然，給obj2添加name屬性，實際上是給堆記憶體中的對象添加了name屬性，obj2和obj1在棧記憶體中儲存的只是堆記憶體對象的引用地址，雖然也是拷貝了一份，但指向的對象卻是同一個。故而改變obj2引起了obj1的改變。

　　一般而言，基礎資料型別 (Elementary Data Type)是由固定數目的位元組組成，這些位元組可以在解析器的較底層進行操作，比如Number和 Boolean；而引用資料類型，可以包含任意數目的屬性和元素，因此它們無法像基礎資料型別 (Elementary Data Type)那樣很容易的操作。

由於，引用資料類型的值是會發生變化的， 所以通過跟基礎資料型別 (Elementary Data Type)一樣的值傳遞方式，也就沒什麼意義了，因為會牽涉到大量的記憶體的複製和比較，效率太低。所以引用資料類型是通過引用傳遞方式，實際傳遞的只是對象的一個地址。

比如Array和Function，因為它們都是特殊的對象所以它們都是參考型別。另外，參考型別是可以添加屬性，基本類型雖然也可以添加屬性，也不會報錯，經測試添加完之後卻是無法訪問的。