코딩팁 - ChoDragon9/posts GitHub Wiki

최소 요청 시간이 있는 비동기 처리

5초전에 응답이 오면 경우 5초뒤에 재요청할 것이고 5초뒤에 응답이 오면 응답이 온뒤 재요청한다.

const recur = () => Promise.all([
  new Promise(resolve => setTimeout(resolve, 5000)),
  getData
]).then(recur)

javascript style 작성 시

// AS-IS
dom.style.color = '#fff'
dom.style.fontSize = '12px'

// TO-BE
Object.assign(dom.style, {
  color: '#fff',
  fontSize: '12px'
})

조건 체크 후 기본값을 변경하는 경우

// AS-IS
let latitude = ''
let longitude = ''

if (_.includes(gHeader, '/')) {
  [longitude, latitude] = gHeader.split('/')
  latitude = unbaseLatitude(latitude)
  longitude = unbaseLongitude(longitude)
}

// TO-BE
const [longitude = '', latitude = ''] = gHeader.split('/')
if (longitude && latitude) {
  latitude = unbaseLatitude(latitude)
  longitude = unbaseLongitude(longitude)
}

하나의 값이 필요한 경우

// AS-IS
const { isIOS } = state.env.agent

// TO-BE
const isIOS = state.env.agent.isIOS

불필요한 기본값을 return 하는 경우

// AS-IS
if (items) {
  return _.reduce(items, (sum, item) => sum + item.clientWidth, 0) +
    items.length * CINEMA_ITEM_MARGIN_LEFT_RIGHT
} else {
  return 0
}

// TO-BE
return _.reduce(items, (sum, item) => {
  return sum + item.clientWidth + CINEMA_ITEM_MARGIN_LEFT_RIGHT
}, 0)

불필요한 메모리 생성하지 않기

배열을 만들게 되면 힙메모리에 생성 및 참조가 되므로 많이 사용될 수록 문제가 된다.

// AS-IS
if (![TODAY_STRING, TOMORROW_STRING].includes(dateText)) {
 //Something
}

// TO-BE
if (dateText !== TODAY_STRING && dateText !== TOMORROW_STRING) {
  //Something
}

배열 비우기

const arr = [0, 1, 2, 3]
console.log(arr) // [0, 1, 2, 3]
arr.length = 0
console.log(arr) // []

최대 길이 및 패턴 확인

let value = this.value;
if (this.maxlength && this.maxlength < value.length) {
  value = Array.from({length: this.maxlength})
    .map((v, i) => value[i])
    .join('');
}
if (this.pattern) {
  const regExp = new RegExp(this.pattern);
  value = Array.from(value)
    .filter((txt: string) => regExp.test(txt))
    .join('');
}
this.value = value;

Promise + Generator

const runner = (iter) => (v) => {
  const {value, done} = iter.next(v);
  if (!done) value.then(runner(iter));
}

function loop (gene, ...args) {
  const iter = gene(...args)
  runner(iter)()
}

function * gene () {
  const a = yield Promise.resolve(1);
  console.log('a: ', a)

  const b = yield Promise.resolve(2);
  console.log('b: ', b)

  const c = yield Promise.resolve(3);
  console.log('c: ', c)
}

loop(gene, 123)