Question

是否可以在将对象保留为array.map()函数内的参数的同时破坏对象的属性？

基于this question，我尝试了以下操作，但失败了（解析错误）

  this.state.files.map(((file, {param1, param2} = file), i) => (
    <div key={i}>
      <p>{param1}</p>
      <button onClick={this.editFile(file)} />
    </div>
  )

Answer 1

不是使用lambda组件，而是使其像这样的功能块

  this.state.files.map(((file, i) => {
    const {param1, param2} = file;
    return (
      <div key={i}>
        <p>{param1}</p>
        <button onClick={() => this.editFile(file)} />
      </div>
    )}
  )

Answer 2

实现此目标的一种方法是使用default parameters syntax，如下所示：

const test = (input, { a, b } = input) => [ a, b ]
console.log(test({ a: 1, b: 2 })) // [ 1, 2 ]

没有第二个参数传递给上面的函数，因此第二个参数默认为第一个参数，然后将其销毁。

该参数只能在声明后使用，因此将无法使用：

const test = ({ a, b } = input, input) => [ a, b ]
console.log(test(undefined, { a: 1, b: 2 }))
// Uncaught ReferenceError: input is not defined at test

这也仅在没有传递参数的情况下有效，因此，在将回调传递给Array#map的情况下，必须声明所有传递的参数，以便可以声明默认参数。

以您的示例为例：

this.state.files.map((file, i, files, { param1, param2 } = file) => (
  <div key={i}>
    <p>{param1}</p>
    <button onClick={this.editFile(file)} />
  </div>
))

销毁array.map（）中的对象属性并将对象保留为参数

2 个答案: