How to get users job title using pnp-sp-js Sharepoint 2019 on-premise

Question

I am working with SharePoint on-premise 2019 and I am trying to get job title from multiple users that are stored in a list as an object.

I am using pnp-sp-js and React framework and can successfully get users ID from a list and then users data with pnp-sp-js siteUsers but jobTitle is missing. What is the other way to get users job title or am I doing something wrong?

let tempData = await pnp.sp.web.lists
      .getByTitle(this.props.list)
      .items.getAll();
    console.log(tempData);
    
    let users = [];
    for (let i = 0; i < tempData.length; i++) {
      users[i] = await pnp.sp.web.siteUsers.select("jobTitle").getById(tempData[i].userId).get();
}

Answer 1

I got the jobTitle from the AD with the help of LoginName and getUserProfilePropertyFor. LoginName property was received with this line:

users[i] = await pnp.sp.web.siteUsers.getById(tempData[i].UserId).get();

and the anwser (jobTitle is stored in property named SPS-JobTitle):

 for (let i = 0; i < tempData.length; i++) {
      let a = await pnp.sp.profiles.getUserProfilePropertyFor(
        users[i].LoginName,
        "SPS-JobTitle"
      );
      temp_jobTitle[i] = a;
    }
    console.log(temp_jobTitle);

Answer 2

You can get the Job Title of user using SharePoint REST API like:

<site url>/_api/web/lists/getByTitle('List Name')/items?$select=Title,Author/JobTitle&$expand=Author

Where Author is internal name of Person or Group field.

Similarly you can expand the person or group field using SP PnP JS and select the Job Title of user, like:

import { sp } from "@pnp/sp";
import "@pnp/sp/webs";
import "@pnp/sp/lists";
import "@pnp/sp/items";

const items = await sp.web.lists.getByTitle("List Name").items.select("Title", "Author/JobTitle").expand("Author").get();
console.log(items);