一、使用環(huán)境
- Mac 電腦
- WebStorm
- TypeScript3.x版本
二舀患、基本函數(shù)
2.1徽级、函數(shù)聲明定義
function sum(x : number, y : number) : number {
return x + y;
}
console.log(sum(2,4));
2.2、函數(shù)表達(dá)式定義
let mySum = function (x: number, y: number): number {
return x + y;
};
2.3聊浅、用接口定義函數(shù)
interface ISearchFunc {
(source : string, substring : string):boolean;
};
let searchfunc : ISearchFunc;
searchfunc = function (source : string, substring : string) {
return source.search(substring) != -1;
};
console.log(searchfunc("2334455",'45'));
2.4餐抢、函數(shù)參數(shù)：可選參數(shù) 和默認(rèn)值參數(shù)
// 可選參數(shù)后面不允許再出現(xiàn)必須參數(shù)了
// 默認(rèn)參數(shù)：默認(rèn)值的參數(shù)識(shí)別為可選參數(shù)
// ...rest 的方式獲取函數(shù)中的剩余參數(shù) 字符串?dāng)?shù)組
function buildName( firstName:string, lastName?:string, age : number = 10,...items:string[]) {
console.log(items);
if(lastName){
return firstName + '加上' + lastName + '數(shù)字' + age.toString();
}else {
return firstName + age.toString();
}
}
console.log((buildName("tom","455",23,'5',"45","法國(guó)隊(duì)和規(guī)范")));
三现使、箭頭函數(shù)
3.1、基本語法
ES6 允許使用“箭頭”（=>）定義函數(shù)
箭頭函數(shù)相當(dāng)于匿名函數(shù)旷痕，并且簡(jiǎn)化了函數(shù)定義
表現(xiàn)形式一：包含一個(gè)表達(dá)式碳锈，連{ ... }和return都省略掉了
x => x * x //包含一個(gè)表達(dá)式，連{ ... }和return都省略掉了
等同于
function (v) {
return v;
};
表示形式二：包含多條語句欺抗，這時(shí)候就不能省略{ ... }和return
x => { // 包含多條語句售碳，這時(shí)候就不能省略{ ... }和return
if (x > 0) {
return x * x;
}
else {
return - x * x;
}
}
基礎(chǔ)語法
A、(參數(shù)1, 參數(shù)2, …, 參數(shù)N) => { 函數(shù)聲明 }
B绞呈、(參數(shù)1, 參數(shù)2, …, 參數(shù)N) => 表達(dá)式（單一）
//相當(dāng)于：(參數(shù)1, 參數(shù)2, …, 參數(shù)N) =>{ return 表達(dá)式; }
// 當(dāng)只有一個(gè)參數(shù)時(shí)贸人，圓括號(hào)是可選的：
C、(單一參數(shù)) => {函數(shù)聲明}
D佃声、單一參數(shù) => {函數(shù)聲明}
// 沒有參數(shù)的函數(shù)應(yīng)該寫成一對(duì)圓括號(hào)艺智。
E、() => {函數(shù)聲明}
3.2圾亏、高級(jí)語法
A力惯、加括號(hào)的函數(shù)體返回對(duì)象字面表達(dá)式：
參數(shù)=> ({foo: bar})
B、支持剩余參數(shù)和默認(rèn)參數(shù)
(參數(shù)1, 參數(shù)2, ...rest) => {函數(shù)聲明}
(參數(shù)1 = 默認(rèn)值1,參數(shù)2, …, 參數(shù)N = 默認(rèn)值N) => {函數(shù)聲明}
C召嘶、同樣支持參數(shù)列表解構(gòu)
let f = ([a, b] = [1, 2], {x: c} = {x: a + b}) => a + b + c;
f(); // 6
3.3父晶、箭頭函數(shù)的this
箭頭函數(shù)的引入有兩個(gè)方面的作用：
一是更簡(jiǎn)短的函數(shù)書寫
二是對(duì)this的詞法解析。
普通函數(shù): this指向調(diào)用它的那個(gè)對(duì)象
箭頭函數(shù):不綁定this弄跌，會(huì)捕獲其所在的上下文的this值甲喝，作為自己的this值,任何方法都改變不了其指向，如 call() , bind() , apply()
var obj = {
a: 10,
b: () => {
console.log(this.a); // undefined
console.log(this); // Window {postMessage: ?, blur: ?, focus: ?, close: ?, frames: Window, …}
},
c: function() {
console.log(this.a); // 10
console.log(this); // {a: 10, b: ?, c: ?}
}
}
obj.b();
obj.c();
由于箭頭函數(shù)沒有自己的this铛只，所以當(dāng)然也就不能用call()埠胖、apply()、bind()這些方法去改變this的指向
3.3淳玩、箭頭函數(shù)的其他屬性方法
普通函數(shù)存在的 arguments直撤、super、new蜕着、target谋竖、yield、prototype在箭頭函數(shù)中不存在
function foo() {
setTimeout(() => {
console.log('args:', arguments);
}, 100);
}
foo(2, 4, 6, 8)
上面代碼中承匣，箭頭函數(shù)內(nèi)部的變量arguments创夜，其實(shí)是函數(shù)foo的arguments變量
箭頭函數(shù)有幾個(gè)使用注意點(diǎn)鸭叙。
（1）函數(shù)體內(nèi)的this對(duì)象辣往，就是定義時(shí)所在的對(duì)象权埠，而不是使用時(shí)所在的對(duì)象。
（2）不可以當(dāng)作構(gòu)造函數(shù)袍暴，也就是說些侍，不可以使用new命令隶症，否則會(huì)拋出一個(gè)錯(cuò)誤。
（3）不可以使用arguments對(duì)象岗宣，該對(duì)象在函數(shù)體內(nèi)不存在蚂会。如果要用，可以用 rest 參數(shù)代替狈定。
（4）不可以使用yield命令颂龙，因此箭頭函數(shù)不能用作 Generator 函數(shù)习蓬。
如需了解更多知識(shí)
TypeScript學(xué)習(xí)筆記之五類（Class）
TypeScript學(xué)習(xí)筆記之四接口（Inferfaces）
TypeScript學(xué)習(xí)筆記之三非原始數(shù)據(jù)類型
TypeScript學(xué)習(xí)筆記之二基本數(shù)據(jù)類型
TypeScript學(xué)習(xí)筆記之一初見TypeScript
