[TIL] 2020 07 29 Wed (3일차)

Hailey Song·2020년 7월 29일
0

TIL_CodeStates

목록 보기
3/68

1. 오늘 하루 요약

1) Velog 마크다운

새로운 거 찾았다! 다른 블로거분들은 코드블럭이 되게 알록달록한데 내 것만 밍숭맹숭해서 찾아보다가 발견했다!

참고 : velog 마크다운(markdown) 작성법

요약하자면 원래 ``` < 이렇게 점 세개로 위아래를 감싸면 코드블럭이 생성되는데
윗줄의 트리플 백틱 옆에 사용하는 언어를 적으면 된다!

[``` javascript] 혹은 [```js] 요렇게! (지금은 코드블럭이 생성되는 걸 임의로 막기 위해 [] 안에 감싸놓았다ㅋㅋ)

let feeling = 'enjoy!';

오호호!

코드블럭 테마도 블랙으로 설정할 수 있는 것 같은데 그건 아직 못 찾고 있다. 이따 쉬는 시간에 찾아봐야지.

2) JS 주석처리로 페어 프로그래밍 비교하기

// 한줄 주석은 요거
/* */여러줄 주석은 요거!

코플릿을 할 때 페어 한 명은 네비게이터, 다른 한 명은 드라이버의 역할을 맡는데,
드라이버의 화면을 공유하면서 진행하기 때문에 네비게이터일 때에는 코드를 짜지만 정작 결과물을 받지는 못한다. 그래서 나중에 내가 다시 한 번 풀어볼 땐 내가 네비게이터한 문제임에도 불구하고 계속 틀리는 대참사가ㅋㅋㅋ (물론 그러면서 고민하고 성장하는 거겠지만..)
그렇지만 내가 드라이버로 임한 문제는 페어분의 풀이가 내게 남는다는 거! 하지만 이거 역시도 내가 스스로 풀어봐야 하기 때문에 나는 여태까지 페어분의 코드를 초기화해버렸다. 내 코드와 페어분과의 코드를 비교해볼 생각을 못한 것이다ㅎㅎㅎㅎㅎㅎㅎ

그래서 오늘이제야 생각해낸 것이 페어님의 코드를 주석처리해서 저 맨~~ 끝에다가 안보이게 배치하고 위에다가 내 코드를 작성한 후 돌려보는 것. 그럼 페어님의 코드, 코드스테이츠의 레퍼런스, 내 코드까지 세 개의 코드를 비교할 수 있게 된다. 코드스테이츠의 레퍼런스는 뭔가.. 내가 열 줄 이상으로 작성한 코드를 한 줄로 끝내버리는 경우가 종종 있어서 허무해지지만.. 생각을 명료하게 하는데 도움이 되고, 페어분의 코드는 같이 고민하는 시간이 있어서 그런지 어떤 생각을 거쳐서 그 과정을 겪었는지를 파악하는데 도움이 된다. 내 코드는 스스로 고민하면서 페어 프로그래밍 시간관계상 해보지 못했던 시도들을 할 수 있어서 약간 더 성취감도 들고ㅎㅎ 암튼 그렇다.

3) 코드스테이츠의 큰그림;; 에러 메세지

코플릿을 풀면서 제대로 푼 것 같은데 자꾸 에러메세지가 나올 때가 있다. 에러메세지를 확인해보면 종종 문제에서는 "ABC."를 출력하라고 되어 있는데 에러메세지는 expected "ABC." to equal ABC 이런 식으로 나올 때가 있다.. 문제에서 요구하는 것과 실제 정답이 다른 것이다..ㅎㅎ(심지어는 문제와 예시와 정답이 모두 다른 경우도 있었다. 허허) 처음엔 '일해라 코드스테이츠!' 이런 마음으로(ㅎㅎ) 정정 메세지를 보내볼까 생각도 해봤는데 가면 갈수록 이게 코드스테이츠의 큰그림이 아닐까하는 생각이 들었다. 에러메세지를 제대로 확인하라는!

생각해보면 개발자는 결국 인간이기 때문에 실수를 할 수밖에 없고, 테스트 코드로 내가 제대로 가고 있는지 지속적으로 확인하면서 시행착오를 겪어야하는데, 이런 에러 메세지들을 계속 읽어보고 실수를 고치는 경험이 누적되면 훗날 훌륭한 개발자로 성장하는데 엄청난 도움이 될 것이다.(뭔가 더 격렬하게 표현하고 싶은데 내 어휘력의 한계를 느낀다ㅎㅎ) 그걸 위해 일부러 다른 코드를 구현해놓고 에러메세지를 제대로 확인해서 원하는 방향으로 구현할 수 있도록 코드스테이츠가 의도한 것이 아닐까?

이게 출제 의도가 맞나요, 코드스테이츠..? 그냥 얻어 걸린 건 아니겠지?

4) console.log / debugger;

난 왜케 이게 안되냐..

5) 반복문!! 멘탈 붕괴

위의 4번까지는 오전에 어제 배운 것 복습하면서 글 쓴 흔적이고.. 오늘자 코플릿은 정말 멘붕의 연속이었다ㅠㅠ 뇌정지가 와서 머리가 안 돌아가..
어제까지는 좀 어렵긴 해도 못 풀 만하진 않았는데 오늘은 문제를 보고 멘붕이 와서(익숙하지 않은 반복문 + 팩토리얼, 소수, 약수 등등의 수학적 지식) 아 진짜 뭐부터 해야하지? 뭘 해야 하지? 이게 뭐야! 라는 생각만 반복하니까 문제를 차근히 풀 엄두를 못 냈다.

(오래전 교육학 지식을 더듬어보자면)
학생 스스로는 풀기 어렵지만 약간의 도움(비계 설정)만 있으면 풀 수 있는 문제를 '도전적 과제'라고 하는데, 오늘 페어님이 내게 정말 비계 설정을 잘 해 주셨다ㅠㅠㅠ 혼자 있었다면 절대 못 풀었을거야ㅠㅠㅠ 진짜 힌트를 한 단계 한 단계씩 주셔서 차근차근 계단 올라가듯이 풀어냈다. 지금 다시 스스로 해보고 있는데 느리지만 조금씩 풀어나갈 수는 있어서 한 시름 놓은 느낌?

내일은 배열이라는데..
엑셀을 할 때도 배열은 이해를 못 해서 우회적인 수식을 쓰는데 코딩이라니, 좀 걱정이 된다. 내일은 평소보다 일찍 일어나서 예습을 미리 해 놔야겠다.

sub)

평소에 유튜브에서 lofi를 즐겨듣는데, 추천 영상에 떴지만 개발자가 아니라서(ㅋㅋ) 한 번도 클릭해보지 않은 lofi(이름하여 '코딩할 때 듣기 좋은 로파이 재즈 음악')을 들을 수 있는 자격이 되었다. 오늘 처음으로 들어봤는데 키보드 뿌수는 영상이 넘나 내 마음..ㅋㅋㅋㅋ

코딩/과제 할 때 집중하기 좋은 로파이 재즈 음악
https://www.youtube.com/watch?v=SyqyRv6NS_U

코딩할 때 듣기 좋은 로파이 재즈 음악
https://www.youtube.com/watch?v=nxKfi-6EtmY

2. 반복문

함수가 처리해야 하는 정보가 수백만으로 늘어나면?? 복잡하면??

정보에 순서를 부여 : 배열
대량의 정보를 반복적으로 실행 : 반복문 ( 같거나 비슷한 코드를 여러번 실행시켜야 할 경우에 쓰는 구문)

1) For 구문


for(초기화; 조건식; 증감문) {반복할 내용}
// 초기화 : 시작 (어디부터 시작할 것인지)
// 조건식 : 끝 (언제까지 반복할 것인지)
// 증감문 : 어떻게 반복할 것인지

for(let n=0; n<5; n=n+1) {
  console.log("Hello World")
}

내가 이해한 바로는 (맞을지는 모르겠다)

1. 함수 선언
2. 함수 안에 리턴을 할 변수 선언, 변수의 초기값 설정.
3. for 구문의 조건 설정
4. for 구문의 반복할 내용 설정
5. 반복한 결과값을 변수에 할당
6. 함수의 리턴값(결과값을 할당한 변수) 설정

이런 순서대로 처리했던 것 같다.

function sum(n) { // 1. 함수 선언
  let result = 0; // 2. 리턴을 할 변수 선언, 변수의 초기값 설정.
  for (let i = 0; i < n; i++) { // 3. for 구문의 조건 설정
    result = result + i; // 4, 5. for 구문의 반복할 내용 설정, 반복한 결과값을 변수에 할당
  }
  return result; // 6. 함수의 리턴값 설정
}

사실 지금까지도 아리송하긴 하다..

아 그리고 오늘 새롭게 안 사실 하나

i = i + 1;
i += 1;
i++;
는 모두 같은 표현식이다!

(미래에서 왔어요!)
리턴을 할 변수에 초기값을 설정하지 않은 경우에는 undefined가 되는 것에 주의!
ex) undefined(초기값이 없을 때) + 10(조건문에서 무언가를 추가한다면) -> NaN 이런 식으로 에러가 날 수 있다.

1-1) 이중 루프 (중첩 반복문)

for 안에 for이 들어간 형태
i가 1번 돌아갈 동안 j가 n번 돌아가고
그렇게 i가 n번 돌아갈 때까지 계속된다. 경우의 수는 n*n

2) While 구문

while 구문은 for 구문과 유사하지만 초기화를 while 바깥쪽에서 선언하기 때문에 초기화가 필요 없을 때 사용한다고 한다.

function sum(n) {
  let result = 0;
  let i = 0; // for의 초기화를 while의 바깥에서 선언
  
  while (i < n) { // for의 조건식을 소괄호 안에 배치
    result += 1; // for의 반복할 내용
    i++ // for의 증감문
  }
  return result;
}

sub)

몰라서 혼용했던 사실!

( )는 소괄호
{ }는 중괄호
[ ]는 대괄호

여태까지 { }가 대괄호인줄 알았다..

note)

못 푼 문제 : 반복문 07번, 반복문 14번
풀었지만 새로운 접근이 필요한 문제 : 반복문 9번, 반복문 16번

0개의 댓글