一、簡(jiǎn)介

• 它是 JavaScript 的一個(gè)超集

• TypeScript 語(yǔ)言是完全支持 ES6 語(yǔ)法的

• TypeScript就是相當(dāng)于JavaScript的增強(qiáng)版，但是最后運(yùn)行時(shí)還要編譯成JavaScript

• TypeScript和JavaScript的對(duì)比

    TypeScript是一個(gè)應(yīng)用程序級(jí)的JavaScript開發(fā)語(yǔ)言。（這也表示TypeScript比較牛逼，可以開發(fā)大型應(yīng)用，或者說(shuō)更適合開發(fā)大型應(yīng)用）
    TypeScript是JavaScript的超集，可以編譯成純JavaScript。這個(gè)和我們CSS離的Less或者Sass是很像的，
    我們用更好的代碼編寫方式來(lái)進(jìn)行編寫，最后還是有好生成原生的JavaScript語(yǔ)言。
    TypeScript跨瀏覽器、跨操作系統(tǒng)、跨主機(jī)、且開源。由于最后他編譯成了JavaScript所以只要能運(yùn)行JS的地方，都可以運(yùn)行我們寫的程序，設(shè)置在node.js里。
    TypeScript始于JavaScript，終于JavaScript。遵循JavaScript的語(yǔ)法和語(yǔ)義
    TypeScript可以重用JavaScript代碼，調(diào)用流行的JavaScript庫(kù)。
    TypeScript提供了類、模塊和接口，更易于構(gòu)建組件和維護(hù)。
  

二、開發(fā)環(huán)境的安裝

• 安裝node

    node -v
    npm -v
  

• 安裝TypeScript包

    npm install -g typescript
    tsc --version
    如果是mac電腦，要使用sudo npm install typescript -g指令進(jìn)行安裝
  

• 編寫HelloWorld程序

    1、新建文件夾，進(jìn)入文件夾，使用npm init -y來(lái)初始化項(xiàng)目，生成package.json文件
    2、創(chuàng)建tsconfig.json文件，在終端中輸入tsc --init：它是一個(gè)TypeScript項(xiàng)目的配置文件，可以通過(guò)讀取它來(lái)設(shè)置TypeScript編譯器的編譯參數(shù)。
    3、安裝@types/node,使用npm install @types/node --dev-save進(jìn)行安裝。這個(gè)主要是解決模塊的聲明文件問(wèn)題。
    前三步可以不用配置
    4、編寫hello.ts文件，然后進(jìn)行保存
    5、編譯tsc hello.ts 為hello.js
    6、執(zhí)行js node hello.js
  

三、變量類型

• 特點(diǎn)

    強(qiáng)類型，在聲明變量的時(shí)候，我們必須給他一個(gè)類型
  

• JS類型

    分為兩種：原始數(shù)據(jù)類型 :undefined、null、布爾值（Boolean）、字符串（String）、數(shù)值（Number）
    對(duì)象類型 ：對(duì)象（Object）
  

• 類型劃分

    Undefined :
    Number:數(shù)值類型;
    string : 字符串類型;
    Boolean: 布爾類型；
    enum：枚舉類型；
    any : 任意類型，一個(gè)牛X的類型；
    Null ：空類型
    void：空類型；
    Array : 數(shù)組類型;
    Tuple : 元祖類型；
  

• Undefined類型

    var age:number//聲明數(shù)值類型的變量age，但不予賦值
    console.log(age)
    打?。簎ndefined
    未賦值的變量就是undefined類型
  

• Number類型
  在TypeScript中，所有的數(shù)字都是Number類型，這不分是整數(shù)還是小數(shù)

    var age:number = 18
    var stature:number = 178.5
    console.log(age)
    console.log(stature)
    特殊的Number類型
    1、NaN：它是Not a Number 的簡(jiǎn)寫，意思就是不是一個(gè)數(shù)值
    （如果一個(gè)計(jì)算結(jié)果或者函數(shù)的返回值本應(yīng)該是數(shù)值，但是由于種種原因，他不是數(shù)字。出現(xiàn)這種狀況不會(huì)報(bào)錯(cuò)，而是把它的結(jié)果看成了NaN。）
    2、Infinity :正無(wú)窮大；-Infinity：負(fù)無(wú)窮大。
  

• String類型
  由單引號(hào)或者雙引號(hào)括起來(lái)的一串字符就是字符串,比如：“china”,'我是格魯特'

    var jspang:string = "我是格魯特"
    console.log(jspang)
  

• boolean布爾類型
  作任何業(yè)務(wù)邏輯判斷都要有布爾類型的參與，通過(guò)對(duì)與錯(cuò)的判斷是最直觀的邏輯處理。boolean類型只有兩種值，true和false。

    var b:boolean = true
    var c:boolean = false
  

• enum 類型
  如果變量的結(jié)果是固定的幾個(gè)數(shù)據(jù)時(shí)，我們就可以使用枚舉類型
  比如：世界上人的類型：男人、女人、中性
  一年的季節(jié)：春、夏、秋、冬 ，有四個(gè)結(jié)果

    enum REN{ nan , nv ,yao}
    console.log(REN.yao)  //返回了2，這是索引index，跟數(shù)組很像。
  
    枚舉賦值，可以直接使用=,來(lái)進(jìn)行賦值
    enum REN{
        nan = '男',
        nv = '女',
        yao= '妖'
    }
    console.log(REN.yao)  //返回了妖 這個(gè)字
  

• any類型
  程序中不斷變化著類型，又不想讓程序報(bào)錯(cuò)，這時(shí)候就可以使用any了

    var t:any =10 
    t = "jspang"
    t = true
    console.log(t)//打印true
  

• Null類型
  與 Undefined 類似，都代表空。Null 代表是引用類型為空，在js基礎(chǔ)總結(jié)中有詳細(xì)記錄

四、TypeScript的函數(shù)

• 注意點(diǎn)
  1、聲明（定義）函數(shù)必須加 function 關(guān)鍵字；
  2、函數(shù)名與變量名一樣，命名規(guī)則按照標(biāo)識(shí)符規(guī)則；
  3、函數(shù)參數(shù)可有可無(wú)，多個(gè)參數(shù)之間用逗號(hào)隔開；
  4、每個(gè)參數(shù)參數(shù)由名字與類型組成，之間用分號(hào)隔開；
  5、函數(shù)的返回值可有可無(wú)，沒(méi)有時(shí)，返回類型為 void；

  function zhengXing():void{
        var yangzi = 'Thor'
            console.log(yangzi)
        }
        zhengXing()//Thor
  

  6、大括號(hào)中是函數(shù)體。

• 基本實(shí)例
  函數(shù)聲明法

    function searchXiaoJieJie(age:number):string{
        return '找到了'+age+'歲的小姐姐' 
    }
    var age:number = 18
    var result:string = searchXiaoJieJie(age)
    console.log(result)//找到了18歲的小姐姐
  
    函數(shù)表達(dá)式法
    var searchXiaoJieJie = function(age:number):string{
        return '找到了'+age+'歲的小姐姐'
    }
  

• 有可選參數(shù)的函數(shù)

    定義一個(gè)可傳可不傳的參數(shù)，通過(guò)?標(biāo)注
    function searchXiaoJieJie2(age:number,stature?:string):string{
    let yy:string = ''
        yy = '找到了'+age+'歲'
        if(stature !=undefined){//未傳入值為undefined類型
            yy = yy + stature
        }
        return yy+'的小姐姐'
    }
    var result:string  =  searchXiaoJieJie2(22)//第二個(gè)參數(shù)可以不傳
    console.log(result)//找到了22歲的小姐姐
  

• 有默認(rèn)參數(shù)的函數(shù)

    不傳遞的時(shí)候，函數(shù)會(huì)給我們一個(gè)默認(rèn)值，而不是undefined了
    function searchXiaoJieJie2(age:number=18,stature:string='大胸'):string{
        let yy:string = ''
        yy = '找到了'+age+'歲'
        if(stature !=undefined){
            yy = yy + stature
        }
        return yy+'的小姐姐'
    }
    var result:string  =  searchXiaoJieJie2()
    console.log(result)//找到了18歲大胸的小姐姐
  

• 有剩余參數(shù)的函數(shù)

    傳遞的參數(shù)不確定也不固定的時(shí)候
    剩余參數(shù)就是形參是一個(gè)數(shù)組，傳遞幾個(gè)實(shí)參過(guò)來(lái)都可以直接存在形參的數(shù)組中
    function searchXiaoJieJie3(...xuqiu:string[]):string{//...ES6擴(kuò)展運(yùn)算符
        let  yy:string = '找到了'
        for (let i =0;i<xuqiu.length;i++){
            yy = yy + xuqiu[i]
            if(i<xuqiu.length){
                yy=yy+'、'
            }
        }
        yy=yy+'的小姐姐'
        return yy
    }
    var result:string  =  searchXiaoJieJie3('22歲','大長(zhǎng)腿','瓜子臉','水蛇腰')
    console.log(result)//找到了22歲、大長(zhǎng)腿、瓜子臉、水蛇腰、的小姐姐
  

• 可使用箭頭函數(shù)

    var add = (n1:number,n2:number):number=>{
        return n1+n2
    }
    console.log(add(1,4))//5