Typescript Handbook 精簡版之變量聲明

aisuhua 發布于2019-08-19 17:34 / 2263人閱讀

摘要：變量聲明和是新出的兩個變量聲明的方式。而新版的引入了關鍵字，用以聲明一個塊級域的本地變量，這樣能避免一些問題。作為的超集，自然也是支持和的。這意味著變量可以在聲明之前使用，這個行為叫做。本文參考變量聲明翻譯版變量聲明參考文檔參考文檔參考文檔

變量聲明

let 和 const 是JavaScript新出的兩個變量聲明的方式。前面說過let 和 var類似，但是它們的作用域是不一樣的。

關于作用域，在ES6之前的Javascript中，函數體是唯一能能夠創建新作用域的地方。那時候沒有let，用var聲明的變量，作用域要么是全局，要么是函數體，沒有塊級的作用域（塊作用域變量在包含它們的塊外部或for循環外部是不能被訪問的）。而新版的Javascript引入了let關鍵字，用以聲明一個塊級域的本地變量，這樣能避免一些問題。

至于const，它的作用域和let一樣，但是是聲明創建一個只讀常量，這里要注意一下，這并不意味著該常量指向的值不可變，而是該常量只能被賦值一次！

舉個例子：

// numLivesForCat的值不能再變了
const numLivesForCat = 9;
const kitty = {
    name: "Aurora",
    numLives: numLivesForCat,
}

// 錯誤，kitty指向的對象不能變
kitty = {
    name: "Danielle",
    numLives: numLivesForCat
};

// 沒問題，對象的屬性可以變化
kitty.name = "Rory";
kitty.name = "Kitty";
kitty.name = "Cat";
kitty.numLives--;

另外，使用const定義常量時，一定要初始化。

Typescript作為Javascript的超集，自然也是支持let和const的。

該用哪個

const沒什么好說的，你需要常量就用它，不需要就不用。但是let和var要比較一下。

使用var聲明變量時，不管你聲明多少次，你得到的只有一個變量，而使用let時，同一個變量名在同一作用域內聲明一次以上會報錯。

使用var時很容易出bug，比如：

function sumMatrix(matrix: number[][]) {
    var sum = 0;
    for (var i = 0; i < matrix.length; i++) {
        var currentRow = matrix[i];
        for (var i = 0; i < currentRow.length; i++) {
            sum += currentRow[i];
        }
    }

    return sum;
}

里層for循環中的i會覆蓋外層的i，因為i引用的都是相同的函數作用域內的變量。

但是如果把var換成let，內層的for循環自己是一個塊級作用域，會屏蔽外部的作用域中的相同名字的變量，所以這兩個i會井水不犯河水。

另外，因為var是函數作用域，所以對于一個var聲明的變量，你可以先使用再聲明：

bla = 2;
var bla;
// ...

// 可以理解為下面這樣：

var bla;
bla = 2;

引用一段mozilla文檔中的話：

由于變量聲明（以及其他聲明）總是在任意代碼執行之前處理的，所以在代碼中的任意位置聲明變量總是等效于在代碼開頭聲明。這意味著變量可以在聲明之前使用，這個行為叫做“hoisting”。

嗯，使用var時，這叫變量聲明提升，但是如果你使用let時也這樣做，這叫錯誤！ 塊級作用域的變量的一個特點是，它們不能在被聲明之前使用。

最后，建議盡量用let替換var。

本文參考：

Typescript Handbook 變量聲明

Typescript Handbook 翻譯版變量聲明

mozilla Javascript參考文檔 var

mozilla Javascript參考文檔 let

mozilla Javascript參考文檔 const

云服務器 GPU云服務器聲明變量 python變量聲明 Ruby變量聲明 asp變量聲明

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/78637.html

從 JavaScript 到 TypeScript - 聲明類型

摘要：要為變量或者常量指定類型也很簡單，就是在變量常量名后面加個冒號，再指定類型即可，比如聲明函數是類型，即返回值是類型聲明參數是類型聲明是無返回值的聲明是這段代碼演示了對函數類型參數類型和變量類型地聲明。變量函數參數和返回值需要申明類型。從 JavaScript 語法改寫為 TypeScript 語法，有兩個關鍵點，一點是類成員變量(Field)需要聲明，另一點是要為各種東西(變量、參數...

Flands 2019-08-20 17:01 評論0 收藏0
TypeScript - 一種思維方式

摘要：怎么影響了我的思考方式對前端開發者來說，能強化了面向接口編程這一理念。使用的過程就是在加深理解的過程，確實面向接口編程天然和靜態類型更為親密。摘要：學會TS思考方式。原文：TypeScript - 一種思維方式作者：zhangwang Fundebug經授權轉載，版權歸原作者所有。電影《降臨》中有一個觀點，語言會影響人的思維方式，對于前端工程師來說，使用 typescript 開...

noONE 2019-05-22 15:27 評論0 收藏0
typescript - 一種思維方式

摘要：怎么影響了我的思考方式對前端開發者來說，能強化了面向接口編程這一理念。使用的過程就是在加深理解的過程，確實面向接口編程天然和靜態類型更為親密。電影《降臨》中有一個觀點，語言會影響人的思維方式，對于前端工程師來說，使用 typescript 開發無疑就是在嘗試換一種思維方式做事情。其實直到最近，我才開始系統的學習 typescript ，前后大概花了一個月左右的時間。在這之前，我也在...

CKJOKER 2019-08-23 17:05 評論0 收藏0
翻譯 | 開始使用 TypeScript 和 React

摘要：原文地址原文作者譯者校對者和其他人有一些關于比較好的博文，跟隨這些博文，我最近開始使用。今天，我將展示如何從零開始建立一個工程，以及如何使用管理構建過程。我也將陳述關于的第一印象，尤其是使用和。原文地址：Getting started with TypeScript and React 原文作者：Jack_Franklin 譯者：luxj 校對者：veizz Tom Dale...

superw 2019-08-21 16:27 評論0 收藏0
Typescript 基礎（二）之函數

摘要：調用者容易迷惑，當傳入函數的參數類型為時返回值的類型究竟是還是。前面兩個是函數聲明，最后一個是函數實現，有參數類型和返回值類型隨意搭配的意思。 Typescript 中的函數 Javascrip 中函數是一等公民一、Javascript 中的兩種常見的定義函數的方式1、函數聲明 function myFunc(x,y){ return x+y } 2、函數表達式 let add...

yeyan1996 2019-08-23 10:22 評論0 收藏0