CONTENT

Another TypeScript已经可以解析其它 ECMAScript 2015 特性了。 完整列表请参见:

the article on the Mozilla Developer Network

按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)。 本章,我们将简单研究一下。

解构数组

最简单的解构莫过于数组的解构赋值。如:


let input =[1,2];
let [first,second] = input;
console.log(first);//1
console.log(second);//2

在这里,创建了两个命名变量 firstsecond 。相当于使用了索引,但更加方便。如:


first = input[0];
second = input[1];

解构作用于已声明的变量会更好。如:


// swap variables
[first, second] = [second, first];

作用域函数参数。如:


let input : [number,number] =[1,2];//注意,此处必须给input加上类型,否则在后面传参会提示错误
function fun([first, second] : [number, number]) : void
{
    console.log(first);
    console.log(second);
}
fun(input);

在数组中使用 ... 语法创建剩余变量。如:


let [first,...rest] = [1,2,3,4];
console.log(first);//1  number类型
console.log(rest);//2,3 数组类型[number]

忽略不关心的尾随元素。如:


let [first] = [1, 2, 3, 4];
console.log(first); // outputs 1

或其他元素。如:


let [, second, , fourth] = [1, 2, 3, 4];

对象解构

除了能够解构数组外,我们还可以解构对象。如:


let o = {
    a: "foo",
    b: 12,
    c: "bar"
};
let { a, b } = o;
console.log(a);//foo

此处通过o.ao.b 创建了 ab 。如果你不需要用到 c ,你可以忽略它。

类似数组解构,用没有声明的赋值。如:


({ a, b } = { a: "baz", b: 101 });
注:此处需要用小括号括起来。

当然,类似数组,我们同样可以使用 ... 创建剩余变量。如:


let { a, ...passthrough } = o;
let total = passthrough.b + passthrough.c.length;

 

Comments | NOTHING

暂无评论...