TypeScript总结
基础类型
-
any变量的值会动态改变时，比如来自用户的输入，任意值类型可以让这些变量跳过编译阶段的类型检查
let x:any = 1; //数字类型 x = 'I am who I am'; //字符串类型 x = false; //布尔类型 -
数字类型number
let a:number = 0b1010; //二进制 let b:number = 0o744 //八进制 let c:number = 6; //十进制 let d:number = 0xf00d; //十六进制 -
字符串类型string,一个字符系列，使用单引号（'）或双引号（"）来表示字符串类型,反引号（`）来定义多行文本和内嵌表达式
let names:string = "cty"; let years:number = 20; let words:string = `您好，今年是${name}第${years}岁生日 let word:string = "您好，今年是"+name+"第"+years+"岁生日" -
布尔型boolean,表示逻辑值true和false
let flag:boolean = true; -
数组类型，在元素类型后面加上[]
let arr1:number[] = [1,2]; 也可以使用数组泛型 let arr2:Array<number> = [1,2]; -
元组，元组类型用来表示已知元素数量和类型的数组，各元素类型不必相同，对应位置的类型需要相同
let x:[string,number]; x = ['cty',1]; -
枚举，用于定义数值集合
enum color{red,green,blue}; let c:color = color.blue; console.log(c) //输出2 -
void类型,用于标识方法返回值的类型，表示该方法没有返回值
function hello():void{ console.log("hello world"); }
运算符
-
加、减、乘、除、取余、自增自减
var num1:number = 10; var num2:number = 2; var res:number = 0; res = num1+num2; res1 = num1-num2; res2 = num1*num2; res3 = num1/num2; res4 = num1%num2; num1++; num2--; -
三元运算符，三元运算有3个操作数，并且需要判断布尔表达式的值
var num:number = -2 var resule = num>0?"大于0":"小于0或等于0" -
类型运算符 typeof，返回操作数的数据类型
var num = 12; console.log(typeof(num)); //输出结果为number -
字符串运算符，连接运算符(+),+号运算符可以拼接两个字符串
var msg:string = "Cty"+"今年20" console.log(msg)//输出Cty今年20
循环语句
-
for…in循环,用于一组值的集合或列表进行迭代输出
var j:any; var n:any = "a b c" for j in n{ console.log(n[j]) } -
for…of循环，允许你遍历Arrays(数组),String(字符串),Maps(映射),Sets(集合)等可迭代的数据结构
let array = [1,"string",false]; for(let a of array){ console.log(a); //1,"string",false } -
for…each
let list = [4,5,6]; list.forEach((val,idx,array)=>{ console.log(val); //取得的当前值 console.log(idx); //当前值的下标index console.log(array) //array:Array }) -
无限循环
for(;;){ console.log("这段代码会不停的执行"); } while(true){ console.log("这段代码会不停的执行") }
函数
-
函数定义
function function_name(){ //执行代码 } function_name() //调用函数 -
函数返回值，返回值的类型需要与函数定义的返回类型一致
function greet():string{ return "Hello World" } -
可选参数
function buildName(firstName:string,lastName?:string){ if(lastName) return firstName+" "+lastName; else return firstName; } let result1 = buildName("Bob"); //正确 let result2 = buildName("Bob","Adams","Sr"); //错误太多 let result3 = buildName("Bob","Adams"); //正确 -
默认参数
function calculate(price:number,rate:number = 0.5){//只要给定了值，就是默认参数 var discount = price*rate; console.log("计算结果: ",discount); } -
匿名函数，是一个没有函数名的函数，我们可以将匿名函数赋值给一个变量，这种表达式就成为函数表达式
var msg = function(){ return"hello world"; } var res1 = function(a:number,b:number){ return a*b; } -
构造函数
var myFunction = new Function("a","b","return a*b"); var x = myFunction(4,3); console.log(x); -
Lambda函数，也称为箭头函数，以下实例声明了lambda表达式函数，函数返回两个数的和
var foo = (x:number)=>{ x = 10+x; console.log(x) } -
可以不指定函数的参数类型，通过函数内来推断参数类型
var func = (x)=>{ if(typeof x=="number"){ console.log(x+"是一个数字"); } else if(typeof x=="string"){ console.log(x+"是一个字符串") } } -
无参数时可以设置空括号
var disp = ()=>{ console.log("Cty"); } -
函数重载，重载是方法名字相同，而参数不同，返回类型可以相同也可以不同
function disps(s1:string):void; function disps(n1:number,s1:string):void; function disps(x:any,y?:any):void{ console.log(x); console.log(y); } disps("abc"); disps(1,"xyz");
Number对象
-
语法
var num = new Number(value); -
Number对象属性
- MAX_VALUE:可表示的最大数
- MIN_VALUE:可表示的最小的数
- NaN:非数字值
- NEGATIVE_INFINITY:负无穷大
- POSITIVE_INFINITY:正无穷大
- prototype:Number 对象的静态属性。使您有能力向对象添加属性和方法
- constructor:返回对创建此对象的 Number 函数的引用
-
NaN实例
var month = 0 if( month<=0 || month >12) { month = Number.NaN console.log("月份是："+ month) } else { console.log("输入月份数值正确。") }//输出结果为:月份时:NaN -
prototype实例
function employee(this:any,id:number,name:string) { this.id = id this.name = name } var emp = new (employee as any)(123,"admin") employee.prototype.email = "admin@runoob.com" //添加了一个email属性 console.log("员工号: "+emp.id) console.log("员工姓名: "+emp.name) console.log("员工邮箱: "+emp.email) -
Number对象方法
-
toExponential(),把对象的值转换为指数计数法
var num1 = 1225.30 var val = num1.toExponential(); console.log(val) // 输出： 1.2253e+3 -
toFixed(),把数字转换为字符串,并对小数点指定位数
var num3 = 177.234 console.log("num3.toFixed() 为 "+num3.toFixed()) // 输出：177 console.log("num3.toFixed(2) 为 "+num3.toFixed(2)) // 输出：177.23 console.log("num3.toFixed(6) 为 "+num3.toFixed(6)) // 输出：177.234000 console.log(typeof(num3.toFixed()));//会转换为string类型 -
toPrecision(),把数字格式化为指定的长度
var num5 = new Number(7.123456); console.log(num5.toPrecision());//输出:7.123456 console.log(num5.toPrecision(1));//输出:7 console.log(num5.toPrecision(2));//输出:7.1 -
toString(),把数字转换为字符串，使用指定的基数。数字的基数是 2 ~ 36 之间的整数。若省略该参数，则使用基数 10
var num6 = new Number(10); console.log(num6.toString()); // 输出10进制：10 console.log(num6.toString(2)); // 输出2进制：1010 console.log(num6.toString(8)); // 输出8进制：12
-
String对象
-
语法
var txt0 = new String("string"); //或者更简单方式： var txt1 = "string"; -
String对象属性
-
length,返回字符串的长度
var Uname = new String("Hello World") console.log("Length: "+Uname.length) // 输出 11 -
prototype,允许向对象添加属性和方法，同见Numer_Class的prototype
-
-
String方法
-
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 -
charCodeAt(),返回在指定位置的字符的Unicode编码
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 -
concat()连接两个或更多的字符串,并返回新的字符串
var str1 = new String( "RUNOOB" ); var str2 = new String( "GOOGLE" ); var str3 = str1.concat(str2 as string); //加入类型断言 console.log("str1 + str2 : "+str3) // RUNOOBGOOGLE -
indexOf(),返回某个指定的字符串值在字符串中首次出现的位置
var str4 = new String( "RUNOOB" ); var index = str4.indexOf( "OO" ); console.log("查找的字符串位置 :" + index ); // 3 -
lastindexOf(),从后向前搜索字符串，并从起始位置（0）开始计算返回字符串最后出现的位置。
var str5 = new String( "This is string one and again string" ); var index = str5.lastIndexOf( "string" ); console.log("lastIndexOf 查找到的最后字符串位置 :" + index ); // 29 -
split(),把字符串分割为子字符串数组
var str7 = "Apples are round, and apples are juicy."; var splitted = str7.split(" ", 3); //第一个参数是分割的标识,第二个参数是最多分割成多少个 console.log(splitted) // [ 'Apples', 'are', 'round,' ] -
substring(),提取字符串中两个指定的索引号之间的字符
var str8 = "RUNOOB GOOGLE TAOBAO FACEBOOK"; console.log("(1,2): " + str8.substring(1,2)); // U console.log("(0,10): " + str8.substring(0, 10)); // RUNOOB GOO -
substr(),从起始索引号提取字符串中指定数目的字符
var str9="cty is diligent"; console.log(str9.substr(0,3));//cty -
toLocaleLowerCase(),转换为小写字母
var str10="CTY"; console.log(str10.toLocaleLowerCase());//cty -
toLocaleUpperCase(),转换为大写
var str11="cty"; console.log(str11.toLocaleUpperCase());//CTY
-
数组对象
-
声明并初始化
var numlist:number[]=[2,4,6,8]; -
可以使用Array对象创建数组，Array对象的构造函数可以接收以下两种值
-
表示数组大小的数值
var arr_number:number[]=new Array(4); for(var i=0;i<arr_number.length;i++){ arr_number[i]=i*2; console.log(arr_number[i]); } -
直接初始化数组元素
var web_name:string[]=new Array("Google","Runnob","Taobao","Facebook"); for(var i=0;i<web_name.length;i++){ console.log(web_name[i]); }
-
-
数组解构，我们可以把数组元素赋值给变量
var arr:number[]=[12,13]; var[a,b]=arr; //将数组的两个元素赋值给变量a,b console.log(a); console.log(b); -
数组迭代，可以使用for语句来循环出数组的各个元素
var j:any; var nums:number[]=[1001,1002,1003,1004]; for(j in nums){ console.log(nums[j]); } -
多维数组
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]) -
数组在函数中的使用
-
作为参数传递
var web:string[]=new Array("Google","Runoob","Taobao","Facebook"); function display(arr_site:string[]){ for(var i=0;i<arr_site.length;i++){ console.log(arr_site[i]); } } display(web); -
作为函数的返回值
function fab():string[]{ return new Array("Google","Runnob","Taobao","Facebook"); } var p=fab(); for(var i1 in p){ console.log(p[i1]); }
-
-
数组方法
-
concat(),连接两个或更多的数组,并返回结果
var alpha=["a","b","c"]; var numeric=["1","2","3"]; var alphanumeric=alpha.concat(numeric); -
filter()检测数值元素,并返回符合条件所有元素的数组
function isBigEnough(element:number,index:number,array:Array<number>){//Array要指明类型 return(element>=10); } var passed=[12,5,130,44].filter(isBigEnough); console.log("Test Value: "+passed); -
forEach()数组每个元素都执行一次回调函数
let num7=[7,8,9]; num7.forEach(function(value){ console.log(value); }); -
indexOf()搜索数组中的元素,并返回它所在的位置,如果搜索不到,返回值-1,代表没有此项
var index=[12,5,8,130,44].indexOf(8); console.log("the index of 8 is:"+index);//输出2 -
join(),把数组的所有元素放入一个字符串
var arr3 = new Array("Google","Runoob","Taobao"); var str10 = arr3.join(); console.log("str : " + str10 ); // Google,Runoob,Taobao var str11 = arr3.join(", "); console.log("str : " + str11 ); // Google, Runoob, Taobao var str12 = arr3.join(" + "); console.log("str : " + str12 ); // Google + Runoob + Taobao -
pop(),删除数组的最后一个元素并返回删除的元素
var numbers1=[1,4,9]; var element1=numbers1.pop(); console.log("element is: "+element1);//9 -
slice(),选取数组的一部分,并返回一个新数组
var arr5=["orange","mango","banana","sugar","tea"]; console.log("arr5.slice(1,2): "+arr5.slice(1,2));//mango console.log("arr5.slice(1,3): "+arr5.slice(1,3));//mango,banana -
splice(),从数组中添加或删除元素
let users = ['tony', 'betty', 'lufei', 'jack', 'linda']; console.log('原数组：' + users); // 第一个参数表示选中元素下标，第二个参数表示从下标起删除多少个元素，第三个参数插入到数组中代替被删除的元素(可以插入多个) let removed2 = users.splice(1, 1, 'thomas',"cty"); console.log('被删除的元素为：' + removed2); console.log('新数组：' + users);
-
联合类型
-
（Union Types）可以通过管道(|)将变量设置多种类型，赋值时可以根据设置的类型来赋值。!注意：只能赋值指定的类型，如果赋值其它类型就会报错
var val1:string|number; val1=12; console.log("数字为 "+val1); val1="CTY"; console.log("字符串 "+val1); -
可以将联合类型作为函数参数使用
function jkl(name:string|string[]){ if(typeof name == "string"){ console.log(name); } else{ var i; for(i=0;i<name.length;i++){ console.log(name[i]); } } } jkl("CTY"); jkl(["google","taobao","facebook"]); -
联合类型数组
var arrs:number[]|string[]; var i:number; arrs=[1,2,4]; for(i=0;i<arrs.length;i++){ console.log(arrs[i]); } arrs=["runoob","google","taobao"]; for(i=0;i<arrs.length;i++){ console.log(arrs[i]); }
接口
-
接口是一系列抽象方法的声明，是一些方法特征的集合，这些方法都应该是抽象的，需要由具体的类去实现，然后第三方就可以通过这组抽象方法调用，让具体的类执行具体的方法
-
接口定义如下
interface interface_name{} -
以下实例中，我们定义了一个接口 IPerson，接着定义了一个变量 customer，它的类型是 IPerson。customer 实现了接口 IPerson 的属性和方法
interface IPerson{ firstName:string; lastName:string; sayHi:()=>string; } var customer:IPerson={ firstName:"Tom", lastName:"Hanks", sayHi:():string=>{return "Hi there"} } console.log("Customer 对象"); console.log(customer.firstName); console.log(customer.lastName); console.log(customer.sayHi()); var employees:IPerson={ firstName:"Jim", lastName:"Blanks", sayHi:()=>{return "Hello!!!"} } console.log("Employees 对象"); console.log(employees.firstName); console.log(employees.lastName); -
联合类型和接口
interface RunOptions { [index:number]:string program:string; commandline:string[]|string|(()=>string); } // commandline 是字符串 var options:RunOptions = {program:"test1",commandline:"Hello"}; console.log(options.commandline) // commandline 是字符串数组 options = {program:"test1",commandline:["Hello","World"]}; console.log(options.commandline[0]); console.log(options.commandline[1]); // commandline 是一个函数表达式 options = {program:"test1",commandline:()=>{return "**Hello World**";}}; var fn:any = options.commandline; console.log(fn());
636
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
