JavaScript 코드 리팩터링
1. if
문을 자체함수로 추출한다.
const cats = [
{ name: 'Mojo', months: 84 },
{ name: 'Mao-Mao', months: 34 },
{ name: 'Waffles', months: 4 },
{ name: 'Pickles', months: 6 } ]
var kittens = []
for (var i = 0; i < cats.length; i++) {
if (cats[i].months < 7) {
kittens.push(cats[i].name)
}
}
console.log(kittens)
위와 같은 코드가 있다면,
const isKitten = cat => cat.months < 7
자체함수로 추출하여 if
문 부분을
if (isKitten(cats[i])) { }
로 변경 하는 것이다.
장점
- 가독성이 좋다.
의도가 명확해진다. 함수의 변수명에 의도를 적을 수 있다. - 재사용이 가능하다.
코드는 항상 재사용이 가능하게 만들어야한다.
2. cat의 name를 추출하는 부분을 자체함수로 변경
cat[i].name
의 부분을
for문 밖에서 자체함수로 지정한다.
const getName = cat => cat.name
filter
와 map
으로 for문에서 벗어난다
const kittens = cat.filter(isKitten).map(getName)
3. filter
와 map
을 자체함수로 변경
const getKittenNames = cats =>
cats.filter(isKitten)
.map(getName)
그리고 함수를 호출해 변수에 넣어준다.
const cats = getKittenNames(cats)
Author And Source
이 문제에 관하여(JavaScript 코드 리팩터링), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@miknieyh/JavaScript-코드-리팩터링저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)