변수와 함수

변수가 필요한 이유와 선언하는 방법

내가 그의 이름으르 불러 주기 전에는 그는 다만 하나의 몸짓에 지나지 않았다. <꽃 - 김춘수>

변수??

변수(variable)는 컴퓨터 프로그래밍에서 아직 알려지지 않거나 어느 정도까지만 알려져 있는 양이나 정보에 대한 상징적인 이름이다.
데이터를 담는 그릇

선언??

"난 이것을 사용하겠어!" 라고 선언하는 과정이다.

const a; // 변수 선언
const a = 'a'; // 데이터 할당

변수를 선언하는 이유

변수를 어떤 방법으로 사용할 것인지 컴퓨터에게 알려주는 과정이기 때문이다.
컴퓨터의 메모리 공간에 기록되어 있는 숫자들은 각각 의미를 갖고 있는데, 그게 어떤 의미 인지 알려주지 않으면 컴퓨터는 그 숫자를 읽어도 처리할 수 가 없다.
그 의미를 알려주는 것이 선언이다.
즉, 변수를 선언하지 않으면 다음번에 재활용을 못한다.

자바스크립트 데이터 타입의 종류

기본형 : 값이 담긴 주소값을 직접 접근
참조형 : 값이 담긴 주솟값들로 이루어진 묶음을 가리키는 주솟값을 접근

Data type	Description
Number	숫자의 자료형은 배정밀도 64비트 형식 IEEE 754 값 (-(2^53 -1) 와 2^53 -1 사이의 숫자값) 단 하나만 존재한다. 정수만을 표현하기 위한 특별한 자료형은 없다. 부동 소수점을 표현할 수 있는 것 말고도, Number 타입은 세 가지 의미있는 몇가지 상징적인 값들도 표현할 수 있다. 이 값에는 +Infinity, -Infinity, and NaN ("Not a Number")이 있다.
String	자바스크립트의 String 타입은 텍스트 데이터를 나타내는데 사용한다.
Boolean	Boolean 은 논리적인 요소를 나타내고, true 와 false 의 두 가지 값을 가질 수 있다.
null	null은 JavaScript의 원시 값 중 하나로, 어떤 값이 의도적으로 비어있음을 표현하며 불리언 연산에서는 거짓으로 취급
undefined	값을 할당하지 않은 변수는 undefined 값을 가진다. 값을 할당하지 않은 변수는 undefined 자료형이다. 또한 메서드와 선언도 평가할 변수가 값을 할당받지 않은 경우에 undefined를 반환한다. 함수는 값을 명시적으로 반환(return)하지 않으면 undefined를 반환한다.
Symbol	Symbol은 유일하고 변경 불가능한 (immutable) 기본값 (primitive value) 이다. 또한, 객체 속성의 key 값으로도 사용될 수 있다
Object	자바스크립트 오브젝트는 키와 값의 매핑이다. 키는 문자열이고 값은 다른 어떤 값도 될 수 있다.
Array	배열(Arrays) 는 정수키를 가지는 일련의 값들을 표현하기 위한 오브젝트이다. 배열 오브젝트에는 길이를 나타내는 'length'란 속성도 있다. 배열은 Array.prototype을 상속받으므로 배열을 다룰 때 편한 indexOf (en-US) (배열에서 값 검색)와 push (en-US) (새로운 값 추가) 같은 함수를 사용할 수 있다. 배열은 리스트나 집합을 표현하는데 적합하다.
Function	함수는 일반 오브젝트에서 호출 가능한 특성을 추가한 오브젝트이다.
Date	시간을 나타내려면 Date utility를 사용하자. 최고의 선택이다.
RegExp	RegExp 생성자는 패턴을 사용해 텍스트를 판별할 때 사용합니다 (정규표현식)
Map,Set, WeakMap, WeakSet	이 자료형들에서는 키가 문자열 뿐만 아니라 오브젝트도 될 수 있다. Set은 오브젝트의 집합을 나타내는 반면에 WeakMaps와 Maps는 오브젝트에 값을 연관시킬 수 있다. Map과 WeakMap의 차이는 전자는 오브젝트 키를 열거할 수 있다는 것이다. 이것은 가비지 콜렉션에서 이점을 준다.
JSON	JSON(JavaScript Object Notation)은 JavaScript에서 파생된 경량 데이터 교환 형식이지만 많은 프로그래밍 언어에서 사용됩니다.

추후 Symbol, RegExp, Map, Set 관련해서 따로 정리 후 이곳에 링크 할 예정이다.

number, string 의 메소드들

	method	description
number	toString(radix?: number): string;	returns Number => String
	toExponential(fractionDigits?: number): string;	Returns a string containing a number represented in exponential notation. 신기한건 return 이 string 으로 된다.
String	parseInt(string: string, radix?: number): number;	Converts a string to an integer.
	concat(...strings: string[]): string;	Returns a string that contains the concatenation of two or more strings.
	match(regexp: string \| RegExp): RegExpMatchArray \| null;	match()함수는 인자에 포함된 문자를 찾으면 이를 반환함 정규표현식을 활용하면 가능한 부분들이 더 많아진다.

함수가 필요한 이유

• 코드의 재사용
• 코드의 신뢰성
• 코드의 가독성

우리가 회사에 들어가면 매뉴얼북을 보고 일을 하듯, 프로그래밍에서 매뉴얼 북을 작성하는게 함수이다.
만약 회사에서 매뉴얼북이 없다면, 사수는 후임에게 매번 말로 전달해야한다. 하지만 후임이 계속해서 여러명 온다면?? 서류로 만들어 놓는게 훨씬 낫다.
프로그래밍 세계에서의 행동 매뉴얼북이 바로 함수이다.
요청이 들어오면 매뉴얼대로 행동해~ 하고 정의해놓는게 함수이다.

함수는 개발자의 실수를 줄이고, 재사용성을 높인다.

함수의 정의와 호출의 차이점

함수 정의(선언) 은 붕어빵 만드는 방법 매뉴얼북이고,
함수 호출은 붕어빵틀에 붕어빵을 만드는 것이다.

const 붕어빵만들기 = (재료) => {  // 함수 선언
  // 0. 붕어빵 틀이 열려있나 닫혀있나? 닫혀있으면 열고, 열려있으면 1번 시행
  // 1. 붕어빵틀에 기름을 x gram 바른다.
  // 2. 붕어빵틀에 밀가루를 x gram 넣는다.
  // 3. 밀가루위에 재료를 x gram 넣는다.
  // 4. 재료위에 밀가루를 x gram 사용하여 덮는다.
  // 5. 붕어빵 틀을 닫는다
  // 6. 10분간 기다린다.
  // 7. 만들어진 붕어빵을 뺀다(return).
  return `${재료}붕어빵`;
}
붕어빵만들기(팥); // 함수 호출 '팥 붕어빵'이 함수에 적힌 과정을 거친 후 return 된다.

[ 참고 ]

• MDN 자바스크립트의 자료형
• lib.es5.d.ts interface Number, String