Javascript 我不理解这个片段的语法

const createUser={userName，avatar}=>{ 用户名， 阿凡达 setUserName用户名{ this.userName=用户名； 归还这个； } }; logcreateUser{userName:'echo'，avatar:'echo.png'}； /* { 头像：echo.png， 用户名：echo， setUserName:[函数：setUserName] }

---

*/ 要理解这一点，我们首先要删除语法sugar。 第一个速记对象定义：

const createUser = ({ userName, avatar }) => ({
  userName: userName,
  avatar: avatar,
  setUserName: setUserName (userName) {
    this.userName = userName;
    return this;
  }
});

接下来，我们移除破坏：

const createUser = (data) => ({
  userName: data.userName,
  avatar: data.avatar,
  setUserName: setUserName (userName) {
    this.userName = userName;
    return this;
  }
});

最后，我们删除了arrow函数的简写返回：

const createUser = (data) => {
  return {
    userName: data.userName,
    avatar: data.avatar,
    setUserName: setUserName (userName) {
      this.userName = userName;
      return this;
    }
  };
}

我们也可以用普通函数替换箭头函数，但这会稍微改变行为，在这种情况下并不重要：

function createUser (data) {
  return {
    userName: data.userName,
    avatar: data.avatar,
    setUserName: setUserName (userName) {
      this.userName = userName;
      return this;
    }
  };
}

现在很容易理解这是什么： 这是一个函数

获取一个参数，即具有用户名和化身属性的对象 返回包含3个属性的对象 用户名和化身获得与传递参数相同的值 setUserName是一个函数，它接受一个参数，将对象的userName属性设置为该参数，然后返回该对象。 所以这既不是物体也不是生命。它是一个返回对象的函数

在这个新对象上有一个函数setUserName。因此，如果您像这样使用createUser函数：

const myUser = createUser({ userName: 'echo', avatar: 'echo.png' });

那你就可以了

myUser.setUserName('BlaBla');

实际上相当于

myUser.userName = 'BlaBla';

但是，由于它返回此值，您可以嵌套它：

myUser.setUserName('One').setUserName('Two');

这并不合理。但是，如果您想定义另一个函数，比如setAvatar，它可能会很有用

myUser.setUserName('One').setAvatar('One.jpg');

而不是

myUser.userName = 'One';
myUser.avatar = 'One.jpg';

什么是箭头函数？ Arrow函数——也被称为“fat Arrow”函数，来自一种跨编译语言CoffeeScript——是用于编写函数表达式的更简洁的语法。他们使用一个新的标记=>，看起来像一个胖箭头。箭头函数是匿名的，它改变了函数中的绑定方式

箭头函数使我们的代码更加简洁，并简化了函数范围和this关键字。它们是一行迷你函数，在C或Python等其他语言中的工作方式与Lambdas非常相似。另请参见JavaScript中的lambdas。通过使用箭头函数，我们避免了键入function关键字、return关键字（它在箭头函数中是隐式的）和花括号

---

它是一个简单的arrow函数，返回一个对象——简单的是，它是主体中的一条语句，被包围，因为这就是在简单arrow函数中返回对象的方式，因此在=>之后返回意味着函数返回一个对象。这不是一种生活，因为它不是即时调用的。为什么setUserName:[函数setUserName]会让你感到困惑？这是一个包含函数的属性？如果您不熟悉ES6+代码，那么理解它的最佳方法是通过babel之类的程序运行它，以获得ES5version@jaromanda哦，不，这是个糟糕的建议。。。这可能会为这些简单的功能提供有用的结果，但async/await或Generator看起来真的很糟糕，因为它们很难传输耶@Jonaswillms-这是真的，但是，您仍然可以深入了解代码在做什么，并希望您能够进行细化。但是为什么控制台用方括号和Function关键字记录属性的“setUserName”值。console.log并没有真正标准化。它只是返回一些浏览器供应商认为对您有帮助的内容。他们只是决定用方括号来表示属性值是一个函数和它的名字。汉克斯·勒克斯真的没有什么意义。这就解释了剩下的问号。