JavaScript可以直接訪問物件中的屬性內的屬性嗎？

在這個物件中，我想以 [userName, Skills] 的形式列印出一個陣列。我知道這些物件沒有索引。是否可以檢測到skills屬性并只列印出它的值？

const users = {
  Alex: {
    email: '[email protected]',
    skills: ['HTML', 'CSS', 'JavaScript'],
    age: 20,
    isLoggedIn: false,
    points: 30
  },
  Asab: {
    email: '[email protected]',
    skills: ['HTML', 'CSS', 'JavaScript', 'Redux', 'MongoDB', 'Express', 'React', 'Node'],
    age: 25,
    isLoggedIn: false,
    points: 50
  },
  Brook: {
    email: '[email protected]',
    skills: ['HTML', 'CSS', 'JavaScript', 'React', 'Redux'],
    age: 30,
    isLoggedIn: true,
    points: 50
  }
}

我首先嘗試了下面的代碼，但是出現了一個錯誤，它無法讀取未定義的屬性（讀取 0）。

let userId = Object.keys(users);  //(3) ['Alex', 'Asab', 'Brook']

for (let i = 0; i < userId.length; i  ) {
  let userSkills = users.userId[i].skills;
  console.log(userId, userSkills);
}

這是我像下面這樣一一檢查所有技能的唯一方法嗎？

console.log(users.Alex.skills);
console.log(users.Asab.skills);
console.log(users.Brooks.skills);

uj5u.com熱心網友回復：

正如評論中所說，您應該使用括號表示法。

鏈接：

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_accessors

https://javascript.info/object

此外，您可以使用它來縮短代碼：

userId.forEach(user => console.log(users[user].skills));

關于陣列方法，您可以在此處閱讀：

https://javascript.info/array-methods

uj5u.com熱心網友回復：

試試這個，它會為你作業

let userId = Object.keys(users);  //(3) ['Alex', 'Asab', 'Brook']
for (let i = 0; i < userId.length; i  ) {
  let userSkills = users[userId[i]].skills;
}

uj5u.com熱心網友回復：

const users = {
  Alex: {
    email: '[email protected]',
    skills: ['HTML', 'CSS', 'JavaScript'],
    age: 20,
    isLoggedIn: false,
    points: 30
  },
  Asab: {
    email: '[email protected]',
    skills: ['HTML', 'CSS', 'JavaScript', 'Redux', 'MongoDB', 'Express', 'React', 'Node'],
    age: 25,
    isLoggedIn: false,
    points: 50
  },
  Brook: {
    email: '[email protected]',
    skills: ['HTML', 'CSS', 'JavaScript', 'React', 'Redux'],
    age: 30,
    isLoggedIn: true,
    points: 50
  }
}

for (const element in users) {
  console.log(users[element].skills);
}

uj5u.com熱心網友回復：

您可以使用Object.entries并映射它

const users = {
  Alex: {
    email: '[email protected]',
    skills: ['HTML', 'CSS', 'JavaScript'],
    age: 20,
    isLoggedIn: false,
    points: 30
  },
  Asab: {
    email: '[email protected]',
    skills: ['HTML', 'CSS', 'JavaScript', 'Redux', 'MongoDB', 'Express', 'React', 'Node'],
    age: 25,
    isLoggedIn: false,
    points: 50
  },
  Brook: {
    email: '[email protected]',
    skills: ['HTML', 'CSS', 'JavaScript', 'React', 'Redux'],
    age: 30,
    isLoggedIn: true,
    points: 50
  }
}

const resultArray = Object.entries(users).map(([user, {skills}]) => [user, skills])
const resultObject = Object.entries(users).map(([user, {skills}]) => ({user, skills}))

console.log(resultArray)
console.log(resultObject)

uj5u.com熱心網友回復：

let userId = Object.keys(users);  //(3) ['Alex', 'Asab', 'Brook']

userId.forEach(u=> {
    console.log(users[u].skills);
});

uj5u.com熱心網友回復：

您快到了 -

for (let i = 0; i < userId.length; i  ) {
  let userSkills = users[userId[i]].skills;
  console.log(userId[i], userSkills);
}

使用括號表示法而不是點表示法。因為所有時間點符號都是不可接受的。像 - .number、.dependingValue、.anyCalculation、numericValue.something

Javascript混淆了十進制。

閱讀更多：https ://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_accessors

uj5u.com熱心網友回復：

    for (name in users) {
      console.log([name, ...users[name].skills])
    }

標籤：javascript 目的 特性 钥匙

上一篇：VueJS從父級訪問v-for中的選擇選項

下一篇：在MariaDBsql查詢中模擬ROW_NUMBER()執行查詢時回傳null