TypeScript基础-数组结构和对象解构-CSDN博客

本文介绍了TypeScript中数组和对象的解构语法，包括如何解构数组并获取剩余元素，忽略不关心的数组元素，以及对象解构时的属性重命名和默认值设置。通过示例展示了在函数参数中使用解构和默认值确保变量有值的情况。

解构数组

Typescript 数组解构和JavaScript类似

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

可以在数组里使用...语法创建剩余变量：

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

你可以忽略你不关心的元素

let [, second, , fourth] = [1, 2, 3, 4];
console.log(second); // 输出 2
console.log(fourth); // 输出 4

Typescript 对象解构和JavaScript类似

let o = {
    a: "foo",
    b: 12,
    c: "bar"
};
let { a, b } = o;

let o = {
    a: "foo",
    b: 12,
    c: "bar"
};
let { a: newName1, b: newName2 } = o;
// 等价于下面两行
// let newName1 = o.a;
// let newName2 = o.b;

默认值可以让你在属性为 undefined 时使用缺省值

function keepWholeObject(wholeObject: { a: string, b?: number }) {
    let { a, b = 1001 } = wholeObject;
}

现在，即使 b 为 undefined ， keepWholeObject 函数的变量 wholeObject 的属性 a 和b都会有值。