对象内部的循环数组[重复]

Question

我有一个名为 myInfo 的对象

var myInfo = {
            skills: ['PHP', 'Java', 'JavaScript', 'HTML', 'CSS', 'jQuery'],
            languages: ['English', 'German']
            }

我想遍历skills 数组内的字符串，该数组位于myInfo 对象内。这个我试过了，好像不行

        var mySkills = '';
        for (i=0, i < myInfo.skills.length, i++) {
          mySkills += 'li' + myInfo.skills + 'li';
        }
        document.write(mySkills);

任何帮助将不胜感激。也许我在代码的某个地方出错了。

Answer 1

我会编写一个创建li 的例程：

function li(content) {
  const elt = document.createElement('li');
  elt.innerHTML = content;
  return elt;
}

现在，基于数组创建一个文档片段，将所有lis 放入：

function makeLis(contents) {
  const frag = document.createDocumentFragment();

  contents.forEach(content => frag.appendChild(li(content));
  return frag;
}

编写一个函数来创建一个ul 元素以将li 放入：

function makeUl(contents) {
  const ul = document.createElement('ul');

  ul.appendChild(makeLis(contents));
  return ul;
}

现在您可以将其写入文档：

document.getElementById('target').appendChild(makeUl(contents));

Answer 2

通过索引获取技能值

var mySkills = '';
for(i=0; i < myInfo.skills.length; i++) {
    mySkills += '<li>' + myInfo.skills[i] + '</li>';
}
document.write(mySkills);

Answer 3

您可以通过索引 [] 访问对象数组中的单个对象。 对象基于 0 索引。

skills: ['PHP', 'Java', 'JavaScript', 'HTML', 'CSS', 'jQuery'],

PHP 是对象数组的开始，位置 0

mySkills += '<li>' + myInfo.skills[i] + '</li>';

i 每次通过都会递增，直到，

for(i=0; i < myInfo.skills.length, i++) {

i 大于数组的length，0,1,2,3,4,5。

初始化变量时需要分号。

Answer 4

除非你也需要访问索引，否则你可以使用for.. of

var myInfo = {
            skills: ['PHP', 'Java', 'JavaScript', 'HTML', 'CSS', 'jQuery'],
            languages: ['English', 'German']
            }
            
for (let skill of myInfo.skills)
{
  console.log(skill);
}

如果您确实需要访问索引并且不想写很长的i=0; i < length; i++，您可以改用for... in

var myInfo = {
            skills: ['PHP', 'Java', 'JavaScript', 'HTML', 'CSS', 'jQuery'],
            languages: ['English', 'German']
            }
            
for (let index in myInfo.skills)
{
  console.log(myInfo.skills[index], "at index", index);
}