After exploring Scott's linked answer, I was pleased to find that it effectively resolved the issue at hand.

import { tree } from './Tree'
import { bind } from './Func'

const parent = (path = "") =>
  bind
    ( (pos = path.lastIndexOf(".")) =>
        pos === -1
          ? null
          : path.substr(0, pos)
    )

const myTree =
  tree                          // <- make tree
    ( list                      // <- array of nodes
    , node => parent(node.path) // <- foreign key
    , (node, children) =>       // <- node reconstructor
        ({ ...node, children: children(node.path) }) // <- primary key
    )

console.log(JSON.stringify(myTree, null, 2))

[
  {
    "location": 1,
    "path": "4",
    "children": [
      {
        "location": 2,
        "path": "4.1",
        "children": [
          {
            "location": 3,
            "path": "4.1.1",
            "children": []
          },
          {
            "location": 4,
            "path": "4.1.2",
            "children": []
          }
        ]
      },
      {
        "location": 5,
        "path": "4.2",
        "children": [
          {
            "location": 6,
            "path": "4.2.1",
            "children": []
          }
        ]
      },
      {
        "location": 7,
        "path": "4.3",
        "children": [
          {
            "location": 8,
            "path": "4.3.1",
            "children": []
          }
        ]
      }
    ]
  }
]

The Tree logic can be found in this helpful post, and below is a snippet from the Func module containing the essential bind function:

// Func.js
const identity = x => x

const bind = (f, ...args) =>
  f(...args)

const raise = (msg = "") => // functional throw
  { throw Error(msg) }

// ...

export { identity, bind, raise, ... }

To confirm the outcomes, expand the code block below in your browser:

// Func.js
const bind = (f, ...args) =>
  f(...args)
  
// Index.js
const empty = _ =>
  new Map

const update = (r, k, t) =>
  r.set(k, t(r.get(k)))

const append = (r, k, v) =>
  update(r, k, (all = []) => [...all, v])

const index = (all = [], indexer) =>
  all.reduce
      ( (r, v) => append(r, indexer(v), v)
      , empty()
      )
      
// Tree.js
// import { index } from './Index'
function tree (all, indexer, maker, root = null)
{ const cache =
    index(all, indexer)

  const many = (all = []) =>
    all.map(x => one(x))
    
  const one = (single) =>
    maker(single, next => many(cache.get(next)))

  return many(cache.get(root))
}

// Main.js
// import { tree } from './Tree'
// import { bind } from './Func'

const parent = (path = "") =>
  bind
    ( (pos = path.lastIndexOf(".")) =>
        pos === -1
          ? null
          : path.substr(0, pos)
    )

const list =
  [{location:1,path:'4'},{location:2,path:'4.1'},{location:3,path:'4.1.1'},{location:4,path:'4.1.2'},{location:5,path:'4.2'},{location:6,path:'4.2.1'},{location:7,path:'4.3'},{location:8,path:'4.3.1'}]

const myTree =
  tree
    ( list                      // <- array of nodes
    , node => parent(node.path) // <- foreign key
    , (node, children) =>       // <- node reconstructor
        ({ ...node, children: children(node.path) }) // <- primary key
    )

console.log(JSON.stringify(myTree, null, 2))

To achieve this task, one approach is to utilize an intermediate index that maps paths to objects. By folding the list into a structured format, we can retrieve each node and its parent from the index. If a parent is not found, we add it to the root object. Eventually, we return the children of the root object. Below is the implementation:

const restructure = (list) => {
  const index = list.reduce(
    (a, {path, ...rest}) => ({...a, [path]: {path, ...rest}}), 
    {}
  )
  
  return list.reduce((root, {path}) => {
    const node = index[path]
    const parent = index[path.split('.').slice(0, -1).join('.')] || root
    parent.children = [...(parent.children || []), node]
    return root
  }, {children: []}).children
}

const list = [{location: 1, path: '4'}, {location: 2, path: '4.1' }, {location: 3, path: '4.1.1'}, {location: 4, path: '4.1.2'}, {location: 5, path: '4.2'}, {location: 6, path: '4.2.1'}, {location: 7, path: '4.3'}, {location: 8, path: '4.3.1'}]

console.log(restructure(list))

.as-console-wrapper {min-height: 100% !important; top: 0}

Utilizing the index eliminates the need for sorting as the input order does not matter.

Determining the parent involves substituting, for example, "4.3.1" with "4.3" and searching for it in the index. When attempting "4", it refers to the empty string, fails to locate it, and resorts to the root node.

If you prefer using regex, you can opt for this shorter line instead:

const parent = index[path.replace(/(^|\\.)[^.]+$/, '')] || root

Alternatively, you may want to explore a more elegant solution mentioned in a recent answer to a similar query. Although my approach achieves the desired outcome (despite some messy mutations), the suggested answer provides valuable insights into efficient software development practices.

To begin, arrange the array of objects by path to ensure that the parent precedes its children in the sorted array. For example, '4' should come before '4.1.'

Next, establish an object where the keys represent the paths. Let's assume '4' has already been added to our object.

obj = {
  '4': {
    "location": 1,
    "path": "4",    
  }
}

When handling '4.1', start by checking if '4' exists in our object. If it does, navigate to its children (if 'children' key is absent, create a new empty object) and verify if '4.1' is present. If not, add '4.1'.

obj = {
  '4': {
    "location": 1,
    "path": "4",
    "children": {
      "4.1": {
        "location": 2,
        "path": "4.1"
      }
    }
  }
}

Repeat this process for each element in the list. Finally, recursively convert this object into an array of objects.

Final implementation:

list.sort(function(a, b) {
  return a.path - b.path;
})

let obj = {}

list.forEach(x => {
  let cur = obj;
  for (let i = 0; i < x.path.length; i += 2) {
    console.log(x.path.substring(0, i + 1))
    if (x.path.substring(0, i + 1) in cur) {
      cur = cur[x.path.substring(0, i + 1)]
      if (!('children' in cur)) {
        cur['children'] = {}
      }
      cur = cur['children']
    } else {
      break;
    }
  }
  cur[x.path] = x;
})

function recurse (obj) {
  let res = [];
  Object.keys(obj).forEach((key) => {
    if (obj[key]['children'] !== null && typeof obj[key]['children'] === 'object') {
      obj[key]['children'] = recurse(obj[key]['children'])
    }
    res.push(obj[key])
  })
  return res;
}

console.log(recurse(obj));

My approach was similar to Aadith's, but I took an iterative route. In my opinion, the most efficient method would be to utilize a linked list structure and then flatten it.

const list = [
  {
    location: 1,
    path: '4'
  },
  {
    location: 2,
    path: '4.1'
  },  
  {
    location: 3,
    path: '4.1.1'
  },  
  {
    location: 4,
    path: '4.1.2'
  },  
  {
    location: 5,
    path: '4.2'
  },  
  {
    location: 6,
    path: '4.2.1'
  },
  {
    location: 7,
    path: '4.3'
  },
  {
    location: 8,
    path: '4.3.1'
  }
];

let newList = [];
list.forEach((location) => {
  console.log('Handling location ', location);
  if(location.path.split('.').length == 1)
  {
    location.children = [];
    newList.push(location);
  }
  else
  {
    newList.forEach(loc => {
      console.log('checking out: ', loc);
      let found = false;
      while (!found)
      {
        console.log(loc.path, '==', location.path.substring(0, location.path.lastIndexOf('.')));
        found = loc.path == location.path.substring(0, location.path.lastIndexOf('.'));
        if (!found)
        {
          for (let i = 0; i < loc.children.length; i++)
          {
            let aloc = loc.children[i];
            
            found = aloc.path == location.path.substring(0, location.path.lastIndexOf('.'));
            if (found)
            {
              console.log('found it...', loc);
              location.children = [];
              aloc.children.push(location);
              break;
            }
          }
        }
        else
        {
          console.log('found it...', loc);
          location.children = [];
          loc.children.push(location);
        }
      }
    });
  }
});

console.log(newList);

This was my unique way of tackling the problem at hand.

Appreciation for the plethora of suggestions provided! I was able to envision some truly advanced solutions to tackle my issue. However, at the end of the day, I opted for a more straightforward "dirty" solution.

While it may not be the fastest approach, considering the length of the list in my application, optimization concerns are minimal for now.

I simplified the flattened list for the sake of my query, but in reality, the list was slightly more intricate than portrayed. Additionally, passing the desired path to locate its children was also feasible.

The following solution proved effective for me:

function handleNested(list, location) {
  return list.map((item) => {
    if (item.children && item.children.length > 0) {
      item.children = handleNested(item.children, location);
    }
    if (
      location.path.startsWith(item.path) &&
      location.path.split(".").length === item.path.split(".").length + 1
    ) {
      return {
        ...item,
        children: item.children ? [...item.children, location] : [location],
      };
    } else {
      return item;
    }
  });
}

function locationList(path) {
  // Filtering the list to remove items with different parent path, and sorting by path depth.
  const filteredList = list
    .filter((location) => location.path.startsWith(path))
    .sort((a, b) => a.path.length - b.path.length);

  let nestedList = [];
  // Looping through the filtered list and organizing each item under its parent.
  for (let i = 0; i < filteredList.length; i++) {
    // Utilizing a recursive function to determine its parent.
    let res = handleNested(nestedList, filteredList[i]);
    nestedList = res;
  }

  return nestedList;
}

locationList("4");