splitProps instead of destructuring?

How does

splitProps

splitProps

splitProps

splitProps work exactly?

export const ResultDisplay: Component<{ result: Result }> = (props) => {
  const [res] = splitProps(props, ["result"]);

export const ResultDisplay: Component<{ result: Result }> = (props) => {
  const [res] = splitProps(props, ["result"]);

export const ResultDisplay: Component<{ result: Result }> = (props) => {
  const [res] = splitProps(props, ["result"]);

export const ResultDisplay: Component<{ result: Result }> = (props) => {
  const [res] = splitProps(props, ["result"]);

In this case it's absolutely the same if I write

splitProps(props, ["result"]);

splitProps(props, ["result"]);

splitProps(props, ["result"]);

splitProps(props, ["result"]); or

splitProps(props, []);

splitProps(props, []);

splitProps(props, []);

splitProps(props, []);.

I just get

props

props

props

props. I know I can use:

const result = () => props.result;

const result = () => props.result;

const result = () => props.result;

const result = () => props.result;

But I'm not sure how

splitProps

splitProps

splitProps

splitProps works.