Ternary 연산자를 사용하여 자바스크립트에서의 표 데이터 관리

08 Nov 2023

javascript

자바스크립트에서 표 데이터를 관리할 때, Ternary 연산자를 사용하면 코드를 간결하고 효율적으로 작성할 수 있습니다. Ternary 연산자는 조건에 따라 다른 값을 할당하는 간단한 방법을 제공합니다.

const data = [
  { name: 'John', age: 25 },
  { name: 'Jane', age: 28 },
  { name: 'Tom', age: 30 }
];

const tableRows = data.map((row) => `
  <tr>
    <td>${row.name}</td>
    <td>${row.age}</td>
    <td>${row.age >= 30 ? '많음' : '적음'}</td>
  </tr>
`).join('');

const table = `
  <table>
    <thead>
      <tr>
        <th>Name</th>
        <th>Age</th>
        <th>Age Group</th>
      </tr>
    </thead>
    <tbody>
      ${tableRows}
    </tbody>
  </table>
`;

console.log(table);

위의 예제에서는 Ternary 연산자를 사용하여 row.age의 값이 30 이상인 경우에는 “많음”, 그렇지 않은 경우에는 “적음”이라는 값을 할당합니다. 이를 통해 표 데이터에 따라 다른 내용을 표시할 수 있습니다.

Ternary 연산자를 사용하면 if-else 문을 사용하는 것보다 간결한 코드를 작성할 수 있습니다. 데이터 관리에 있어서 효율적이고 가독성 있는 코드를 작성할 수 있도록 Ternary 연산자를 적극 활용해보세요.

#참고자료