FrontEngineer JungBam

혼공스(챕터2) 자료와 변수 본문

자바스크립트 개념

혼공스(챕터2) 자료와 변수

정밤톨 2022. 11. 7. 15:41

기본 자료형

1. 자료 : 프로그램이 처리할 수 있는 모든 것

    → 자료형 : 자료 형태에 따라 나눠 놓은 것

2. 자료형의 종류

   - 숫자 : 따옴표가 없이 숫자를 입력하면 숫자형으로 인식함.

+, -, / , *(기본 사칙연산), %(나머지)

   - 문자열 : '(작은 따옴표)나 "(큰 따옴표)를 사용하여 선언

이스케이프 문자(|) : 문자열 안에서 따옴표나 |를 나타내고자 할 때 사용
   ex) "|"" → 출력물 : "
문자열 연산자
   - 문자열 + 문자열 : 두개의 문자열을 합침
      * 만약 문자열 형태의 숫자를 숫자로 계산하고자 하면 문자열 앞에 +를 붙이던가 숫자형으로 변환하여 연산해야 함.
   - 문자열[index] : 문자열의 index 순서에 있는 문자를 가져옴
   - 문자열 길이 구하기 : 문자열.length

   - 불 : true, false(참 / 거짓)

비교 연산자 : ===. !==, > 등..
   - 비교 연산자를 수행한 값은 참이냐 거짓이냐가 나옴.
불 부정 연산자 : !(not)
   - 불 값을 반대값으로 바꿔줌.
논리합 / 논리곱
   - ||(or) : 논리합(앞에가 거짓이면 뒤에 값을 반환하고 앞에가 참이면 앞에 값을 반환함.)
   - &&(and) : 논리곱(앞에가 거짓이면 앞에 값을 반환하고 앞에가 참이면 뒤에값은 반환함.) 
   *** 괄호 안에 개념을 많이 사용하게 됨.***

3. 자료형 검사 : typeof(자료)

4. 템플릿 문자열(빽틱 : `) : 문자열 내에 표현식을 삽입할 때 사용

   - 사용방법 :

   const data = '내가 넣고싶은 데이터'

   console.log(`이 안에 넣고 싶은 문자열 표현식을 넣으면 됨.${data}`)

      → 출력물 : 이안에 넣고 싶은 문자열 표현식을 넣으면 됨. 내가 넣고싶은 데이터

5. === 연산자(!==) : 값과 자료형 모두 일치하는지 확인하는 연산자

   - 프론트에서 유효성검사를 해서 데이터를 넘겨줘야할 때에 많이 사용함.


상수와 변수

1. 상수 : 항상 같은 수(const)

상수와 관련된 에러
   - Identifier has already decleared : 같은 이름의 상수를 두번 선언한 경우
   - Missing initializer in const declaration : 상수는 한번만 선언할 수 있기 때문에 선언시 값을 함께 지정해주어야 함.
   - Assignment to constant variable : 상수로 선언한 자료의 값을 변경하고자 할 경우

2. 변수 : 변할 수 있는 수(let)

변수와 관련된 에러
   - Identifier has already been declared : 같은 이름의 변수를 두번 선언한 경우
복합 대입 연산자
   - +=, -=, %=, /=, %=
증감 연산자
   - 변수++, 변수--, ++변수, --변수
const를 let보다 많이 사용하는 이유 :
const는 내용을 다시 꺼낼 필요가 없으니 쌓을 수 있어서 저장효율이 좋고 반면에 let은 수시로 넣고 빼야 하다보니 저장효율이 나쁘다. 값을 수시로 변해야 하는 경우가 아니라면 const를 사용하는 것이 성능면에서 좋다. 
var를 사용하지 않는 이유 :
1. 중복선언이 가능함.
2. 전역에서 선언시 window 객체의 속성을 조작함.
3. 함수스코프를 가져 블록 스코프 내에서 선언을 하더라도 밖에서 참조가 가능함.

3. undefined 식별자

   - 상수와 변수로 선언하지 않은 식별자

   - 값이 없는 변수

const로 객체나 배열과 같은 참조형 객체를 했을 때 배열과 객체의 값을 변경할 수 있는 이유 :
배열이나 객체와 같은 참조형 데이터는 그 주소값을 가리키기 때문에

 


자료형 변환

1. 숫자 자료형으로 : Number(자료) 

   ※ 협업을 할때에 직관적이기 때문에 Number()를 사용하지만 소규모 프로젝트나 팀원간 소통이 되었다면 +변수로 대체 가능

2. 문자 자료형으로 : String(자료)

3. 불 자료형으로 : Boolean(자료)

1. 문자열 입력 : prompt(메시지 문자열, 기본 입력 문자열)
   - 사용자에게 입력받은 값을 선언할때 사용함.
2. 불 입력 : confirm(메시지 문자열)
   - 사용자 확인 받은 값을 선언할 때 사용함.

 

 

반응형
Comments