江苏龙网

  1. 主页 > 生活百科 > >

3分钟快速了解TypeScript( 二 )

TypeScript


Java中声明变量： String county = “china”;
TypeScript中声明方法： public update(dt : number) : void{}
Java中声明变量： public void update(dt){}
简言之，相对于Java，TypeScript将数据类型放到了变量名后，将返回值类型放到了方法名后且在中间插入了一个:，学Java的同学是不是感觉被山寨了！！
三、 TypeScript新增特性
1. 可选参数和默认参数
可选参数：在 TypeScript 函数里，如果我们定义了参数，则我们必须传入这些参数，除非将这些参数设置为可选，可选参数使用问号标识 ？ 。
以下实例，我么将 lastName 设置为可选参数：
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"); // 正确
可选参数必须跟在必需参数后面 。如果上例我们想让 firstName 是可选的，lastName 必选，那么就要调整它们的位置，把 firstName 放在后面 。如果都是可选参数就没关系 。
默认参数：我们也可以设置参数的默认值，这样在调用函数的时候，如果不传入该参数的值，则使用默认参数，语法格式为：
function function_name(param1[:type],param2[:type] = default_value) {
}
注意：参数不能同时设置为可选和默认 。
以下实例函数的参数 rate 设置了默认值为 0.50，调用该函数时如果未传入参数则使用该默认值：
function calculate_discount(price:number,rate:number = 0.50) {
var discount = price * rate;
console.log("计算结果: ",discount);
}
calculate_discount(1000)
calculate_discount(1000,0.30)
编译以上代码，得到以下 JavaScript 代码：
输出结果为：function calculate_discount(price, rate) {
if (rate === void 0) { rate = 0.50; }
var discount = price * rate;
console.log("计算结果: ", discount);
}
calculate_discount(1000);
calculate_discount(1000, 0.30);
计算结果: 500
计算结果: 300
3. 剩余参数
有一种情况，我们不知道要向函数传入多少个参数，这时候我们就可以使用剩余参数来定义 。剩余参数语法允许我们将一个不确定数量的参数作为一个数组传入 。这个语法跟Java中JDK1.5版本新增功能一致 。
function buildName(firstName: string, ...restOfName: string[]) {
return firstName + " " + restOfName.join(" ");
}
let employeeName = buildName("Joseph", "Samuel", "Lucas", "macKinzie");
函数的最后一个命名参数 restOfName 以 ... 为前缀，它将成为一个由剩余参数组成的数组，索引值从0（包括）到 restOfName.length（不包括） 。
function addNumbers(...nums:number[]) {
var i;
var sum:number = 0;
for(i = 0;i<nums.length;i++) {
sum = sum + nums[i];
}
console.log("和为：",sum)
}
addNumbers(1,2,3)
addNumbers(10,10,10,10,10)
编译以上代码，得到以下 JavaScript 代码，如下：
function addNumbers() {
var nums = [];
for (var _i = 0; _i < arguments.length; _i++) {
nums[_i] = arguments[_i];
}
var i;
var sum = 0;
for (i = 0; i < nums.length; i++) {
sum = sum + nums[i];
}
console.log("和为：", sum);
}
addNumbers(1, 2, 3);
addNumbers(10, 10, 10, 10, 10);
输出结果为：
和为： 6
和为： 50
4. Lambda 函数
Lambda 函数也称之为箭头函数 。箭头函数表达式的语法比函数表达式更短 。这一点跟Java中JDK1.8版本后的新增特性一致 。
函数只有一行语句： ( [param1, parma2,…param n] )=>statement;
以下实例声明了 lambda 表达式函数，函数返回两个数的和：
var foo = (x:number)=>10 + x
console.log(foo(100)) //输出结果为 110
编译以上代码，得到以下 JavaScript 代码：
var foo = function (x) { return 10 + x; };
console.log(foo(100)); //输出结果为 110
输出结果为：110
5. 数组解构
我们也可以把数组元素赋值给变量，如下所示：
var arr:number[] = [12,13]
var[x,y] = arr // 将数组的两个元素赋值给变量 x 和 y
console.log(x, y)
编译以上代码，得到以下 JavaScript 代码：
var arr = [12, 13];
var x = arr[0], y = arr[1]; // 将数组的两个元素赋值给变量 x 和 y


推荐阅读


上一篇：刷完漆需要通风还是关窗,刷完墙漆什么时候通风好

下一篇：MD5算法全解析