TS 学习4 TS 基本类型-ts4_ts 二维数组-优快云博客

本文链接：https://blog.youkuaiyun.com/jinlong59421/article/details/96338311

本文介绍了TypeScript中的基本数据类型，包括Number、String和Array的使用方法及常见操作，同时还涉及了元组和联合类型的使用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

TypeScript Number

let num=new Number(value);

Number 对象属性

下表列出了 Number 对象支持的属性：

序号	属性	描述
1.	MAX_VALUE	可表示的最大的数，MAX_VALUE 属性值接近于 1.79E+308。大于 MAX_VALUE的值代表 “Infinity”。
2.	MIN_VALUE	可表示的最小的数，即最接近 0 的正数 (实际上不会变成 0)。最大的负数是 -MIN_VALUE，MIN_VALUE 的值约为 5e-324。小于 MIN_VALUE (“underflow values”) 的值将会转换为 0。
3.	NaN	非数字值（Not-A-Number）。
4.	NEGATIVE_INFINITY	负无穷大，溢出时返回该值。该值小于 MIN_VALUE。
5.	POSITIVE_INFINITY	正无穷大，溢出时返回该值。该值大于 MAX_VALUE。
6.	prototype	Number 对象的静态属性。使您有能力向对象添加属性和方法。
7.	constructor	返回对创建此对象的 Number 函数的引用

console.log("TypeScript Number 属性: "); 
console.log("最大值为: " + Number.MAX_VALUE); 
console.log("最小值为: " + Number.MIN_VALUE); 
console.log("负无穷大: " + Number.NEGATIVE_INFINITY); 
console.log("正无穷大:" + Number.POSITIVE_INFINITY);

TypeScript String（字符串）

String 对象用于处理文本（字符串）。

语法

var txt = new String("string");
或者更简单方式：
var txt = "string";

String 对象属性下表列出了 String 对象支持的属性：

序号	属性 & 描述	实例
1.	constructor 对创建该对象的函数的引用。 var str = new String( “This is string” ); console.log(“str.constructor is:” + str.constructor) 输出结果： str.constructor is:function String() { [native code] }
2.	length	返回字符串的长度。 var uname = new String(“Hello World”) console.log("Length "+uname.length) // 输出 11
3.	prototype	允许您向对象添加属性和方法。 function employee(id:number,name:string) { this.id = id this.name = name } var emp = new employee(123,“admin”) employee.prototype.email="admin@runoob.com" // 添加属性 email console.log("员工号: "+emp.id) console.log("员工姓名: "+emp.name) console.log("员工邮箱: "+emp.email)

String 方法下表列出了 String 对象支持的方法：

序号	方法 & 描述	实例
1.	charAt()	返回在指定位置的字符。 var str = new String(“RUNOOB”); console.log(“str.charAt(0) 为:” + str.charAt(0)); // R console.log(“str.charAt(1) 为:” + str.charAt(1)); // U console.log(“str.charAt(2) 为:” + str.charAt(2)); // N console.log(“str.charAt(3) 为:” + str.charAt(3)); // O console.log(“str.charAt(4) 为:” + str.charAt(4)); // O console.log(“str.charAt(5) 为:” + str.charAt(5)); // B
2.	charCodeAt()	返回在指定的位置的字符的 Unicode 编码。 var str = new String(“RUNOOB”); console.log(“str.charCodeAt(0) 为:” + str.charCodeAt(0)); // 82 console.log(“str.charCodeAt(1) 为:” + str.charCodeAt(1)); // 85 console.log(“str.charCodeAt(2) 为:” + str.charCodeAt(2)); // 78 console.log(“str.charCodeAt(3) 为:” + str.charCodeAt(3)); // 79 console.log(“str.charCodeAt(4) 为:” + str.charCodeAt(4)); // 79 console.log(“str.charCodeAt(5) 为:” + str.charCodeAt(5)); // 66
3.	concat()	连接两个或更多字符串，并返回新的字符串。 var str1 = new String( “RUNOOB” ); var str2 = new String( “GOOGLE” ); var str3 = str1.concat( str2 ); console.log("str1 + str2 : "+str3) // RUNOOBGOOGLE
4.	indexOf()	返回某个指定的字符串值在字符串中首次出现的位置。 var str1 = new String( “RUNOOB” ); var index = str1.indexOf( “OO” ); console.log(“查找的字符串位置 :” + index ); // 3
5.	lastIndexOf()	从后向前搜索字符串，并从起始位置（0）开始计算返回字符串最后出现的位置。 var str1 = new String( “This is string one and again string” ); var index = str1.lastIndexOf( “string” ); console.log(“lastIndexOf 查找到的最后字符串位置 :” + index ); // 29 index = str1.lastIndexOf( “one” ); console.log(“lastIndexOf 查找到的最后字符串位置 :” + index ); // 15
6.	localeCompare()	用本地特定的顺序来比较两个字符串。 var str1 = new String( “This is beautiful string” ); var index = str1.localeCompare( “This is beautiful string”); console.log(“localeCompare first :” + index ); // 0
7.	match() 查找找到一个或多个正则表达式的匹配。 var str=“The rain in SPAIN stays mainly in the plain”; var n=str.match(/ain/g); // ain,ain,ain
8.	replace()	替换与正则表达式匹配的子串
9.	search()	检索与正则表达式相匹配的值 var re = /apples/gi; var str = “Apples are round, and apples are juicy.”; if (str.search(re) == -1 ) { console.log(“Does not contain Apples” ); } else { console.log(“Contains Apples” ); }
10.	slice()	提取字符串的片断，并在新的字符串中返回被提取的部分。
11.	split()	把字符串分割为子字符串数组。 var str = “Apples are round, and apples are juicy.”; var splitted = str.split(" ", 3); console.log(splitted) // [ ‘Apples’, ‘are’, ‘round,’ ]
12.	substr()	从起始索引号提取字符串中指定数目的字符。
13.	substring()	提取字符串中两个指定的索引号之间的字符。 var str = “RUNOOB GOOGLE TAOBAO FACEBOOK”; console.log("(1,2): " + str.substring(1,2)); // U console.log("(0,10): " + str.substring(0, 10)); // RUNOOB GOO console.log("(5): " + str.substring(5)); // B GOOGLE TAOBAO FACEBOOK
14.	toLocaleLowerCase()	根据主机的语言环境把字符串转换为小写，只有几种语言（如土耳其语）具有地方特有的大小写映射。 var str = “Runoob Google”; console.log(str.toLocaleLowerCase( )); // runoob google
15.	toLocaleUpperCase()	据主机的语言环境把字符串转换为大写，只有几种语言（如土耳其语）具有地方特有的大小写映射。 var str = “Runoob Google”; console.log(str.toLocaleUpperCase( )); // RUNOOB GOOGLE
16.	toLowerCase()	把字符串转换为小写。 var str = “Runoob Google”; console.log(str.toLowerCase( )); // runoob google
17.	toString()	返回字符串。 var str = “Runoob”; console.log(str.toString( )); // Runoob
18.	toUpperCase()	把字符串转换为大写。 var str = “Runoob Google”; console.log(str.toUpperCase( )); // RUNOOB GOOGLE
19.	valueOf()	返回指定字符串对象的原始值。 var str = new String(“Runoob”); console.log(str.valueOf( )); // Runoob

TypeScript Array(数组)

TypeScript 声明数组的语法格式如下所示：

var array_name[:datatype];        //声明 
array_name = [val1,val2,valn..]   //初始化
或者直接在声明时初始化：
var array_name[:data type] = [val1,val2…valn]
如果数组声明时未设置类型，则会被认为是 any 类型，在初始化时根据第一个元素的类型来推断数组的类型。

实例
创建一个 number 类型的数组：

var numlist:number[] = [2,4,6,8]
var sites:string[]; 
sites = ["Google","Runoob","Taobao"] 
console.log(sites[0]); 
console.log(sites[1]);

多维数组

一个数组的元素可以是另外一个数组，这样就构成了多维数组（Multi-dimensional Array）。
最简单的多维数组是二维数组，定义方式如下：

var arr_name:datatype[][]=[ [val1,val2,val3],[v1,v2,v3] ]

实例
定义一个二维数组，每一个维度的数组有三个元素。

TypeScript
var multi:number[][] = [[1,2,3],[23,24,25]]  
console.log(multi[0][0]) 
console.log(multi[0][1]) 
console.log(multi[0][2]) 
console.log(multi[1][0]) 
console.log(multi[1][1]) 
console.log(multi[1][2])

数组方法

下表列出了一些常用的数组方法：

序号	方法 & 描述	实例
1.	concat()	连接两个或更多的数组，并返回结果。 var alpha = [“a”, “b”, “c”]; var numeric = [1, 2, 3]; var alphaNumeric = alpha.concat(numeric); console.log("alphaNumeric : " + alphaNumeric ); // a,b,c,1,2,3
2.	every()	检测数值元素的每个元素是否都符合条件。 function isBigEnough(element, index, array) { return (element >= 10); } var passed = [12, 5, 8, 130, 44].every(isBigEnough); console.log("Test Value : " + passed ); // false
3.	filter()	检测数值元素，并返回符合条件所有元素的数组。 function isBigEnough(element, index, array) { return (element >= 10); } var passed = [12, 5, 8, 130, 44].filter(isBigEnough); console.log("Test Value : " + passed ); // 12,130,44
4.	forEach()	数组每个元素都执行一次回调函数。 let num = [7, 8, 9]; num.forEach(function (value) { console.log(value); }); 编译成 JavaScript 代码： var num = [7, 8, 9]; num.forEach(function (value) { console.log(value); // 7 8 9 });
5.	indexOf()	搜索数组中的元素，并返回它所在的位置。 var index = [12, 5, 8, 130, 44].indexOf(8); console.log("index is : " + index ); // 2
6.	join()	把数组的所有元素放入一个字符串。 var arr = new Array(“First”,“Second”,“Third”); var str = arr.join(); console.log(“str : " + str ); // First,Second,Third var str = arr.join(”, "); console.log(“str : " + str ); // First, Second, Third var str = arr.join(” + "); console.log("str : " + str ); // First + Second + Third
7.	lastIndexOf()	返回一个指定的字符串值最后出现的位置，在一个字符串中的指定位置从后向前搜索。 var index = [12, 5, 8, 130, 44].lastIndexOf(8); console.log("index is : " + index ); // 2
8.	map()	通过指定函数处理数组的每个元素，并返回处理后的数组。 var numbers = [1, 4, 9]; var roots = numbers.map(Math.sqrt); console.log("roots is : " + roots ); // 1,2,3
9.	pop()	删除数组的最后一个元素并返回删除的元素。 var numbers = [1, 4, 9]; var element =numbers.pop(); console.log("element is : " + element ); // 9 var element = numbers.pop(); console.log("element is : " + element ); // 4
10.	push()	向数组的末尾添加一个或更多元素，并返回新的长度。 var numbers = new Array(1, 4, 9); var length = numbers.push(10); console.log("new numbers is : " + numbers ); // 1,4,9,10 length = numbers.push(20); console.log("new numbers is : " + numbers ); // 1,4,9,10,20
11.	reduce()	将数组元素计算为一个值（从左到右）。 var total = [0, 1, 2, 3].reduce(function(a, b){ return a + b; }); console.log("total is : " + total ); // 6
12.	reduceRight()	将数组元素计算为一个值（从右到左）。 var total = [0, 1, 2, 3].reduceRight(function(a, b){ return a + b; }); console.log("total is : " + total ); // 6
13.	reverse()	反转数组的元素顺序。 var arr = [0, 1, 2, 3].reverse(); console.log("Reversed array is : " + arr ); // 3,2,1,0
14.	shift()	删除并返回数组的第一个元素。 var arr = [10, 1, 2, 3].shift(); console.log("Shifted value is : " + arr ); // 10
15.	slice()	选取数组的的一部分，并返回一个新数组。 var arr = [“orange”, “mango”, “banana”, “sugar”, “tea”]; console.log("arr.slice( 1, 2) : " + arr.slice( 1, 2) ); // mango console.log("arr.slice( 1, 3) : " + arr.slice( 1, 3) ); // mango,banana
6.	some()	检测数组元素中是否有元素符合指定条件。 function isBigEnough(element, index, array) { return (element >= 10); } var retval = [2, 5, 8, 1, 4].some(isBigEnough); console.log("Returned value is : " + retval ); // false var retval = [12, 5, 8, 1, 4].some(isBigEnough); console.log("Returned value is : " + retval ); // true
17.	sort()	对数组的元素进行排序。 var arr = new Array(“orange”, “mango”, “banana”, “sugar”); var sorted = arr.sort(); console.log("Returned string is : " + sorted ); // banana,mango,orange,sugar
18.	splice()	从数组中添加或删除元素。 var arr = [“orange”, “mango”, “banana”, “sugar”, “tea”]; var removed = arr.splice(2, 0, “water”); console.log("After adding 1: " + arr ); // orange,mango,water,banana,sugar,tea console.log("removed is: " + removed); removed = arr.splice(3, 1); console.log("After removing 1: " + arr ); // orange,mango,water,sugar,tea console.log("removed is: " + removed); // banana
19.	toString()	把数组转换为字符串，并返回结果。 var arr = new Array(“orange”, “mango”, “banana”, “sugar”); var str = arr.toString(); console.log("Returned string is : " + str ); // orange,mango,banana,sugar
20.	unshift()	向数组的开头添加一个或更多元素，并返回新的长度。 var arr = new Array(“orange”, “mango”, “banana”, “sugar”); var length = arr.unshift(“water”); console.log("Returned array is : " + arr ); // water,orange,mango,banana,sugar console.log("Length of the array is : " + length ); // 5

TypeScript 元组

我们知道数组中元素的数据类型都是相同的，如果存储的元素数据类型不同，则需要使用元组。元组中允许存储不同类型的元素，元组可以作为参数传递给函数。

创建元组的语法格式如下：

var tuple_name = [value1,value2,value3,…value n]

实例
声明一个元组并初始化：

var mytuple = [10,"Runoob"];
或者我们可以先声明一个空元组，然后再初始化：

var mytuple = []; 
mytuple[0] = 120 
mytuple[1] = 234
···
访问元组
元组中元素使用索引来访问，第一个元素的索引值为 0，第二个为 1，以此类推第 n 个为 n-1，语法格式如下:
···
tuple_name[index]

实例
以下实例定义了元组，包含了数字和字符串两种类型的元素：

TypeScript
var mytuple = [10,"Runoob"]; // 创建元组
console.log(mytuple[0]) 
console.log(mytuple[1])

元组运算

我们可以使用以下两个函数向元组添加新元素或者删除元素：

push() 向元组添加元素，添加在最后面。
pop() 从元组中移除元素（最后一个），并返回移除的元素。

更新元组

元组是可变的，这意味着我们可以对元组进行更新操作：

TypeScript
var mytuple = [10, "Runoob", "Taobao", "Google"]; // 创建一个元组
console.log("元组的第一个元素为：" + mytuple[0]) 
 
// 更新元组元素
mytuple[0] = 121     
console.log("元组中的第一个元素更新为："+ mytuple[0])

解构元组

我们也可以把元组元素赋值给变量，如下所示：

TypeScript
var a =[10,"Runoob"] 
var [b,c] = a 
console.log( b )    
console.log( c )

结果：
10
Runoob

TypeScript 联合类型

联合类型（Union Types）可以通过管道(|)将变量设置多种类型，赋值时可以根据设置的类型来赋值。

注意：只能赋值指定的类型，如果赋值其它类型就会报错。

创建联合类型的语法格式如下：

Type1|Type2|Type3

实例
声明一个联合类型：

TypeScript:

var val:string|number 
val = 12 
console.log("数字为 "+ val) 
val = "Runoob" 
console.log("字符串为 " + val)

编译以上代码，得到以下 JavaScript 代码：

JavaScript"

var val;
val = 12;
console.log("数字为 " + val);
val = "Runoob";
console.log("字符串为 " + val);