[JavaScript] 기초문법1 (+ 변수, 자료형, 형변환, 알림창 함수)

변수

자바스크립트에서 한 줄의 코드가 끝나면 ; 로 표시해준다. 생략해도 되지만 적어주는게 가독성 면에서 좋다.

문자열은 ' ' 또는 " "로 감싸주어야 한다. 

예약어로 지정된 단어들은 변수명으로 사용할 수 없다.

 

이미 선언한 변수명을 또 사용해서 의도치 않게 덮어쓰여지는 것을 막기 위해서, 변수를 선언할 때는 let 또는 const를 사용한다.

let으로 선언했을 때는 변수값을 언제든지 바꿀 수 있지만, const로 선언한 변수값은 절대로 바꿀 수 없다. 따라서 '상수'라고 부른다. 상수인 것을 알아보기 쉽게 상수명은 대문자로 쓴다.

 

변수명은 반드시 '문자, '숫자', '$', '_'으로만 만들 수 있다. 첫글자는 숫자가 될 수 없으며, 읽기 쉽고 이해하기 쉽게 만든다.

 

 

자료형

' ', " ", ` ` 이렇게 3종류로 만들 수 있다. 문자열 내부에 따옴표가 필요할 때는 \'처럼 백슬러시를 써주면 데이터로 인식된다.

``(백틱)은 문자열 내부에 변수를 표현해줄 때 쓰면 편리하다. 백틱이 아닌 일반 따옴표를 사용하면 변수명이 데이터로 변환되지 않고 변수명 자체가 출력된다.

const name='Justin';
console.log(`My name is ${name}`);
console.log(`I'm ${20+7} years old.`);

문자열끼리도 + 를 통해서 한 문자열로 합쳐줄 수 있다. 그리고 문자열과 숫자로 합쳐서 출력할 수 있는데, 이 경우 숫자는 문자열로 변환된다. 

 

숫자형

숫자를 0으로 나누면 Infinity(무한대)가 나온다. 문자를 숫자로 나누면, 숫자가 아니라는 뜻의 NaN(Not a Number)가 나온다. 숫자와 문자를 서로 혼동하여 연산할 수 있기 때문에, 타입이 NaN인지 잘 확인할 필요가 있다.

 

논리형

True 와 False가 있고, 조건이 '참이나 거짓이냐'에 따라서 각각 출력된다.

 

Null & Undefined

변수를 선언만 하고, 초기값으로 아무것도 대응시키지 않으면 undefined가 출력된다.

변수에 null을 대응시키면, 변수값이 존재하지 않는다는 뜻이다.

let b;
console.log(b);
// undefined

b=null;
console.log(b);
// null

 

typeof 

console.log(typeof 3);
console.log(typeof null); //object
console.log(typeof undefined); //undefined

위 코드처럼 typeof를 붙이면, 데이터 타입을 출력시킬 수 있다. null은 object 형, undefined는 undefined 형이 나온다. 오브젝트 형은 객체형을 의미한다. (엄밀히 말하면, null은 객체가 아니지만 자바스크립트 초기 오류로 하위 호환성을 위해 수정하지는 않는다고 한다.)

다른 개발자가 지정한 변수가 어떤 타입인지 확인하거나, 외부에서 받아온 정보를 다른 곳에 사용할 때 타입에 맞게 사용하기 위해서 자주 사용된다.

 

알림창 함수

alert() 은 알림창을 띄우고 확인 버튼을 누르면 닫힌다. 일방적으로 정보를 알리는 역할이다.

 

prompt() 는 사용자에게 어떤 값을 입력받을 때 사용한다. 확인 버튼을 누르면 입력한 값이, 취소를 누르면 null이 변수에 대응된다.

prompt('띄울 메시지', '입력받을 디폴트값') 처럼 써서, 기본으로 띄울 입력값도 설정가능하다. 사용자가 정보를 입력하는데 도움을 줄 수 있다. 프롬프트로 입력받은 값은 무조건 문자열이다. 따라서 숫자로 쓰고 싶다면, 명시적으로 형변환을 해줘서 써야한다.

/ (나누기) 같은 경우에는 문자열을 숫자로 자동으로 변환해서 연산해주기도 하지만, 원인을 알기 힘든 오류를 발생시킬 수 있기 때문에 '명시적 형변환'이 중요하다.

 

confirm() 는 확인과 취소 버튼으로 2개가 뜬다. 확인을 누르면 True, 취소를 누르면 False가 출력된다. 이 리턴되는 값을 이용해서 다음 작업을 진행할 수 있다.

 

* node.js 환경에서는 안되고, 웹 브라우저 콘솔창 또는 html파일 안의 script 영역에서 작동 가능하다.

* 창이 떠 있는 동안에는 스크립트가 동작을 멈춘다. 또한 알림창의 위치와 모양을 바꿀 수 없다. 웹 브라우저가 제공하는 그대로 사용해야 한다.

 

형변환

String() - 문자열로 변환

Number() - 숫자로 변환, True와 False는 1,0으로 변환된다, 숫자와 문자가 섞인 문자열은 변환이 안되고 NaN 이 리턴된다.

* null은 0이 되고, undefined는 NaN이 된다.

Boolean() - 0, '', null, undefined, NaN 은 False로 리턴되고, 나머지 모든 값은 True로 리턴된다.

console.log(Boolean(0)) //False
console.log(Boolean('0')) //True
console.log(Boolean("")) //False
console.log(Boolean(" ")) //True, 공백도 값이 존재하는 것이다.

 

 

 

 

 

 

 

 

 

 

 

외부 참조 링크

https://www.youtube.com/watch?v=KF6t61yuPCY