如何处理JavaScript中未定义的函数参数的解构？

Question

在解构函数参数时，如果函数参数未定义，该如何处理？

const product = {
    label: 'Notebook',
    price: 50
};

const destructSample = ({label, price}) => {
    console.log(label, price);
}

destructSample(product);
destructSample(undefined);

destructSample（undefined）; 引发以下错误

const destructSample = ({label, price}) => {
                         ^

TypeError: Cannot destructure property `label` of 'undefined' or 'null'.
    at destructSample (E:\PlayGround\NodeJs\nodeCourse\playground\destructuringError.js:6:24)
    at Object.<anonymous> (E:\PlayGround\NodeJs\nodeCourse\playground\destructuringError.js:11:1)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:754:12)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3)

如何解决呢？谢谢。

Answer 1

一个default value可以用来

const product = {
    label: 'Notebook',
    price: 50
};

const destructSample = ({label, price}= {}) => {
    console.log(label, price);
}

destructSample(product);
destructSample(undefined);

注意：-仅当没有传递参数或未定义作为参数传递时，默认参数才会出现，因此，如果您想处理更多虚假值，则可以执行以下操作

const product = {
    label: 'Notebook',
    price: 50
};

const destructSample = (obj) => {
    let {label, price}= obj === undefined || obj === null ? {} : obj
    console.log(label, price);
}

destructSample(product);
destructSample(undefined);
destructSample();
destructSample(null);

相关问题 javaScript function - why my default argument fails?