TypeScript笔记(二)

For 循环
TypeScript for 循环用于多次执行一个语句序列,简化管理循环变量的代码。
语法

格式如下所示:

for ( init; condition; increment ){
    statement(s);
}

 循环:
 var num:number = 5; 
var i:number; 
var factorial = 1; 
 
for(i = num;i>=1;i--) {
   factorial *= i;
}
console.log(factorial)

输出:120
var j:any;
var n:any ="a b c"
for(j in n) {
	console.log(n[j]);
}

tsc test2.ts

node test2.js
输出:
a
b
c

TypeScript forEach 循环

let list = [4, 5, 6];
list.forEach((val, idx, array) => {
    // val: 当前值
    // idx:当前index
    // array: Array
});

let list =[4,5,6];
list.forEach((val,ids,array) => {
	console.log(val," ids:",ids);
});
4 ' ids:' 0
5 ' ids:' 1
6 ' ids:' 2

函数声明告诉编译器函数的名称、返回类型和参数。函数定义提供了函数的实际主体。
 typeScript
function test() {   // 函数定义
 console.log("调用函数")
}
test()              // 调用函数
return_type 是返回值的类型。

return 关键词后跟着要返回的结果。

一个函数只能有一个 return 语句。

返回值的类型需要与函数定义的返回类型(return_type)一致。

// 函数定义
function greet():string { // 返回一个字符串
    return "Hello World" 
} 
 
function caller() { 
    var msg = greet() // 调用 greet() 函数 
    console.log(msg) 
} 
 
// 调用函数
caller()
 
 带参数
 function add (x:number,y:number):number{
	return x+y;
}
console.log(add(1,3));

输出: 4

可选参数
在 TypeScript 函数里,如果我们定义了参数,则我们必须传入这些参数,除非将这些参数设置为可选,可选参数使用问号标识 ?。

function buildName(firstName:string,lastName?:string)
{
	if(lastName)
		return firstName +" " +lastName;
	else 
		return firstName;
}
let result1 = buildName("Bob");
console.log("result1:::",result1);//result1::: Bob
let result2 = buildName("Bob","Adams");
console.log("result2:::"+result2);//result2:::Bob Adams
 
 剩余参数:
 function buildName(firstName: string, ...restOfName: string[])
{
	return firstName+" " + restOfName.join(" ");
}
let employName =  buildName("Jose","Sam","Lucas");
console.log("employName::",employName);
输出:employName:: Jose Sam Lucas

匿名函数
匿名函数是一个没有函数名的函数。

匿名函数在程序运行时动态声明,除了没有函数名外,其他的与标准函数一样。

我们可以将匿名函数赋值给一个变量,这种表达式就成为函数表达式。

语法格式如下:

var res = function( [arguments] ) { ... }
实例 不带参数匿名函数:

TypeScript
var msg = function() { 
    return "hello world";  
} 
console.log(msg())
输出结果为:
hello world

匿名函数自调用
匿名函数自调用在函数后使用 () 即可:
 

TypeScript
(function () {
    var x = "Hello!!";   
    console.log(x)     
 })()
 
 编译以上代码,得到以下 JavaScript 代码:

JavaScript
(function () {
    var x = "Hello!!";   
    console.log(x)    
})()
输出结果为:

Hello!!

构造函数
TypeScript 也支持使用 JavaScript 内置的构造函数 Function() 来定义函数:

语法格式如下:

var res = new Function( [arguments] ) { ... })

TypeScript
var myFunction = new Function("a", "b", "return a * b"); 
var x = myFunction(4, 3); 
console.log(x);

Lambda 函数
Lambda 函数也称之为箭头函数。

箭头函数表达式的语法比函数表达式更短。

函数只有一行语句:

( [param1, parma2,…param n] )=>statement;

实例
以下实例声明了 lambda 表达式函数,函数返回两个数的和:
TypeScript
var foo = (x:number)=>10 + x 
console.log(foo(100))      //输出结果为 110

我们可以不指定函数的参数类型,通过函数内来推断参数类型:
TypeScript
var func = (x)=> { 
    if(typeof x=="number") { 
        console.log(x+" 是一个数字") 
    } else if(typeof x=="string") { 
        console.log(x+" 是一个字符串") 
    }  
} 
func(12) 
func("Tom")

输出结果为:

12 是一个数字
Tom 是一个字符串

函数重载
重载是方法名字相同,而参数不同,返回类型可以相同也可以不同。

每个重载的方法(或者构造函数)都必须有一个独一无二的参数类型列表。

参数类型不同:

function disp(string):void; 
function disp(number):void;

参数数量不同:
function disp(n1:number):void; 
function disp(x:number,y:number):void;

参数类型顺序不同:
function disp(n1:number,s1:string):void; 
function disp(s:string,n:number):void;

实例
以下实例定义了参数类型与参数数量不同:

TypeScript
function disp(s1:string):void; 
function disp(n1:number,s1:string):void; 
 
function disp(x:any,y?:any):void { 
    console.log(x); 
    console.log(y); 
} 
disp("abc") 
disp(1,"xyz");
 输出结果为:
abc
undefined
1
xyz

TypeScript 接口
 接口是一系列抽象方法的声明,是一些方法特征的集合,这些方法都应该是抽象的,需要由具体的类去实现,然后第三方就可以通过这组抽象方法调用,让具体的类执行具体的方法。

TypeScript 接口定义如下:

interface interface_name {
}

TypeScript
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 employee:IPerson = { 
    firstName:"Jim",
    lastName:"Blakes", 
    sayHi: ():string =>{return "Hello!!!"} 
} 
 
console.log("Employee  对象 ") 
console.log(employee.firstName) 
console.log(employee.lastName)


输出结果为:

Customer 对象
Tom
Hanks
Hi there
Employee  对象
Jim
Blakes
发布了166 篇原创文章 · 获赞 24 · 访问量 16万+

猜你喜欢

转载自blog.csdn.net/ljt2724960661/article/details/103949862