使用转换器解构对象[重复]

Question

说，我有一个对象

const range = { min: '10', max: '20' }

我想对其进行解构，以便之后我有 2 个变量：
- min 的值为 10（不是 string '10'），并且
- max 的值为20

const { min, max } = range 只会导致min 的值为'10'（而不是10）。我想要的是Number(10)

我怎么能这样做？我确实对 ES6 解构有所了解，并进行了一些研究，尝试了不同的语法，但找不到满意的解决方案。谁能推荐一个？

结论：下面的答案中有非常巧妙的语法，但对于真正的代码，我会选择更冗长但可读的：

const min = +range.min // or Number(range.min)
const max = -range.max // or Number(range.max)

Answer 1

一种方法是使用+min 和+max 作为默认值的两个额外变量，

const range = { min: '10', max: '20' }

const {min, max, numMin = +min, numMax = +max} = range

console.log(numMin, numMax)

注意：- 在上述方法中，请确保使用对象中不可用的额外变量的名称，否则它不会使用默认值

---

另一种方法是使用IIFE，在解构之前将对象值转换为数值

const range = { min: '10', max: '20' }

const {min,max} = ( ({min,max}) => ( {min: +min, max: +max} ) )(range)

console.log(min,max)

---

在实际目的或实际代码中，我不会使用这种棘手的方式，因为我更喜欢可读性并且它有它自己的好处

const range = {
  min: '10',
  max: '20'
}

const min = parseInt(range.min)
const max = parseInt(range.max)

console.log(max, min)

Answer 2

我认为您不能将任何转换作为解构操作的一部分，但您可以尝试先进行转换。

如果你有这样的功能：

function parseKeys(obj) {
    const parsed = {};
    for (const key of Object.keys(obj)) {
        try {
            parsed[key] = parseInt(obj[key]);
        } catch () {}
    }

    return { ...obj, ...parsed };
}

那么你可以有一个这样的单行：

const { min, max } = parseKeys(range);

Answer 3

您可以将解构后的值放入数组中，然后再次解构映射的值。

var range = { min: '10', max: '20' },
    { min, max } = range;        

[min, max] = [min, max].map(Number);

console.log(typeof min, min);
console.log(typeof max, max);