I have an object named myInfo
var myInfo = { skills: ['PHP', 'Java', 'JavaScript', 'HTML', 'CSS', 'jQuery'], languages: ['English', 'German'] } And I want to loop over the strings inside the skills array which is inside the myInfo object. I've tried this but doesn't seem to work
var mySkills = ''; for (i=0, i < myInfo.skills.length, i++) { mySkills += 'li' + myInfo.skills + 'li'; } document.write(mySkills); Any help will be appreciated. Maybe I went wrong somewhere in the code.
I would write a routine which creates an li:
function li(content) { const elt = document.createElement('li'); elt.innerHTML = content; return elt; } Now, create a document fragment to put all those lis into, based on an array:
function makeLis(contents) { const frag = document.createDocumentFragment(); contents.forEach(content => frag.appendChild(li(content)); return frag; } Write a function to create a ul element to put the li's into:
function makeUl(contents) { const ul = document.createElement('ul'); ul.appendChild(makeLis(contents)); return ul; } Now you can write that into your document:
document.getElementById('target').appendChild(makeUl(contents)); get the values of skills through index
var mySkills = ''; for(i=0; i < myInfo.skills.length; i++) { mySkills += '<li>' + myInfo.skills[i] + '</li>'; } document.write(mySkills); 
; in for(i=0, i < myInfo.skills.length, i++) { instead of ,.You can access an individual object in the Object Array through index []. The objects are 0 index based.
skills: ['PHP', 'Java', 'JavaScript', 'HTML', 'CSS', 'jQuery'], PHP is the start of the object array, at position 0
mySkills += '<li>' + myInfo.skills[i] + '</li>'; i will increment for every pass until,
for(i=0; i < myInfo.skills.length, i++) { i is greater then the length of the array, 0,1,2,3,4,5.
a semi-colon is required when initializing the variable.
Unless you need to access the index as well, you can use for.. of
var myInfo = { skills: ['PHP', 'Java', 'JavaScript', 'HTML', 'CSS', 'jQuery'], languages: ['English', 'German'] } for (let skill of myInfo.skills) { console.log(skill); }If you do need to access the index and you don't want to write a long i=0; i < length; i++ you can use for... in instead
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); }
html string.
li if you don't want the dotting?
;in between the options instead of,. Second, you're not using the i, so isntead ofmyInfo.skillsshould bemyInfo.skills[i]. Thirdly, if you want to use strings to create newlido `<'li>' + myInfo.skills + '</li>'var mySkills = myInfo.skills.map(skill => 'li' + skill + 'li')will produce: ["liPHPli","liJavali"...]. Since this was marked as duplicate, I couldn't post an answer. Also, note that "Arrow Functions," the(skill) => 'li' + skill + 'li'part (short forfunction(skill){ return 'li'+skill+'li' }) won't work in IE (of course), but will work in Edge, for what it's worth.