데굴데굴

TIL: 2022-08-22 본문

Lesson/TIL

TIL: 2022-08-22

aemaaeng 2022. 8. 22. 22:10

⚙️ 오늘 배운 언어

JavaScript

 

🐹 오늘의 기분

페어 프로그래밍을 해 본 적이 없어서 걱정이 많았었는데 좋은 페어분을 만나서 다행이었다. 초반에 내가 조금 성급하게 진행한 것 같아서 그 부분은 고쳐야겠다고 생각했다. 내일은 또 다른 페어분과 이틀 동안 진행하는데 내가 피해를 주지 않을까 걱정이다. 페어 프로그래밍에 대한 걱정은 언제 해도 사라지지 않을 것 같은 느낌.. 그리고 오랫동안 앉아있으니 생각보다 허리가 더 아파서 스트레칭이랑 운동의 필요성을 절실히 느꼈다. 세션이 끝나고 저녁 먹고 운동하고 씻고 나면 시간이 훌쩍 지나 있어서 깜짝 놀랐다. 시간 관리를 좀 더 해야 할 것 같다는 생각이 들었다. 학습 중간중간 일어서서 스트레칭하는 것도 잊지 말아야겠다. 

+ 퀴즈 풀 때 문제 제대로 읽기! 

 

🗝 키워드

변수, 선언, 할당, 자료형, typeof, 함수, 매개변수, 전달인자, 비교연산자, 선언문, 표현식

 

🗣 스스로에게 설명

변수를 선언하는 것은 데이터를 저장할 공간을 마련한다는 것을 의미한다.

미리 선언해둔 변수에 값을 저장하는 것을 값을 '할당'한다고 한다. 

var보다는 let을 쓰도록

let을 변수마다 써서 할당할 수 있지만 콤마를 써서 아래와 같이 수행할 수도 있다.

let age = 22,
   name = 'Kate';

변수를 선언한 후에 아무런 값도 할당하지 않고 console.log(변수)를 실행하면 undefined가 출력된다.

할당연산자 '='는 수학에서의 '같다'는 의미가 아니다. 

자바스크립트의 주요 원시 자료형에는 string, number, boolean, null, undefined가 있다. 

null은 사용자가 의도적으로 변수에 값이 없다는 것을 명시하기 위해 쓰는 것이고, undefined는 자바스크립트 엔진이 변수를 초기화할 때 사용하는 값이다. 

배열은 따로 타입이 존재하지 않으며 object 타입에 속한다. 

비교연산자에는 '=='와 '===' 두 가지 종류가 있는데 '=='는 타입에 상관없이 값만 비교하지만 '==='는 타입까지 엄격히 비교한다는 차이가 있다.

let val1 = '310';
let val2 = 310;

console.log(val1 == val2); // true
console.log(val1 === val2); // false

 

 

특정 값의 타입이 궁금할 때에는 typeof을 활용한다.

 

함수는 반복적인 코드를 줄여주고 효율적인 코드 수정을 가능하게 한다.

함수가 어떤 값을 리턴하지 않으면 해당 함수 호출 시 undefined를 출력한다.

 

매개변수(parameter)와 전달인자(parameter) 구별

function add(x, y) {
   return x + y;
}

add(4, 6)

위 코드에서 x와 y가 매개변수, 4와 6이 전달인자이다.

전달인자는 인수라고도 하고 부르는 방식이 꽤나 다양한데 우리 과정에서는 위 두 용어로 통일하여 부르기로 했다. 

 

함수의 각 부분은 다음과 같이 부른다.

https://www.tutorialstonight.com/js/js-function

함수를 작성하는 방법에는 선언문, 표현식, 화살표 함수가 있다. (자바스크립트 Deep Dive 159페이지 참조)

1) 선언문

function add(x, y) {
   return x + y;
}

선언문에서는 함수의 이름(여기서는 add)을 생략할 수 없다. 

 

2) 표현식

let add = function (x, y) {
   return x + y;
};

함수 객체를 변수에 할당하는 방식을 함수 표현식이라고 한다. 함수 표현식에서는 함수의 이름을 생략하는 것이 일반적이다. 

 

3) 화살표 함수 

const add = (x, y) => x + y;

화살표 함수는 function 키워드 대신 화살표를 활용해 더 간단하게 함수를 선언하는 방식이다. 

화살표 함수는 함수 선언 방식 뿐만 아니라 내부 동작 또한 간략화되어있다는 특징이 있다. (딥다이브 화살표 함수 챕터 참조할 것)

 

❓ 막히는 or 막혔던 부분

함수 선언문과 표현식, 화살표 함수가 내 눈에는 다 비슷비슷하게 보여서 뭐가 뭔지 구별하기 힘들었다.

부트캠프 전에 혼자 자바스크립트 Deep Dive를 읽을 때에도 헷갈렸는데 자주 접해보고 또 직접 작성해보면서 이 기회에 제대로 잡아놔야겠다는 생각이 들었다. 

 

🛠 질문 만들기

  • 변수의 타입을 확인하는 연산자는 무엇인가? 
  • 함수가 아무것도 리턴하지 않을 때, 이 함수를 호출하면 어떤 값이 출력되는가?
  • '=='와 '==='의 차이는 무엇인가?
  • 함수 선언 방법에는 어떤 것들이 있는가? 또 각각 어떤 특징이 있는가? 
  • 매개변수와 전달인자의 차이점은 무엇인가? 

 

 

'Lesson > TIL' 카테고리의 다른 글

TIL: 2022-08-29  (0) 2022.08.29
TIL: 2022-08-26  (0) 2022.08.26
TIL: 2022-08-25  (0) 2022.08.25
TIL: 2022-08-24  (0) 2022.08.24
TIL: 2022-08-23  (0) 2022.08.23
Comments