05. [ 대 ] { 중 } ( 소 ) 괄호 트리플
[대]환장 트리플
자... 이제 어영부영 본격적으로 개발 일을 하게 된 지 5개월이 되었다.
처음에는 맥으로 인터넷하는 것도 어색했는데 이젠 코딩도 소스트리도 슈슈슉 쓴다. 양 옆에 사수 둘이 앉아서 다정하게 코드리뷰도 어버버 해 봤다. 정말 어색했다. 사수들은 자기가 짠 엄청나게 많은 파일의 코드를 보여주면서 이건 어렵지 않아요 하는데 무슨 소린지... 저는 도통 모르겠네요... 이것만 알면 저도 수정할 수 있다는데 그런 일 없게 잘 부탁드리구여. 그리고 작고 소중한 파일 3개짜리 제 코드는요 이렇게요... 그냥 인터넷에 물어보니까 걔네들이 이렇게 해 둔 거 복사해서 적당히 수정해 보니 되길래 이렇게 해 봤습니다. 라고 이야기를 했다.
마찬가지로 혼자서 하기 어려우니까 양 옆에 사수 둘이 지켜보는 가운데 서버에 업로드 하다가 긴장을 많이 해서 수정 한 번에 실수 한 번씩 했다. 그래도 덕분에 이제 혼자서 회사 서버에 깃 풀 git pull 을 할 수 있게 되었다. 만세다. 회사 서버 아직 안 죽었다. 근데 1초 단위로 렌더링이 계속 되어서 데이터를 좀 잡아먹을 거 같은데 서버에 용량이 많아서 괜찮을 것 같다.
처음 시작한 날부터 생각해보면 많이 늘은 것 같은데 그런 느낌을 한 순간에 사라지게 만드는 것이 바로 괄호다. 수학에서 자주 보던 아이들이라 익숙하긴 한데 쓰임새는 영 다르다. (소) {중} [대] 순서로 쓰이는 것이 아니다. 그렇다고 제 역할이 무엇인지 이야기해주는 친절한 아이도 아니다.
이 괄호는 어디에 쓰이는 건가... 하면 여기저기 많이 쓰인다. 근데 어떤 용도로 쓰이는지는 아직 잘 모르겠다. 그냥 영숙어처럼 코드 뭉터기를 통째로 외우고 있으니 괄호 하나에 집착하...긴 했었는데 정확한 대답을 듣진 못했던 것 같다.
조건문을 한다고 하면
```
if ( 배가 고프다 ) {
밥을 먹는다
} else {
커피를 마신다
}
```
이런 식으로 코드가 될테고
반복문을 한다면
```
for (숫자=0; 숫자 <= 10 ; 숫자++) {
숫자 번째 고양이는 귀엽다.
} break
```
그리고 맵핑을 하게 된다면
```
{고양이들.map( (고양이, index) => {
<li key=index> {고양이.이름} 은/는 {고양이.나이} * {고양이.몸무게}만큼 귀엽다. </li>
} )}
```
가 되겠고...
(소)괄호는 뭔가 조건을 나열할 때 쓰는 것 같고
자바스크립트를 하다보니 {중}괄호는 함수를 넣는 것 같다.
[대]괄호는 list 데이터를 넣을 때 쓰는 거였지. 그래서 list 데이터를 불러들일 때 사용했다.
하드코딩을 사랑하는 나는 고양이들.map을 하드코딩으로 자주 했다! 신난다!!
```
<li>`${고양이들[0].이름} 은/는 ${고양이들[0].나이}*${고양이들[0].몸무게}만큼 귀엽다.` </li>
<li>`${고양이들[1].이름} 은/는 ${고양이들[1].나이}*${고양이들[1].몸무게}만큼 귀엽다.` </li>
<li>`${고양이들[2].이름} 은/는 ${고양이들[2].나이}*${고양이들[2].몸무게}만큼 귀엽다.` </li>
```
히히 이렇게 하다 양 사수들이 코드를 예쁘게... 간단히... 줄이자고 해서 눈물의 똥꼬쇼를 했었다.
하나씩 하드코딩 해 둔걸 map 기능을 써서 60줄을 줄였다... 인간승리다.. 만세다... 그렇지만 아직도 대 중 소괄호는 모르겠다. 이건 데이터를 어떻게 정리시키느냐의 문제이기도 하고, 결국 자료구조쪽과 관련이 된 듯 하다. 느낌적인 느낌이 그 쪽 분야를 가르키는 것 같다. 왜 계속 이 괄호에 집착하냐면 회사에서 쓰는 작은 웹앱개발을 거의 대부분 혼자서 하고 있는데, 여기서 이제 데이터를 어떤 모양으로 잡아서 뿌려주고, 서버로 보낼것인지를 정해야하는데 내가 맨 처음 만든것은 이런 모양이었다.. 하도 못해서 테스트 용으로 하나 더 만들어서 연습을 하고 있었다.
이 꼴을 본 남친이 정리해주었다...
나보고 왜이렇게 대괄호를 남발하냐고 하는데 저코드를 작성하던 1월 첫째주까지 {중}괄호일 array를 자바스크립트로 키key와 값value를 분리하는 법을 몰랐다... 충격적이시겠지만 그러했다. 그래서 [대]괄호는 map으로 뿌리면 되니까... 전부 다... 모든 것을... 정성스럽게... [대]괄호 안에 포장을 했다. 변명을 하자면 나는 저 '1'과 '귤'안에도 개별적인 값을 더 넣고 싶었다... 아니 그리고 포장지가 좀 많을 수도 있지 뭐...
'커피' 안에는 아메리카노도 있고, 라떼도 있고, 모카도 있고... 어 막 시장에 가면 게임이 생각나는 것 같으니 그만해야겠다.
내가 맨 처음에 한 저 꼴을 보고 사수 둘이 모여서 뭔가 이야기를 나누었다. 안타깝게도 자리가 멀어서 잘 들리진 않았지만 프론트엔드에서도 보여지는 화면구성에 치중했다보니 이런 분야가 부족하다는 이야기를 했다고는 했다. 이런 것도 알려주다니 친절한 사수다. 그리고 그 다음 주에 그림으로 배우는 개발 이야기 책이 도착했다... 읽어야한다...
그나마 학원 다닐 때, 강사가 데이터 기본에 대해서 열심히 설명한 게 어렴풋이 기억은 난다. 배열이랑 딕셔너리랑 ...뭔가 암튼 많았다. 마치 지금 더하기 빼기를 못 해서 근의 공식을 풀지 못하는 답답함이 있다... 설명이 더 이상한가?
어떻게든 사수들의 도움으로 하나씩 배워나가고는 있지만 이런 내용이 개발자에게는 기초적이고 꼭 알아야하는 필수적이라는 것을 알게 되었다. 작년까지도 몰랐으니 조금은 더 배웠나 싶긴 하다. 코딩을 하면 할수록 중요한 것은 반복되는 것을 줄이고, 간략하게 하는 코드 리팩토링이 강조된다. 효율적이고 다른 사람들이 이해하기 쉬운 코드를 작성하기 위해서라도 기본적인 공부를 계속 해야겠다.
하지만 그 때까지 나는 대괄호 안에 중괄호 안에 대괄호 안에 또 중괄호를 쓰고 대괄호랑 중중 괄호를 남발하고 있겠지.
function ( 매일 매일 ) {
여러분, 새해 복 많이 받으세요.
}
