<kimNerd />

개인 프로젝트로 포트폴리오 웹사이트가 만들고 싶어서 데스크탑에 리액트를 설치했다.

기존에는 패키지 매니저 npm과 패키지 러너인 npx만을 사용했는데,

이번 기회에 yarn으로 react를 설치하고 사용하고자..

yarn이 도대체 무엇인지 알아보았다!

...

yarn은 쉽게 말해서, 페이스북에서 만든

npm과 같은 node.js 자바스크립트 패키지 매니저이다.

장점은 기존의 npm이 가졌던 단점을 보완하는 차원에서 만들어진 도구기때문에,

npm이 가졌던 버전 차이로 인한 패키지 중복 설치 등의 문제를 잘 보완해준다는 것..!

...

yarn은 npm을 통해서 설치 가능한데, 설치 방법은 다음과 같다!

카드 뉴스 쉽게 보는 법: 첫 이미지 클릭하고 방향키로 스크롤해서 넘기기

자바스크립트도 갓 입문한 입장이지만 동시에 배우기 시작한 타입스크립트 입문편!

지금 시작합니다!

타입스크립트란 예전부터 지금까지 받아들여지는 정의가 다양하게 변화해왔지만,

가장 입문자가 이해하기 쉽게 정의한 것은 다음과 같다.

'타입스크립트는 자바스크립트에 타입을 추가한 것이다.'

타입스크립트 = 자바스크립트 + 타입

타입스크립트는 자바스크립트의 상위 개념(슈퍼셋; Super Set)이다.

자바스크립트가 인터프리터형 언어라면 타입스크립트는 컴파일형 언어로

컴파일 이후 자동으로 자바스크립트 코드로 변환된다. 

그렇다면 굳이 자바스크립트 대신 타입스크립트를 사용해야 하는 이유가 있는가?

이는 기존의 자바스크립트가 가진 특징인 높은 자유도와 유연성을 보완하기 위함이라 할 수 있다.

자바스크립트는 동적 타입 언어로 비교적 타입의 변환이 유연하게 이뤄진다.

예를 들어 정수형 1과 문자형 '3'은 원래 연산이 이뤄지면 안 되지만

자바스크립트에서는 형변환이 임의로 유연하게 이뤄지며 연산을 가능하게 한다. 

이는 사용자 입장에서 간편하게 느껴질 수 있지만,

큰 규모의 프로젝트를 진행할 때는 보다 엄격한 형식이 필요할 것이다.

반면 타입스크립트는 정적 타입 언어로 이러한 높은 자유도와 유연성을 가진

자바스크립트가 갖추지 못한 안정성을 제공한다.

따라서 자바스크립트가 보다 높은 자유도와 유연성을 가지고 있다면,

타입스크립트는 높은 안정성과 일관성을 추구한다.

이는 복잡하고 큰 프로젝트를 진행함에 있어 안정성을 제공한다는 측면에서

자바스크립트보다 더욱 적합하다고 할 수 있다. 

이 외에도 자바스크립트보다 에러에 대하여 더욱 자세하게 설명해주는 것과 같은 디버깅에 용이한

특징을 많이 가지고 있는 것이 타입스크립트이다.  

나 나름 해석을 해보자면, 자바스크립트는 자유로운 글쓰기에 가깝다.

편하게 매일 매일 작성하는 일기는 형식을 갖추지 않는데,

자유로운 형식이 글쓰기를 편하고 효율적으로 만들 것이다. 

한편, 타입스크립트를 사용하는 것은 각 잡고 책 만들기라 생각하면 편할 것 같다.

목차를 구성하고, 각 챕터 별 어떤 내용이 들어갈지 구상을 하면서, 작성과 퇴고를 거친다.

그럼 간단한 타입스크립트 사용법을 알아보자.

어려울 것 없다.

변수 선언할 때, 콜론과 함께 타입을 선언하면 된다.

클래스 선언 시에도 마찬가지이다. 생성자 괄호 안에 각 변수의 타입을 선언하면 된다.

더 간단하게 표기하는 방법이 존재하는데 이는 다음에 알아보도록 하겠다. 

재귀함수 (Recursive Function)

통곡의 벽

어느 한 컴퓨터공학과 학생이 유명한 교수님을 찾아가 물었다.
"재귀함수가 뭔가요?"
"잘 들어보게. 옛날옛날 한 산 꼭대기에 이세상 모든 지식을 통달한 선인이 있었어.
마을 사람들은 모두 그 선인에게 수많은 질문을 했고, 모두 지혜롭게 대답해 주었지.
그의 답은 대부분 옳았다고 하네. 그런데 어느 날, 그 선인에게 한 선비가 찾아와서 물었어."
____"재귀함수가 뭔가요?"
____"잘 들어보게. 옛날옛날 한 산 꼭대기에 이세상 모든 지식을 통달한 선인이 있었어.
____마을 사람들은 모두 그 선인에게 수많은 질문을 했고, 모두 지혜롭게 대답해 주었지.
____그의 답은 대부분 옳았다고 하네. 그런데 어느 날, 그 선인에게 한 선비가 찾아와서 물었어."
________"재귀함수가 뭔가요?"
________"재귀함수는 자기 자신을 호출하는 함수라네"
________라고 답변하였지.
____라고 답변하였지.
라고 답변하였지.

재귀(Recursion):

• 함수 스스로 자신을 참조해 호출하면서 동일한 코드가 계속적으로 수행되는 함수 호출 방법
• 재귀 함수는 특정 조건이 됐을 때, 자신을 그만 호출되도록 제한하는 exit code가 필요
• 재귀함수: 함수 내부에서 한 번 이상 자신의 함수를 호출
• 재귀알고리즘: 알고리즘 내부에서 한 번 이상 자신의 알고리즘을 호출

재귀함수를 쓰는 이유:

• 변수를 여럿 만들 필요가 없다.
• 코드가 간결해지고 직관적이기 때문에 가독성이 높아진다.
• DFS(깊이 우선 탐색)을 함에 있어 자주 활용된다. 

예시 1)

// 3 + 2 + 1 + 0
function recursive(num) {
	if (num == 0) return;
	recursive(num - 1);
}

// 3 + (2 + (1 + 0)) -> 6
console.log(recursive(3));

예시 2)

function factorial(num) {
	if (num == 0) return 0;
    return num * factorial(num - 1);
}

// 3 * 2 * 1 * 0 -> 6
console.log(factorial(3));