欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

TypeScript的函數(shù)定義與使用案例教程

 更新時間:2021年07月23日 10:40:09   作者:ZhandsomeZ  
這篇文章主要介紹了TypeScript的函數(shù)定義與使用案例教程,本篇文章通過簡要的案例,講解了該項技術(shù)的了解與使用,以下就是詳細內(nèi)容,需要的朋友可以參考下

在這里插入圖片描述

TypeScript中函數(shù)的定義和使用

1. 聲明一個函數(shù)約束其傳參類型,以及返回值類型

	傳入兩個參數(shù),沒有返回值
const fun1 = (key: string, value: number): void => {
		console.log(key, value);//"Typescript",100
};
fun1("Typescript", 100);

2.TypeScript中的函數(shù)配置可選參數(shù),在ES5或者ES6中函數(shù)中的實參可以不傳遞進去,但是在TS中必須傳遞進去,如果需要設置非必傳參數(shù),就必須設置可選參數(shù)具體如下

const fun2 = (a: string, b?: number) => {
//形參后面加個?代表可以傳遞參數(shù)也可以不傳遞參數(shù)
	console.log(a);//typescript
}
fun2('typescript');
注意:配置可選參數(shù)必須配置到最后一個參數(shù),
否則ts會有報錯提示(雖然編譯可以通過但不建議這么使用)

3.TypeScript的函數(shù)設置默認值

//設置了默認值,并傳入實參,默認實參會代替默認值,這一點和ES6一致
const fun3 = (a: number, b: string = 'ECMAScript'): void => {
	console.log(a);//20
	console.log(b);//typescript
};
fun3(20, 'typescript');
/設置了默認值,沒有傳遞實參,默認B的值就是true
	const fun4 = (a: number, b: boolean = true): void => {
	    console.log(a);//60
	    console.log(b);//true
};
fun4(60);

4.TypeScript函數(shù)的剩余參數(shù)

//接收多個參數(shù),并放到一個容器里面,與ES6中的rest...三點運算符一樣
const fun5 = (...result: number[]): void => {
//用變量result接收實參,并指明數(shù)據(jù)類型
let sum: number = 0;
	for (let index = 0; index < result.length; index++) {
	     sum += result[index];
};
    console.log(sum);//150
};
fun5(10, 20, 30, 40, 50);
//注意接收多個實參的變量必須放在最后一個,否則會報錯
	
//接收參數(shù),與變量名一一對應
const fun6 = (first: string, ...result: string[]): void => {
	console.log(first);//string
	console.log(result);//[ 'number', 'boolean', 'function', 'true' ]
}
fun6('string', 'number', 'boolean', 'function', 'true');

5.TypeScript中的函數(shù)重載

// java中方法的重載:重載指的是兩個或者兩個以上同名函數(shù),
但它們的參數(shù)不一樣,這時會出現(xiàn)函數(shù)重載的情況。
// typescript中的重載:
通過為同一個函數(shù)提供多個函數(shù)類型定義來試下多種功能的目的。
//TS中函數(shù)重載  TS為了兼容ES5和ES6 不能寫大括號
//對實參類型進行約束
	function dataFn(a: string, b: number): void
	function dataFn(a: number, b: string): void
	function dataFn(a: number, b: number): void
	function dataFn(a: any, b: any): void {
//對傳入的實參類型進行判斷 如果符合某個函數(shù)就執(zhí)行其函數(shù)體
	if(typeof (a) === "string") {
		    console.log('This is 字符串')
	};
	if (typeof (a) === "number" && typeof (b) === "number") {
		     console.log('this is 數(shù)字');
	};
	if (typeof (a) === 'number') {
		     console.log(a, b);//20,typescript
		 } else {
		    }
	}
	dataFn(10, 20);
	dataFn(20, 'typescript');

6.TypeScript中的箭頭函數(shù)

基本形式:
    let func = num:number => num; //只有一個形參可以‘='后面寫形參名,并約束其類型
	let func = () => num;//如果有多個形參,在‘='后面寫‘()'把形參寫在()里面并約束其類型
	let sum = (num1, num2) :number=> num1 + num2;//如果只有1條執(zhí)行語句,
	//直接在‘=>'后面寫執(zhí)行語句即可,還要指定其返回類型
	如果有多條語句必須寫{},將代碼寫在{}里面,重新指定返回值,以及類型
注意事項:
	函數(shù)體內(nèi)的this對象,就是定義時所在的上下文,如果箭頭函數(shù)是全局里面的話,
	還是指向window,建議在箭頭函數(shù)外部再嵌套一層函數(shù)以便于控制里面的this
	不可以當作構(gòu)造函數(shù),也就是說,不可以使用new命令,否則會拋出一個錯誤。
	不可以使用arguments對象,該對象在函數(shù)體內(nèi)不存在。
	如果要用,可以用 rest 參數(shù)代替。
	const fun8 = (a: number, b: number): void => {
		console.log(a, b)
	}
	fun8(10, 20);

到此這篇關(guān)于TypeScript的函數(shù)定義與使用案例教程的文章就介紹到這了,更多相關(guān)TypeScript的函數(shù)定義與使用內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評論