0

我有一个来自 API 响应的对象，如下所示：

{
  // ...
  customerName: 'Jake',
  customerUserName: 'jak3',
  customerEmail: 'some@email.com',
  // ...
}

我想声明一个名为 apiUser在我的应用程序中使用的新对象，它看起来像这样：

{
  name: 'Jake',
  userName: 'jak3',
  email: 'some@email.com'
}

我知道我可以这样做Object.assign()：

let apiUser = {};
Object.assign(apiUser, {
  name: response.customerName || 'John Doe', // customerName may be an empty string
  userName : response.customerUserName,
  email: response.customerEmail
});

最后的问题是：我可以通过对象解构来做到这一点吗？我已经尝试过：

let apiUser = {};
{customerName: apiUser.name, customerUserName: apiUser.userName, customerEmail: apiUser.email} = response;

但是抛出并且SyntaxError: Unexpected token :有任何正确的语法还是我应该坚持Object.assign()？请不要忘记“John Doe”条件。

4

4 回答 4

2

为什么不只是分配给一个新变量，摆脱预先分配let然后修改变量：

const apiUser = {
  name: response.customerName || 'John Doe',
  userName : response.customerUserName,
  email: response.customerEmail
};

或者，如果您想添加到已经存在的字段：

const apiUser = Object.assign({}, originalObject, {
  name: response.customerName || 'John Doe',
  userName : response.customerUserName,
  email: response.customerEmail
}

这也应该有效：

const { customerName: name, customerUserName: userName, customerEmail: email } = originalObject;
const apiUser = {
  name,
  userName,
  customerEmail
};
于 2017-08-30T13:25:55.060 回答
1

你的最后一个例子很好，你只需要像这样在语句周围加上括号：

({customerName: apiUser.name, customerUserName: apiUser.userName, customerEmail: apiUser.email} = response)

但是那不会让你做条件值。为此，您需要执行 Object.assign 或您讨论的其他方法之一。

编辑

原来你可以做条件值！

({customerName: apiUser.name = "John Doe", customerUserName: apiUser.userName, customerEmail: apiUser.email} = response)
于 2017-08-30T13:25:35.543 回答
0

它可以按您的预期工作：

let response = {
  // ...
  customerName: 'Jake',
  customerUserName: 'jak3',
  customerEmail: 'some@email.com',
  // ...
};


// Destructuring Assignment (w/ default value)
let apiUser = {};
({ customerName:     apiUser.name = 'John Doe', //<-- default value with '='
   customerUserName: apiUser.userName, 
   customerEmail:    apiUser.email
 } = response );


// Assign Prototype Method
/*
let apiUser = {};
Object.assign(apiUser, {
  name: response.customerName || 'John Doe', // customerName may be an empty string
  userName : response.customerUserName,
  email: response.customerEmail
});
*/

console.log(apiUser);

根据MDN 的 Assignment without declaration 文档：

当( .. )使用没有声明的对象字面量解构赋值时，赋值语句周围是必需的语法。

{a, b} = {a: 1, b: 2}不是有效的独立语法，因为{a, b}左侧的 被视为块而不是对象文字。

然而，({a, b} = {a: 1, b: 2})是有效的，因为是 var{a, b} = {a: 1, b: 2}

注意：您的( ..)表达式需要以分号开头，或者它可以用于执行上一行的函数。

注意： Object.Assign 和解构分配在 Internet Explorer 中基本上不可用（Edge 是另一回事）。在您的实施中考虑到这一点。

于 2017-08-30T13:35:34.487 回答
0

您可以执行以下操作：

let response = {
    CustomerName: '',
    CustomerUsername: 'jak3',
    CustomerEmail: 'some@email.com',
};
let apiUser = {
    Name: '',
    Username: '',
    Email: '',
};

(
    [
        apiUser.Name,
        apiUser.Username,
        apiUser.Email
    ] = [
        response.CustomerName || 'John Doe',
        response.CustomerUsername,
        response.CustomerEmail
    ]
);
console.log(apiUser);

但是，与不使用任何花哨的功能相比，我不确定如何提高可读性，而只是这样做：

let response = {
    CustomerName: '',
    CustomerUsername: 'jak3',
    CustomerEmail: 'some@email.com',
};
let apiUser = {
    Name: response.CustomerName || 'John Doe',
    Username: response.CustomerUsername,
    Email: response.CustomerEmail,
};
console.log(apiUser);

当然这更容易阅读和理解？您尝试使用更深奥的语法来实现这一目标是否有任何具体原因？

于 2017-08-30T13:36:16.667 回答