How to get expected document.write output using function

Question

At the start I would like to mention that I'm at the beginning stage of my journey learning JavaScript, so sorry in advance if the question looks silly:

I've got 2 arrays with index number assign to them: I'm trying to code a function that will return desired name and job title when I point it to desired index number from the names array, but I'm stuck.

My function looks like this and my imagined output would be, for example if i call
name_and_job(names[1]),
it'll return:

Michael, It Director

var job_title = new Array();
job_title[0] = "IT Specialist";
job_title[1] = "IT Director";
job_title[2] = "Administration Specialist";
job_title[3] = "Payroll Specialist";

var names = new Array();
names[0] = "Peter";
names[1] = "Michael"
names[2] = "Elizabeth";
names[3] = "Scotty";


function name_and_job() {
  if (names == 0)  {
    document.write(names[0] + " ," + job_title[0])
  } else if (names == 1) {
    document.write(names[1] + " ," + job_title[1])
  } else if (names == 2) {
    document.write(names[2] + " ," + job_title[2])
  } else if (names == 3) {
    document.write(names[3] + " ," + job_title[03])
  }
}

name_and_job()

document.write is not a recommended way to add content to a document. Use proper DOM manipulation methods instead. — Teemu
– Teemu, Commented Mar 19, 2021 at 8:27
Thank for that, will check the article. As i mention im at the start of my journey with JS, so need to sort out which methods are better to use where — Piotr Blus
– Piotr Blus, Commented Mar 19, 2021 at 9:01

mplungjan · Accepted Answer · 2021-03-19 08:11:00Z

1

But names is an array and not == 0

You might mean

var job_title = new Array();
job_title[0] = "IT Specialist";
job_title[1] = "IT Director";
job_title[2] = "Administration Specialist";
job_title[3] = "Payroll Specialist";

var names = new Array();
names[0] = "Peter";
names[1] = "Michael"
names[2] = "Elizabeth";
names[3] = "Scotty";


function name_and_job(idx) {
  document.write(names[idx] + ", " + job_title[idx]);
}

name_and_job(1);

or better

const people = [
  {"name":  "Peter","job_title": "IT Specialist"},
  {"name": "Michael","job_title": "IT Director"},
  {"name": "Elizabeth","job_title": "Administration Specialist"},
  {"name": "Scotty","job_title": "Payroll Specialist"}
];

function name_and_job(idx) {
  const person = people[idx];
  document.getElementById("name").textContent = person.name;
  document.getElementById("job_title").textContent = person.job_title;
}

name_and_job(1);

<span id="name"></span>, <span id="job_title"></span>

or even

const people = [
  {"name":  "Peter","job_title": "IT Specialist"},
  {"name": "Michael","job_title": "IT Director"},
  {"name": "Elizabeth","job_title": "Administration Specialist"},
  {"name": "Scotty","job_title": "Payroll Specialist"}
];

document.getElementById("people").innerHTML = people.map(({name,job_title}) => `<li>${name}, ${job_title}</li>`).join('');

<ul id="people"></ul>

edited Mar 19, 2021 at 8:11

answered Mar 19, 2021 at 8:04

mplungjan

180k29 gold badges183 silver badges246 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Piotr Blus Over a year ago

Thank you for that, (idx) get the job done, will investigate how this work further.

AlexisG · Accepted Answer · 2021-03-19 08:08:33Z

0

Maybe something like this?

function name_and_job(name) {
 for(let i = 0; i < names.length; i++) {
    if (names[i] == name)  {
      document.write(names[i] + " ," + job_title[i])
    }
  }
}

name_and_job("Peter")

or

function name_and_job(name) {
   let index = names.indexOf(name);
   
    if(index > -1) {
        document.write(names[index] + " ," + job_title[index])
    }
}

name_and_job("Peter")

answered Mar 19, 2021 at 8:08

AlexisG

2,4843 gold badges13 silver badges25 bronze badges

Comments

Piotr Blus · Accepted Answer · 2021-03-19 09:06:26Z

0

Thanks alot ! for code examples provided guys i'll try to sort out what each of it does and try to get better understaing of it. So far i managed to get desired output by using idx method

Have a Great Day

answered Mar 19, 2021 at 9:06

Piotr Blus

133 bronze badges

Collectives™ on Stack Overflow

How to get expected document.write output using function

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related