선생님 조건문 관련 질문이 있습니다!!

안녕하세요 질문이 있어서 글 남깁니다.

강의에서 나온 JSX 상에서 조건문 사용 방식중 아래의 코드가

특정 문법의 활용으로 보이는데요 공식문서를 찾아봐도 아래와 같은 문법은 보이지가 않아서요 ㅜㅜ

1. 어떤 문법을 사용해서 아래와 같이 작동을 하는지 (ex:  react template 문법, JSX 문법 , ES6문법)

2. 원리가 어떻게 되는지 궁금합니다! !

도움 부탁 드려요 (_ _ )꾸벅

---
# 28강 리액트에서 탭 UI 만들기
# 부모 컴포넌트에서 넘긴 값 props.num 에는 3이 들어있음 
 
function testCompent(props){
  return [ <div>내용0</div>, <div>내용1</div>, <div>내용2</div> ][props.num]
}

# <div>내용2</div> 렌더링됨

---

# 36강 리액트에서 자주쓰는 if문 작성패턴 5개 

# 부모 컴포넌트에서 넘긴 값 props.text 에는 "test"가 들어있음

function testCompent(props){
    <div>
      {
        {
          test : <p>1</p>,
          test-test : <p>2</p>,
          test-test-test : <p>3</p>
        }[props.text]
      }
    </div>
  )
}

# <p>1</p> 렌더링됨

---