TypeScript - ตัวแปร

ตัวแปรตามคำนิยามคือ“ พื้นที่ที่มีชื่อในหน่วยความจำ” ที่เก็บค่า กล่าวอีกนัยหนึ่งก็คือทำหน้าที่เป็นที่เก็บสำหรับค่าในโปรแกรม ตัวแปร TypeScript ต้องเป็นไปตามกฎการตั้งชื่อ JavaScript -

• ชื่อตัวแปรสามารถประกอบด้วยตัวอักษรและตัวเลข

• ต้องไม่มีช่องว่างและอักขระพิเศษยกเว้นเครื่องหมายขีดล่าง (_) และดอลลาร์ ($)

• ชื่อตัวแปรต้องไม่ขึ้นต้นด้วยตัวเลข

ต้องประกาศตัวแปรก่อนที่จะใช้ ใช้var คำหลักในการประกาศตัวแปร

การประกาศตัวแปรใน TypeScript

ประเภทไวยากรณ์สำหรับการประกาศตัวแปรใน TypeScript คือการรวมเครื่องหมายโคลอน (:) หลังชื่อตัวแปรตามด้วยประเภท เช่นเดียวกับใน JavaScript เราใช้ไฟล์var คำหลักในการประกาศตัวแปร

เมื่อคุณประกาศตัวแปรคุณมีสี่ตัวเลือก -

• ประกาศประเภทและมูลค่าในคำสั่งเดียว

• ประกาศประเภท แต่ไม่มีค่า ในกรณีนี้ตัวแปรจะถูกตั้งค่าเป็นไม่ได้กำหนด

• ประกาศมูลค่า แต่ไม่มีประเภท ประเภทตัวแปรจะถูกกำหนดเป็นชนิดข้อมูลของค่าที่กำหนด

• ประกาศว่าไม่มีค่าไม่พิมพ์ ในกรณีนี้ประเภทข้อมูลของตัวแปรจะเป็นแบบใดก็ได้และจะเริ่มต้นเป็นไม่ได้กำหนด

ตารางต่อไปนี้แสดงไวยากรณ์ที่ถูกต้องสำหรับการประกาศตัวแปรตามที่กล่าวไว้ข้างต้น -

ส.	ไวยากรณ์และคำอธิบายการประกาศตัวแปร
1.	var name:string = ”mary” ตัวแปรเก็บค่าสตริงชนิด
2.	var name:string; ตัวแปรคือตัวแปรสตริง ค่าของตัวแปรถูกตั้งค่าเป็นไม่ได้กำหนดโดยค่าเริ่มต้น
3.	var name = ”mary” ประเภทของตัวแปรอนุมานจากชนิดข้อมูลของค่า ที่นี่ตัวแปรคือสตริงประเภท
4.	var name; ชนิดข้อมูลของตัวแปรคืออะไรก็ได้ ค่าของมันถูกตั้งค่าเป็นไม่ได้กำหนดโดยค่าเริ่มต้น

ตัวอย่าง: ตัวแปรใน TypeScript

var name:string = "John"; 
var score1:number = 50;
var score2:number = 42.50
var sum = score1 + score2 
console.log("name"+name) 
console.log("first score: "+score1) 
console.log("second score: "+score2) 
console.log("sum of the scores: "+sum)

ในการคอมไพล์จะสร้างโค้ด JavaScript ต่อไปนี้

//Generated by typescript 1.8.10
var name = "John";
var score1 = 50;
var score2 = 42.50;
var sum = score1 + score2;
console.log("name" + name);
console.log("first score: " + score1);
console.log("second score : " + score2);
console.log("sum of the scores: " + sum);

ผลลัพธ์ของโปรแกรมข้างต้นแสดงไว้ด้านล่าง -

name:John 
first score:50 
second score:42.50 
sum of the scores:92.50

คอมไพลเลอร์ TypeScript จะสร้างข้อผิดพลาดหากเราพยายามกำหนดค่าให้กับตัวแปรที่ไม่ใช่ประเภทเดียวกัน ดังนั้น TypeScript จึงเป็นไปตาม Strong Typing ไวยากรณ์การพิมพ์ที่แข็งแกร่งช่วยให้แน่ใจว่าประเภทที่ระบุบนด้านใดด้านหนึ่งของตัวดำเนินการกำหนด (=) เหมือนกัน นี่คือสาเหตุที่โค้ดต่อไปนี้ส่งผลให้เกิดข้อผิดพลาดในการคอมไพล์ -

var num:number = "hello"     // will result in a compilation error

พิมพ์ Assertion ใน TypeScript

TypeScript อนุญาตให้เปลี่ยนตัวแปรจากประเภทหนึ่งไปเป็นอีกประเภทหนึ่ง typescript หมายถึงกระบวนการนี้เป็นประเภทยืนยัน ไวยากรณ์คือการวางประเภทเป้าหมายระหว่างสัญลักษณ์ <> และวางไว้หน้าตัวแปรหรือนิพจน์ ตัวอย่างต่อไปนี้อธิบายแนวคิดนี้ -

ตัวอย่าง

var str = '1' 
var str2:number = <number> <any> str   //str is now of type number 
console.log(typeof(str2))

ถ้าคุณวางตัวชี้เมาส์ไว้เหนือคำสั่ง type assertion ใน Visual Studio Code จะแสดงการเปลี่ยนแปลงประเภทข้อมูลของตัวแปร โดยทั่วไปจะช่วยให้การยืนยันจากประเภท S ถึง T ประสบความสำเร็จหาก S เป็นประเภทย่อยของ T หรือ T เป็นประเภทย่อยของ S

สาเหตุที่ไม่เรียกว่า "type casting" นั้นโดยทั่วไปแล้วการแคสต์จะหมายถึงการสนับสนุนรันไทม์บางประเภทในขณะที่ "การยืนยันประเภท" เป็นการสร้างเวลาในการคอมไพล์เท่านั้นและเป็นวิธีที่คุณจะให้คำแนะนำแก่คอมไพเลอร์ว่าคุณต้องการให้โค้ดของคุณเป็นอย่างไร ได้รับการวิเคราะห์

ในการคอมไพล์จะสร้างโค้ด JavaScript ต่อไปนี้

"use strict";
var str = '1';
var str2 = str; //str is now of type number 
console.log(typeof (str2));

มันจะให้ผลลัพธ์ดังต่อไปนี้ -

string

Inferred Typing ใน TypeScript

เนื่องจากข้อเท็จจริงที่ว่า typescript ถูกพิมพ์อย่างรุนแรงคุณลักษณะนี้จึงเป็นทางเลือก TypeScript ยังสนับสนุนการพิมพ์ตัวแปรแบบไดนามิก ซึ่งหมายความว่า TypeScript สนับสนุนให้ประกาศตัวแปรโดยไม่มีประเภท ในกรณีเช่นนี้คอมไพลเลอร์จะกำหนดประเภทของตัวแปรตามค่าที่กำหนดให้ TypeScript จะค้นหาการใช้งานตัวแปรครั้งแรกภายในโค้ดกำหนดประเภทที่ได้ตั้งค่าไว้ในตอนแรกจากนั้นถือว่าเป็นประเภทเดียวกันสำหรับตัวแปรนี้ในส่วนที่เหลือของบล็อกโค้ดของคุณ

มีการอธิบายเช่นเดียวกันในข้อมูลโค้ดต่อไปนี้ -

ตัวอย่าง: Inferred Typing

var num = 2;    // data type inferred as  number 
console.log("value of num "+num); 
num = "12";
console.log(num);

ในข้อมูลโค้ดด้านบน -

• รหัสประกาศตัวแปรและตั้งค่าเป็น 2 โปรดทราบว่าการประกาศตัวแปรไม่ได้ระบุชนิดข้อมูล ดังนั้นโปรแกรมจึงใช้การพิมพ์เชิงอนุมานเพื่อกำหนดชนิดข้อมูลของตัวแปรกล่าวคือกำหนดประเภทของค่าแรกที่ตัวแปรถูกกำหนดให้ ในกรณีนี้,num ถูกตั้งค่าเป็นหมายเลขประเภท

• เมื่อโค้ดพยายามกำหนดค่าของตัวแปรเป็นสตริง คอมไพเลอร์แสดงข้อผิดพลาดเนื่องจากชนิดของตัวแปรถูกตั้งค่าเป็นตัวเลขแล้ว

มันจะให้ผลลัพธ์ดังต่อไปนี้ -

error TS2011: Cannot convert 'string' to 'number'.

ขอบเขตตัวแปร TypeScript

ขอบเขตของตัวแปรระบุตำแหน่งที่กำหนดตัวแปร ความพร้อมใช้งานของตัวแปรภายในโปรแกรมจะถูกกำหนดโดยขอบเขต ตัวแปร TypeScript สามารถอยู่ในขอบเขตต่อไปนี้ -

• Global Scope- มีการประกาศตัวแปรส่วนกลางนอกโครงสร้างการเขียนโปรแกรม ตัวแปรเหล่านี้สามารถเข้าถึงได้จากทุกที่ภายในรหัสของคุณ

• Class Scope - ตัวแปรเหล่านี้เรียกอีกอย่างว่า fields. ฟิลด์หรือตัวแปรคลาสถูกประกาศภายในคลาส แต่อยู่นอกเมธอด ตัวแปรเหล่านี้สามารถเข้าถึงได้โดยใช้ออบเจ็กต์ของคลาส ฟิลด์สามารถเป็นแบบคงที่ได้ สามารถเข้าถึงฟิลด์แบบคงที่ได้โดยใช้ชื่อคลาส

• Local Scope - ตัวแปรท้องถิ่นตามชื่อที่แนะนำจะถูกประกาศภายในโครงสร้างเช่นวิธีการลูปเป็นต้นตัวแปรท้องถิ่นสามารถเข้าถึงได้ภายในโครงสร้างที่มีการประกาศเท่านั้น

ตัวอย่างต่อไปนี้แสดงขอบเขตตัวแปรใน TypeScript

ตัวอย่าง: ขอบเขตตัวแปร

var global_num = 12          //global variable 
class Numbers { 
   num_val = 13;             //class variable 
   static sval = 10;         //static field 
   
   storeNum():void { 
      var local_num = 14;    //local variable 
   } 
} 
console.log("Global num: "+global_num)  
console.log(Numbers.sval)   //static variable  
var obj = new Numbers(); 
console.log("Global num: "+obj.num_val)

ในการถ่ายโอนรหัส JavaScript ต่อไปนี้จะถูกสร้างขึ้น -

var global_num = 12;              //global variable 
var Numbers = (function () {
   function Numbers() {
      this.num_val = 13;          //class variable 
   }
   Numbers.prototype.storeNum = function () {
      var local_num = 14;        //local variable 
   };
   Numbers.sval = 10;            //static field 
   return Numbers;
}());

console.log("Global num: " + global_num);
console.log(Numbers.sval);       //static variable  

var obj = new Numbers();
console.log("Global num: " + obj.num_val);

มันจะให้ผลลัพธ์ดังต่อไปนี้ -

Global num: 12
10
Global num: 13

หากคุณพยายามเข้าถึงตัวแปรโลคัลนอกเมธอดจะทำให้เกิดข้อผิดพลาดในการคอมไพล์

error TS2095: Could not find symbol 'local_num'.