TIL 2

모모·2021년 10월 6일
0

TIL

목록 보기
2/28

오늘의 학습


변수(variables)

왜 배울까

프로그래밍은 데이터 처리를 하는 것이다.
그리고 변수는 데이터를 편리하게 꺼내 쓸수있는 도구이다.
따라서 우리는 변수를 사용하여 데이터를 효율적으로 처리할 수 있다

어디에 쓸까

동일한 데이터가 반복적으로 사용된다고 가정하자.
만약 이 데이터가 수정된다면 매번 이 데이터가 쓰인 곳을 일일이 고쳐야 할 것이다.
데이터를 변수에 저장하고, 데이터 대신 변수를 사용함으로써 이러한 불상사를 막을 수 있다.

어떻게 쓸까

변수를 사용하는 방법은 선언(declaration)하고, 할당(assignment)하는 것이다.
선언은 '이 이름을 변수로 사용하겠다'는 의미이다.

let dog;

할당은 '이 값을 해당 변수에 저장하겠다'는 의미이다.

dog = 'Dasom';

선언과 할당을 동시에 할수도 있다.

let dog = 'Dasom';

추가 학습

변수가 선언만 되고 할당되지 않은 경우, undefined를 반환한다.


타입(data types)

왜 배울까

true와 'true', 그리고 123과 '123'은 값은 같지만 다른 타입의 데이터이다.
타입의 종류와 특징은 연산자, 조건문 등의 학습과, 실무에서 엄격한 코드를 작성하는데 꼭 필요하다.

어디에 쓸까

타입은 그 자체로 사용하기보다 활용 수단이다.
숫자의 문자형화, 문자의 숫자형화에 쓰이는 것 외에도 boolean타입의 결과값을 갖는 조건식의 활용 등에 쓰인다.

어떻게 쓸까

자바스크립트에는 8가지 기본 자료형이 있으며 나타내는 값은 다음과 같다.

  • number: 정수, 소수점 등의 숫자. 단, 정수의 한계는 ±2^53
  • bigint: 길이 제약없이 정수를 나타낼 수 있음
  • string: 빈 문자열이나 문자열
  • Boolean: true, false
  • null: 알 수 없는 값, 존재하지 않는 값, 비어있는 값
    주의할 점은 typeof 연산자 사용시 object로 출력하지만 null은 객체가 아님
  • undefined: 값이 할당되지 않은 상태
  • object: 하나의 데이터만 담을 수 있는 원시형과 달리, 다양한 데이터를 담을 수 있음
  • symbol: 객체의 고유한 식별자(unique identifier)를 만들 때 사용

추가 학습

typeof
typeof 연산자를 통해 피연산자의 자료형을 반환한다.
typeof x 혹은 typeof(x) 형태로 사용한다.

원시 자료형과 참조 자료형
자바스크립트에는 2가지 형태의 자료형이 존재한다.

원시 타입(primitive type)은 객체가 아니면서 메소드를 가지지 않는 6개의 타입(string, number, boolean, undefined, null, symbol)이다.
원시 타입은 메모리-콜스택(Call Stack)에 값을 그대로 저장한다.

참조 타입(reference type)은 객체([ ]), 배열({ }), 함수(function(){}) 등과 같은 object 형식의 타입이다.
참조 타입은 메모리-힙(Heap)에 값을 주소로 저장하며, 출력시 메모리힙의 주소값을 출력한다.

let game = {a:'Tetris', b:'Mario', c:'Zelda}
let funTool = game;
funTool.a = 'SquidGame';
console.log(game.a); // 'SquidGame'

함수(function)

왜 배울까

함수는 코드의 묶음으로서 필요할 때마다 사용할 수 있는 작은 기능의 단위이다.
함수의 재사용은 곧 효율적인 프로그래밍을 의미한다.

어디에 쓸까

앞서 변수에 자주 사용하는 데이터를 담았다면, 함수에는 자주 사용하는 기능을 담는 것으로 이해할 수 있다.

어떻게 쓸까

함수는 선언과 호출을 통해 사용할 수 있다.
함수 선언은 어떠한 기능을 하는 버튼을 만드는 것이고, 호출은 특별한 공간에 보관된 버튼을 누르는 것이다.

함수 선언 방식은 다음과 같으며 함수 선언문이라고 부른다.

function numTotal(num1, num2) { // 함수를 선언할 때 변수로 적는 값은 매개변수(parameter)
  let addNumber = num1 + num2;
  return addNumber;
}

함수의 호출 방식은 다음과 같다.

numTotal(3,4);  // 함수를 호출할 때 전달하는 값은 전달인자(argument)

위 함수코드 body에 등장하는 parameter가 함수 호출시 전달된 인자값으로 바뀌어 순차적으로 실행된다.
함수는 return하면 호출된 장소로 돌아가게 되고, 이때 함수 호출코드는 return값으로 바뀐다.

함수는 함수 표현식과 화살표 함수로도 선언할 수 있다.

함수 표현식

let numTotal = function(num1, num2) { // 변수를 선언하고 이에 익명함수를 할당하는 방식
  let addNumber = num1 + num2;
  return addNumber;

화살표 함수

let numTotal = (num1, num2) => { // 변수를 선언하고 parameter를 할당한 뒤 화살표 사용 
  let addNumber = num1 + num2;   // 이어서 함수의 body를 작성한다
  return addNumber;
let numTotal = (num1, num2) => num1 + num2;
// 본문에 return문만 있는 경우 return을 생략할 수 있다.
// 이때 주의할 점은 중괄호({ })까지 함께 생략해야 정상적으로 작동한다.

조건문

왜 배울까

복잡한 문제를 해결하기 위해서는 작은 단위로 나누어 생각해야 한다.
조건문으로 상황을 세분화하여 문제를 체계적으로 해결할 수 있다.

어디에 쓸까

if문은 괄호 안에 들어가는 조건을 평가한다.
상황에 따라 다양한 결과값이 도출되는 경우에 사용한다.

어떻게 쓸까

조건문의 기본 형태는 다음과 같다.

if(조건1) {
	// 조건1에 부합할 경우
} else if (조건2) {
	// 조건1에 부합하지 않고
	// 조건2에 부합할 경우
} else {
	// 위의 모든 조건에 부합하지 않는 경우
}

추가 학습

논리 연산자 AND

true && true // true
true && false // false
false && false // false
// 모두 true여야 true를 반환한다

논리 연산자 OR

true || true // true
true || false // true
false || false // false
// 둘 중 하나라도 true면 true를 반환한다

논리 연산자 NOT

! false // true
!(3 > 2) // false
!undefined // undefined는 false로 취급(falsy)되는 값이기 때문에 not이 붙으면 true
! 'Hello' // 문자열은 모두 true 취급(truthy). not이 붙으면 false

기억해야 할 6가지 falsy 값
다음은 if문에서 false로 변환되므로, if 구문이 실행되지 않는다

if(false)
if(null)
if(undefined)
if(0)
if(Nan)
if('') // 아무 값이 없는 문자열

오늘의 생각

페어 프로그래밍으로 코플릿 푸는 시간을 가졌다.이때 문제 해결을 어렵게 만드는 요소는 두 가지였다. 첫째, 문제가 길거나 복잡한 경우 한 눈에 들어오지 않았고 무엇을 어떻게 해결해야 할지 파악하는 것이 느려졌다. 둘째, 페어에게 민폐가 되지않으려 빨리 문제를 해결해야한다는 생각 자체가 압박으로 다가왔다.

그나마 오늘은 주제는 어렵지 않았기 때문에 시간이 오래 걸리지 않았다. 하지만, 당장 내일 풀이할 조건문부터는 고려해야 할 요소가 훨씬 많아진다. 이를 극복하기 위해 더욱 수도 코딩을 착실히 진행해야 할 필요를 느낀다. 압박감에 대해서는 커뮤니케이션이 해결 방법이 될 것이다. 충분히 문제를 이해할 수 있도록 페어에게 양해를 구하고, 막히는 부분이 있다면 가감없이 공유하자.

0개의 댓글