React 에서 IIFE 사용

Posted on Edited on In , Word count in article: 83 Reading time ≈ 1 mins.

리액트에서 IIFE (Immediately Invoked Function Expressions)를 사용하자

IIFE 사용이유

IIFE 사용을 통해서 2개의 구문을 1개로 만들 수 있다.
2개의 네이밍을 1개로 만들어서 더 깔끔해지는 효과를 얻을 수 있다

사용예

IIFE 사용전

iffe.js
1
2
3
4
5
6
7
8
9
10
11
import { data } from './data';

const initList = () => {
  const arr = [];
  for (const element of data) {
    arr.push(element);
  }
  return arr;
}

const dataList = initList();

IIFE 사용

동일한 기능이지만 initList 가 필요없어지고 dataList 만 남게되었다

iife.js
1
2
3
4
5
6
7
import { data } from './data';

const dataList = (() => {
  const arr = [];
  for (const element of data) arr.push(element);
  return arr;
})();