what does `=` in destructure mean in javascript?

Question

Recently, I read a js file, there's a destructure like below,

IMO, I would write const { files } = obj.props; , but what does const { file=[] } = obj.props mean? why write like this and what's the benefits of this?

const obj = {
  props: {
    files: [1, 2, 3],
  },
};

const { files = [] } = obj.props;
// const { files } = obj.props;
console.log(files);

Answer 1

Default values

A variable can be assigned a default, in the case that the value unpacked from the array is undefined.

Source: MDN

const obj = {
  props: { not_files: 1 },
};

const { files = ["default", "value"] } = obj.props;
console.log(files);

Answer 2

It takes the empty array as default value for the missing property. More under default values or default parameters.

const obj = { props: {} };
const { files = [] } = obj.props;

console.log(files);