다양한 데이터 종류

목차

• 변수에 저장할 수 있는 자료형
• 문자형 데이터 (String)
• 숫자형 데이터(Number)
• 논리형 데이터(Boolean)
• null & undefined
• typeof
• 변수 이름 지을 때 주의사항

---

 

변수에 저장할 수 있는 자료형

 

자료형(data type)이란 '데이터의 형태'를 뜻합니다.
변수에 담을 수 있는 자료형의 종류로는 문자형(String), 숫자형(Number), 논리형(Boolean),
빈데이터(Null, undefined)가 있습니다.

---

 

문자형 데이터 (String)

 

문자형 데이터는 숫자를 ""큰 따옴표나 ''작은 따음표로 감싸고 있으면 문자형 데이터 입니다.
문자형 데이터에 HTML 태그를 포함하여 출력하면 태그로 인식합니다.
문자형 데이터에 숫자가 들어있으면 이것을 '문자형 숫자'라고 부르며 연산할 수 없습니다.

(기본형)
var 변수형 = "문자 또는 숫자";

 

문자형 데이터 (String) 사용해보기(영상)

 

문자형 데이터 (String) 입력 예시

 

  // 문자형 데이터 입니다.
      var str1 = "hello world";
      document.write(str1, "<br/>");

      var num = "1000";
      document.write(num, "<br/>");

      var str2 = "bababa ach";
      document.write(str2, "<br/>");

      var tag = "<h2>제목입니다.</h2>";
      document.write(tag, "<br/>");
      
      /*  문자형 숫자 콘솔창으로 출력하기
      문자형은 검은색으로 으로 나타납니다.*/
      var num2 = "100";
      console.log(num2);

      //   문자형을 숫자로 변경하기
      var num2 = Number("100");
      console.log(num2);
      
      <br/>은 HTML에서 사용했던 것과 같이 띄어쓰기 입니다.

---

 

숫자형 데이터(Number)

 

숫자형 데이터는 단어 의미 그대도 숫자를 뜻합니다. 만약 '100'과 같이 큰 따음표가 숫자를 감싸고 있다면
숫자가 아닌 문자형 데이터 입니다.
문자형 숫자를 숫자로 변환하고 싶다면 Number( '문자형 숫자' )를 이용하면 문자를 숫자로 바꿀 수 있습니다.
또 parseint( '문자형 숫자' )도 문자를 숫자로 바꿔줍니다.

(기본형)
var 변수명 = 숫자;
var 변수명 = Number( '문자형 숫자' )

 

숫자형 데이터(Number) 사용해보기(영상)

 

숫자형 데이터(Number) 입력 예시

      //   숫자형 데이터 입니다.
      /*  숫자형 콘솔창으로 출력하기
      숫자형은 파란색으로 나타납니다.*/
      var num1 = 100;
      console.log(num1);

---

 

논리형 데이터(Boolean)

논리형 데이터에는 true(참이냐) 또는 false(거짓이냐)가 있습니다.
이 데이터는 주로 두 개의 데이터를 비교할때 사용합니다. 
그래서 결과값은 무조건 true 아니면 false값이 나옵니다.
Boolean()메서드에 데이터를 입력하면 논리형 데이터인  true 또는 false를 반환합니다.
Boolean()메서드에서는 0, null, undefined,""(빈 문자)를 제외하고 모든 값을 다 true로 나옵니다.

(기본형)
var 변수명 = true or false;
var 변수명 = 숫자 > 숫자;
var 변수명 = Boolean(문자 또는 숫자);

 

논리형 데이터(Boolean) 사용해보기(영상)

 

논리형 데이터(Boolean) 입력 예시

 //   논리형 데이터 콘솔창으로 출력하기
      var bool = true;
      console.log(bool);
      bool = false;
      console.log(bool);

      //   10은 100보다 크다라고 작성해보았습니다.
      var bool2 = 10 > 100;
      console.log(bool2);

      /*빈 문자를 작성하게 되면 false가 나옵니다.*/
      var bool3 = Boolean("");
      console.log(bool3);

---

 

null & undefined

undefined는 변수에 값을 할당하기 이전에 들어있는 기본값입니다.
null은 변수에 저장 된 값이 null이라는 뜻이며, 기존의 값을 비우기 위해 사용합니다.

(기본형)
var 변수명; => undefined가 할당 된 상태.
var 변수명; => null => 기존 데이터 비우기

---

 

typeof

지정한 데이터 또는 변수에 저장한 데이터의 자료형을 알고 싶을때 사용합니다.

(기본형)
typeof 변수명 또는 자료명;

 

typeof 사용해보기(영상)

 

typeof 입력 예시

      //   typeof
      var num3 = 100;
      var num4 = "100";
      console.log(typeof num3);
      console.log(typeof num4);

---

 

변수 이름 지을 때 주의사항

1. 변수명의 첫 글자로는 $, _, 영문자만 올 수 있습니다.
2. 변수명의 첫 글자 다음으로는 영문자, 숫자, $, _ 만 올 수 있습니다.
3. 변수명으로는 예약어(document, string, number...)를 사용할 수 없습니다.
예약어란 이미 자바스크립트에서 사용중인 키워드를 말합니다.
4. 변수명을 지을때에는 되도록이면 의미를 부여해서 짓는것이 좋습니다.
5. 변수명을 사용할때에는 대소문자를 구분해야 합니다.

(예시)
var userPhonNumber => 잘못 된 방식
- 이어지는 단어의 첫글자는 소문자로 작성했는데 뒤에는 대문자면 안됩니다. 
userphonNumber => 올바른 방식
- 이어지는 단어를 소문자나 대문자로 작성했으면 끝까지 같은 자로 작성해야 하며 그 뒤에 나오는 다음 단어는 다른 자 대문자나 소문자로 구분합니다. userphonnumber 이런식으로 작성 시 같은 문장으로 인식합니다.

---

 

마무리

오늘은 변수에 대해서 배워보았는데요:)
저번에 작성했던 내용보단 정리가 잘 되어있어서 
이해하기 쉬울거라고 생각합니다!
화이팅!