JavaScript 教學筆記 (2) – 變數與資料型別

變數宣告變數不管在哪個程式語言當中都一定會使用到，因為有變數的存在我們才能夠設計各種形形色色的軟體，而變數主要的功用就是在記憶體位置中，存放我們所要處理的資料內容。

變數宣告

變數不管在哪個程式語言當中都一定會使用到，因為有變數的存在我們才能夠設計各種形形色色的軟體，而變數主要的功用就是在記憶體位置中，存放我們所要處理的資料內容。
在 JavaScript 中宣告變數的方法有兩種

舉例：

    <script>
        var a = 10; //宣告變數 a 並設定值為 10
        b = 20; //宣告變數 b 並設定值為 20
        
        document.write("變數 a:",a,"<br>");
        document.write("變數 b:",b,"<br>");
    </script>

執行結果：

變數 a:10
變數 b:20

這段範例程式碼可以正常的被執行並不會產生任何錯誤，不過既然可以直接設定變數那麼為何要加上 var 來宣告變數，這主要是因為是否加上 var 所宣告的變數定義是不同的，有加上 var 表示區域變數，而沒有加上 var 表示全域變數，有關區域變數以及全域變數的說明之後再來介紹。

資料型別

在 JavaScript 當中資料型別有以下幾種：

String：字串 - 基本型別

Number：數值 - 基本型別

Boolean：布林 - 基本型別

Array：陣列 - 複合型別

Object：物件 - 複合型別

null：空值 - 簡單型別

undefined：未定義 - 簡單型別

function：函示 - 特殊型別

由於 JavaScript 是屬於弱型別的程式語言，所以要宣告成什麼型別則是看給定的值來決定變數型別

舉例：

    <script>
        var a = 10; //number
        var b = "文字"; //string
        var c = false; //boolean
        var d = new Array(1,2,3); //object 雖宣告 Array 但是型態仍是屬於物件
        var e = function abc(){}; // function
        
        document.write("變數 a 型別：", typeof(a),"<br>");
        document.write("變數 b 型別：",typeof(b),"<br>");
        document.write("變數 c 型別：", typeof(c),"<br>");
        document.write("變數 d 型別：",typeof(d),"<br>");
        document.write("變數 d 型別：",typeof(e),"<br>");
        document.write("null 型別：",typeof(null),"<br>"); // null 型別的型態屬於物件
        document.write("undefined 型別：",typeof(undefined),"<br>");
    </script>

執行結果：

變數 a 型別：number
變數 b 型別：string
變數 c 型別：boolean
變數 d 型別：object
變數 d 型別：function
null 型別：object
undefined 型別：undefined

型別轉換

在程式語言中經常會對變數做操作，但是不同型別的變數無法正確的被運行，這個時候我們就需要進行型別的轉換，而其中最常轉換的型別就是轉成 Number 數值以及 String 字串了。

首先我們先來看如何轉成字串型別，要轉成字串型別有兩種函式

String()

toString()

舉例：

    <script>
        var a = 10; //number
        document.write("變數 a 原本型別：", typeof(a),"<br>");
        a = a.toString(); //轉成 string
        document.write("變數 a 轉換型別：", typeof(a),"<br>");
        
        var b = 10; //number
        document.write("變數 b 原本型別：", typeof(b),"<br>");
        b = String(b); //轉成 string
        document.write("變數 b 轉換型別：", typeof(b),"<br>");
    </script>

執行結果：

變數 a 原本型別：number
變數 a 轉換型別：string
變數 b 原本型別：number
變數 b 轉換型別：string

不過一般我們很少用到轉成字串這個函式，因為在 JavaScript 中有隱含轉換，也就是程式會自動轉換型別，這主要是在串組字串時會自動發生。

舉例：

    <script>
        var a = 10; //number
        document.write("變數 a 原本型別：", typeof(a),"<br>");
        
        var b = "單位"; // string
        document.write("變數 b 原本型別：", typeof(b),"<br>");
      
        var c = a + b; // 將變數 a,b 相加
        document.write("變數 c 值為：", c,"<br>");
        document.write("變數 c 型別：", typeof(c),"<br>");
    </script>

執行結果：

變數 a 型別：number
變數 b 型別：string
變數 c 值為：10單位
變數 c 型別：string

在這個範例中，我們並沒有針對變數 a 進行字串型別的轉換，僅僅只是將 Number 型別與 String 型別作相加的動作，此時 JavaScript 會自動的認為我們是要將變數 a 轉成字串型別來與變數 b 組合成一組新的字串。

接下來我們再來看看數值的轉型，而轉型方法也有以下幾種

parseInt()

Number()

舉例：

    <script>
        var a = "10"; //string
        document.write("變數 a 原本型別：", typeof(a),"<br>");
        a = Number(a); //轉成 Number
        document.write("變數 a 轉換型別：", typeof(a),"<br>");
        
        var b = "20"; // string
        document.write("變數 b 原本型別：", typeof(b),"<br>");
        b = parseInt(b); //轉成 Number
        document.write("變數 b 轉換型別：", typeof(b),"<br>");
      
        var c = a + b; // 將變數 a,b 相加
        document.write("變數 c 值為：", c,"<br>");
        document.write("變數 c 型別：", typeof(c),"<br>");
    </script>