Для зберігання даних у програмі в TypeScript, як і в багатьох мовах програмування, використовуються змінні.
Для визначення змінних, як у JavaScript, можна використовувати ключове слово var:
var z; // змінна z
Інший спосіб визначення змінної застосовує ключове слово let, яке було додано в JavaScript у стандарті ES 2015:
let z;
Застосування let є кращим, оскільки дає змогу уникнути низки проблем, пов'язаних з оголошенням змінних. Зокрема, за допомогою var ми можемо визначити два і більше разів змінну з одним і тим самим іменем:
var x = "hello"; console.log(x); var x = "work"; console.log(x);
Якщо програма велика, то ми можемо не встежити за тим, що така змінна вже оголошена, що є джерелом потенційних помилок. Подібну проблему дає змогу вирішити let:
let x = "hello"; console.log(x); let x = "work"; // тут буде помилка, оскільки змінна x уже оголошена console.log(x);
Те ж саме стосується, якщо змінна з одним і тим самим іменем визначається двічі, але за допомогою обох ключових слів - let і var:
let x = "hello"; console.log(x); var x = "work"; // тут буде помилка, оскільки змінна x уже оголошена console.log(x);
Визначивши змінну, ми можемо встановити її значення і в процесі роботи програми поміняти його на інше:
let z = 6; z = 8;
Крім змінних у TypeScript є константи - для них можна встановити значення тільки один раз. І далі в процесі роботи програми ми вже не зможемо змінити це значення. Для визначення констант використовується ключове слово const:
const z = 6; z = 8; // тут помилка - не можна змінити значення константи z
Область видимості змінної та констант
Вище було сказано, що не можна визначити за допомогою let визначити більше одного разу змінну (а за допомогою const - константу) з одним і тим самим ім'ям. Це твердження стосується ситуації, коли змінні let і константи визначаються в одній області видимості. Є локальна область видимості, яка визначається блоком коду, обмеженим фігурними дужками { //....код }. І є глобальна область видимості - поза будь-яким блоком коду.
Змінні та константи у вкладеній області видимості можуть приховувати змінні та константи з тим самим ім'ям, визначені у зовнішній області видимості. Наприклад:
let x = 10; { let x = 25; console.log(x); // 25 } console.log(x); // 10
Тут визначено дві змінні з одним і тим самим іменем. Але помилки немає, оскільки вони визначені в різних областях видимості. Змінна let x = 10 визначена в глобальній області видимості. А змінна let x = 25; визначена у вкладеному блоці коду - в локальній області видимості. І вона приховує зовнішню глобальну змінну. Тому консоль браузера виведе нам таке:
10
Те саме стосується випадку, якщо змінні визначаються в локальних областях видимості, які вкладені одна в іншу:
let x = 10; { let x = 25; { let x = 163; console.log(x); // 163 } console.log(x); // 25 } console.log(x); // 10
Відмінності між var і let/const
Можна таким чином підсумувати відмінності між var і let/const:
var |
let/const |
Може бути доступною поза областю видимості, у якій її визначено. { var x = 94; } console.log(x); // норм |
Доступна тільки в межах області видимості, в якій вона визначена { нехай x = 94; } console.log(x); // ! Помилка |
Можна використовувати у функції перед визначенням. console.log(x); // undefined, але норм var x = 76; |
Можна використовувати тільки після визначення. console.log(x); // ! Помилка let x = 76; |
В одній і тій самій області видимості можна кілька разів визначити змінну з одним і тим самим ім'ям. var x = 72; console.log(x); // 72 var x = 24; // норм console.log(x); // 24 |
В одній і тій самій області видимості можна тільки один раз визначити змінну з одним і тим самим ім'ям. let x = 72; console.log(x); // 72 let x = 24; // ! Помилка console.log(x); |