JSFiddle - React, Tailwind, and code Playground

HTML

<h3>
  How does it work?
</h3>
<ol>
<li>Break the <div style='display: inline'>str</div> object down into an array using <div style='display: inline'><a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split'>split</a></div> and assign the resulting array to <div style='display: inline'>splitStr</div>
</li>
<li>
  Make a copy of the <div style='display: inline'>object</div> and put it into <div style='display: inline'>result</div>
</li>
<li>
  Iterate over each item in <div style='display: inline'>splitStr</div>, check that <div style='display: inline'>result</div> is not falsy, if it is, <div style='display: inline'>object</div> does not match <div style='display: inline'>str</div> and the index cannot be found so we stop the loop.
</li>
<li>
  Otherwise, dive one layer deeper into the object until there are no more items left in <div style='display: inline'>
  splitStr
  </div>
</li>
</ol>

<h3>
Result:
</h3>

<div id='object'>
  object: 
</div>
<div id='str'>
  str: 
</div>
<div id='splitStr'>
  splitStr: 
</div>
<div id='result'>
  result: 
</div>

CSS

div {
  font-family: "Lucida Console", Monaco, monospace
}

JavaScript

var object =  {item : {id : "51524512541"}};
var str = "item.id";

var splitStr = str.split('.')

let result = object
for(let str of splitStr) {
  if(!result) break;
  result = result[str]
}
console.log(result)

document.getElementById('object').append(JSON.stringify(object))
document.getElementById('str').append(JSON.stringify(str))
document.getElementById('splitStr').append(JSON.stringify(splitStr))
document.getElementById('result').append(result)