使用ES6，您可以按如下方式解构对象：

var { font, size, color, bold, italic } = getTextProperties();

参见JavaScript Destructuring assignment

为了补充@markmoxx所说的，从现在开始（从未来开始），我们有了新的重构方法，现在我们可以在重构语句中重命名和赋值默认值，请思考这个问题：

let obj = {a,: 5, b: 6, c: [7,8],d:[9,10]e: {f: 11, g: 12}};

let {a: first, b: second, c: arr, d: [innerFirst, innerSecond], e: {f: objFirst, g: objSecond}, h = "default1", i: [defaultArr1 = "default2", defaultArr2 = "default3"], j: {k: objDefault1 = "default4"} } = obj;

console.log(first, second, arr, innerFirst, innerSecond, objFirst, objSecond, h, defaultArr1,defaultArr2, objDefault1);

// This outputs: 
5, 6, [7,8],9,10,11,12,"default1","default2","default3","default4"

所以，现在我们对重构任务有了更多的控制权。

• 编辑：为了一致 *

PHP的list函数主要用于数组（大部分）。而且，有一些奇怪的行为（反向赋值取决于php版本，等等）.在javascript中解构是不同的.即使使用上面的重命名语法，你仍然需要知道对象键/数组索引.还有（这可能是偏好的问题，但是）JavaScript中的解构具有更大的能力，因为数组和对象都可以被解构到任何嵌套深度，同时允许你重命名和分配默认值。但是要注意，因为重构很容易失控。考虑一下这个过度重构的例子：

const NameView = ({context: { state: [ state, update ], id, display: {tag, size = 32, type = "text", style: { wrapper: outerouter = "card", content: innerouter = "content", banner: {wrapper: outerinner = "title",content: innerinner = "content"} } } } }) => (
    <div className={outerouter}>
        <input className={innerouter} type={type} maxlength={size} size={size} value={name} id={id} name={id} onChange={(e) => update(e.target.value)}/>
        <div className={outerinner}>
            <label for={id} className={innerinner}>{tag}</label>
        </div>
    </div>
)

重构和引用是完全不同的引用数据使用重构，这是完全错误的发挥围绕这一点。

const data = [
  {
    id: 1,
    name: "Tshirtr",
    img: "add-url",
    price: 714,
    cat: "Dress"
  },
  {
    id: 11,
    name: "short",
    img: "https://m.media-amazon.com/images/I/71e04Q53xlL._AC_UY879_.jpg",
    price: 474,
    cat: "Dress"
  },
  {
    id: 2,
    name: "Timex Men's Expedition Scout ",
    img: "https://m.media-amazon.com/images/I/91WvnZ1g40L._AC_UY879_.jpg",
    price: 470,
    cat: "Sport"
  },
  {
    id: 3,
    name: "Breitling Superocean Heritage",
    img: "https://m.media-amazon.com/images/I/61hGDiWBU8L._AC_UY879_.jpg",
    price: 200,
    cat: "Luxury"
  },
  {
    id: 4,
    name: "Casio Classic Resin Strap ",
    img: "https://m.media-amazon.com/images/I/51Nk5SEBARL._AC_UY879_.jpg",
    price: 16,
    cat: "Sport"
  },
  {
    id: 5,
    name: "Garmin Venu Smartwatch ",
    img: "https://m.media-amazon.com/images/I/51kyjYuOZhL._AC_SL1000_.jpg",
    price: 74,
    cat: "Casual"
  }
];

console.log("data-46", data);
// lets destructur--
const [one, ...rest] = data;
console.log("one-49", one);

one.boy = { name: "rahul", age: 24 };

console.log("one-53", one);
console.log("data-54", data);
// here you can see data also gets changed
// destructuring doesn't means derefrence

// just used below single line of code to dereferene the data that is cloning
const cloneData = JSON.parse(JSON.stringify(data));
console.log("cloneData", cloneData);
cloneData.push({ 99: "data no more refrencing.." });
console.log("cloneData-62", cloneData);
console.log("data-62", data);