2021.05.10~ 05.15

코드스테이츠에 합격통지를 받고 월요일부터 시작을 했다. 시간표를 보고 09시부터 18시까지 점심시간 1시간을 제외하고 전부 일정이 있어서 굉장히 부담스럽기도 하고 걱정됐었지만 , 벌써 주말이 되었다.

변수와 자료형을 시작으로 지금까지는 HTML,CSS를 공부하고 있지만 꾸준히 내가 배운것들을 인지하고, 기록하기위해서 블로그에 남기려고 결심했고 주어진 블로그들중에 velog가 가장 좋아보여서 선택했다.

변수와 자료형을 공부하고 페어프로그래밍을 하면서 직접 주어진 문제를 풀고 수도코드를 작성하였었는데 , 처음엔 페어분께 피해를 드리고싶지않아서였는지 압박감이 심해서 식은땀이 흘렀고 허리상태가 원래는 좋지않았었는데 장시간 경직된 앉아 있었던 탓에 복직근이랑 장요근이 짧아져서 허리통증도 심해져 도수치료를 받았었다.

직접 배운 내용들을 바탕으로 문제를 풀어가다보니 많은 것들을 느꼈다.

1. 변수에 대한 이해.

먼저 변수는 선언(보관함확보) 을 하고 그 안에 데이터를 저장(할당) 하는 것이었는데 변수는 js에서 let이라는 키워드를 사용하고 선언은 한번만 할 수 있다는 것. 그리고 =이 같다라는 의미가 아닌 대입이라는 의미로 생각해야한다는 것을 깨달았고 , 변수명에는 공백사용이 불가해서 단어의 첫글자를 대문자로 한다는 것 그리고 선언한 변수를 다시 변수로 담을 수 도 있다는 걸 알게 되었다.

A. 변수타입.

스트링(string)타입 , 넘버(number) ,
참거짓(boolean) , undefined 등 타입별로 다른 속성과 메소드를 가지고 있다는 것을 알게 되었다.

예를 들어 문자열을 매개변수로 입력받아 넘버타입으로 출력해야할 때 , word.length로 코드를 짜야 한다라던지 등등 직접 수도코드를 작성하고 문제에 직접 부딪혀보면서 알게되는 것들이 많았다. c언어 교양수업을 들을때는 ==라는 걸 사용했었는데 JS에서는 그와다르게 (===,!==)를 사용해야 정확한 값을 알 수 있다는 것도 있었고 , undefined가 정의되지않았다는 의미로 받아들이면서 , 변수를 선언,할당하고 리턴문이 없으면 문제가 생긴다는 것도 이해한거 같다.

2. 함수에 대한 이해

함수는 논리적인 작업을 하는 하나의 단위를 말하고 , 어떤 목적을 가진 작업들을 수행하는 코드들이 모인 블록이라고도 설명할 수 있다.

선언을 위해 필요한 키워드(keyword),이름(name),매개변수(parameter),바디(body)등과 함께 선언과 호출의 작동원리 그리고 다양한 표현식들이 변수에 담기는 과정과 결과값이 변수에 할당되어 담기는 과정에 대해서 공부했다.

이를 바탕으로 호출과 리턴을 직접 코플릿 문제를 풀면서 매개변수(parameter) , 전달인자(argument) 에 대한 구분과 함께 표현식(선언식, 표현식, 화살표함수 등 ) 에 대해서 습득해 나갔다.

A. 함수의 구조.

키워드 네임 (매개변수)가 기본구조이고 큰 틀을 body라고 정의한다.
함수는 코드의 묶음(즐찾버튼)이어서 버튼처럼 필요할 경우에 사용할 수 있다.
또한 구체적인 입력값과 출력값을 가질 수 있었다.
마지막으로는 호출후에 필수적으로 리턴을 해야한다는 사실을 알게 되었다.

B. 함수 선언 (버튼제작)

함수버튼제작= 함수의 선언으로 이해했다. 동시에 함수는 특별한 공간에 보관된다. 이 작업이 수행되면 , 언제든 사용할 수 있다.
이렇게 저장되어있는 함수들이 호출되면 매개변수들이 호출시 전달된 인자의 값으로 바뀐다.
그리고 이상이없으면 코드가 실행되고 이후에 리턴이 되면 호출된 장소로 돌아가게 된다. 만약 리턴문을 사용하지 않는다면 , undefined(정의되지않은타입)을 반환 하게 된다. 그래서 함수는 항상 출력값을 반환한다고 생각하면 되겠다. 그리고 특정값만 알아내는 상황을 제외하고 반복적으로 실행이 되는 상황이 필요한 경우에는 함수로 만들면 해결할 수 있다.

C. 입력값과 출력값.

매개변수가 입력값인 것으로 이해를 했고 , 출력값은 결과값을 함수 밖으로 가져와야 할 때 return을 해야하는데 함수가 실행이 되는 도중 return을 만나면 반환이 되고 , 동시에 함수가 종료된다. 이걸 출력이라고 한다고 배웠다.
위에서 글로 적었듯이 , 함수내부코드에서 return문을 사용하지 않으면 출력값이 undefined로 나오는 것이다.

D. 함수선언방법.

함수선언식 , 표현식 , 화살표 함수가 있다.

함수표현식보다 화살표함수가 더 간결해 보이긴 했지만 코플릿에서는 대부분 일반 표현식을 통해서만 작성을 했다.

먼저 선언한 변수들을 계속적으로 활용하기 위해서는 함수를 호출해야만 한다.
매개변수를 선언해서 입력값을 받아서 출력하는 형식으로 이해를 하였다. 근데 코플릿문제를 풀면서 매개변수와 변수가 같은 개념이라고 생각했었는데 , 매개변수는 할당된 값이 없기 때문에 이름에 대해서 너무 신경쓸 필요가 없는 것 같다. parameter와 argument의 차이점은 값을 입력받을 때는 매개변수를 이용하지만 , 함수를 호출할 때 전달해주는 값은 전달인자 즉 , 함수를 호출 할 때 매개변수에 할당 된 값을 의미한다. 추가적으로 코드를 작성할 때 매개 변수는 그대로 가져와야지 ''안으로 불러오면 설정된값이 인식되지 않는다.

이렇게 매개변수는 함수를 실행할 때 입력에 따라서 바뀔 수 있지만 일반변수를 선언할 때처럼 let키워드를 사용하지 않고 사용할 수 있다. + 함수안에서 선언된 변수는 함수 밖에서 사용 될 수 없다. 그에반해 매개변수는 데이터를 차지하지 않고 할당되지도 않았기 때문에 매개변수는 이름이 겹쳐도 상관없다. 코플릿을 하면서 페어분께서 내가 매개변수와 변수를 같은 개념으로 이해하고 있는 것 같다하시면서 좋은 조언을 해주셨다.

공부를 하면서 삼각형의 넓이를 구하는 코드를 봤었는데 문제는 특정값만 구하는 것이 아닌 다양한 최종값을 받아야하는 코드를 짜야할 때는 함수를 이용해서 매개변수에 매번 다른 값을 받으면 해결이 된다는 것으로 이해했다.

3. 코드학습법

A. Javascript를 배울 때 모르는 것이 생긴 경우.

첫번째.내 질문 앞에 mdn을 붙여서 검색하면 보다 신뢰할 수 있는 정보를 찾을 수 있다고 배웠다.
두번째. 영어로 how to [question] in javascript
세번째. 에러메시지는 그대로 복사해서 구글링 해보기

부트캠프에서 공부하는 동안 오류나 궁금증이 생기면 내부적으로 아고라 스테이츠에 질문을 하면 되지만 , 내가 정말 현업에서 이런 경우가 생기면 직접 구글링을 하거나 stackofflow에 질문을 해야하는데 미리 논리적으로 내 상황을 설명하고 오류에 대한 구체적인 설명을 하는 습관을 만들어야 한다고 받아들였다. 그리고 크롬에서 chrome developer 개발자 도구를 다운받아 console에 내 코드를 입력해봐서 문법에러인지 , 디버거 키워드를 활용해서 코드를 단계적으로 확인 할 수 있다.

4. 조건문

조건문에는 반드시 비교연산자(comparison operator)가 필요하다.

그리고 비교의 결과는 항상 Boolean (true or false)이다.

A. 비교연산자.

초과 >
미만 <
이상 >=
이하 <=
같다 ===
다르다 !==

B. 조건문의 큰 틀

if (조건1){ //조건 1이 통과할 경우
} else if(조건2){ //조건 1 x 조건2가 통과할 경우
} else{ //모든조건이 통과하지 않는 경우
}

결과는 Boolean으로 나오는 표현식이 들어간다.

C. 두가지 조건이 한번에 적용되는 경우 (논리연산자[Logical Operator] 이용)

• AND연산자 (&&)
  두가지 조건이 모두 맞을 때 통과 if 한가지 조건만 틀려도 false

• OR연산자 (||)
  둘 중 한 가지 조건만 참이어도 참 if 두가지 조건 모두 거짓이면 false

• NOT연산자 (!)
  trusthy , falsy 여부를 반전시킨다.
  ex) !isStudent && isFemale; = 학생이 아니면서 , 여자이면 통과

• !false // true !undefined // true

  !(3>2) // false !'hello' // false

• 기억해야 될 6가지 falsy값

if(falsy) , if(null), if(undefined), if(0) , if(NaN), if('')

5. 반복문.

같거나 비슷한 코드를 여러번 실행 시켜야 할 때 쓰는 구문이다.

A. 반복문에 대한 이해

-for문과 문자열 , 숫자를 이용해 단순한 기능을 반복하여 수행하게 할 수 있다.

-for문과 while문의 차이점에 대해서 이해 해야한다.

차이점은 초기화,증감문이 필요없을 때 while문을 사용하기 적합하다.

for문 ex)

let sum =1;
for (let n = 2;//초기화 n <= 4;//조건식 n= n+1;//증감문){
sum= sum + n;
}
console.log(sum);

while문 ex)

let sum = 1; //초기화
let n = 2;

while( n <= 4 //조건식) {
sum = sum + n;
n = n + 1;// 증감문
}
console.log(sum); //10

• 이중for문에 대해서 알아야한다.

-for문의 구조 초기화 , 조건식 , 증감문 순으로 작성해야하는것을 인지한다.

1. 반복할 내용을 먼저 작성한다. 
2. 반복할 내용을 중괄호 block안에 넣어준다.