JavaScript - 기본용어/자료형/변수/조건문/반복문 [0513]

왕감자·2024년 5월 13일

KB IT's Your Life

목록 보기
10/177
  • 스크립트 언어: JavaScript, Python
  • 컴파일 언어: Java, C, C++

1. 자바스크립트 (JavaScript)

💡 JavaScript : 웹 페이지 안에서 동작하기 위해 만들어짐 (Java와 연관X)
↳ 순서는 상관 없지만 <head> 밑, <body> 안에 위치하는 것이 관례안에 위치하는 것이 관례

1) 기본 용어

  • 표현식 (Expression) : 값을 만들어 내는 간단한 코드
  • 문장 : 프로그래밍 언어에 실행할 수 있는 코드의 최소 단위
    • 문장 마지막에 세미콜론(;)으로 종결
  • 키워드 : 자바스크립트를 처음 만들 때 정해진 특별한 의미가 부여된 단어
  • 식별자 : 변수나 함수 등에 이름을 붙일 때 사용
    1. 키워드 사용 X
    2. 사용 가능 특수 문자 ⇨ _ $ (특수기호로 시작 O)
    3. 숫자로 시작 X
    4. 공백 X
    5. 대소문자 구분
    6. Camel case & Pascal 표기법
    7. 한글 가능 (비권장)

2) 출력

  • 웹 브라우저에 경고 창 띄우기 : alert("경고메세지");
  • console에 출력: console.log("출력메세지");




2. 자료형

1) 숫자

  • 정수, 실수 구분 X
  • 부동소수점을 계산할 때 약간의 오차를 발생시킴
  • 어떤 숫자를 0으로 나누었을 때, 무한을 나타내는 값 (Infinity)이 됨

2) 문자열

  • 문자의 집합
  • 큰따옴표(""), 작은따옴표('') 사용 ⇨ 작은따옴표 권장
  • 문자열 연결자 : +
// 문자열 + 숫자 → 숫자로 자동 형변환
'1' + 3 // 4
  • 이스케이프 문자
    • \t : 탭
    • \n : 줄 바꿈
    • \\ : 역슬래시
    • \' : 작은따옴표
    • \" : 큰따옴표

3) 불 (bool)

  • 참 / 거짓 (true / false)

  • 비교 연산자 : 두 대상을 비교할 수 있는 연산자

    • >=
    • <=
    • >
    • <
    • ==
    • !=
    • === : 데이터 타입부터 확인, 데이터 타입이 다르면 false (==보다 권장)
		'13' == 13 //true
		'13' === 13 // false
  • 논리 연산자
    • ! (NOT)
    • && (AND)
    • || (OR)




3. 변수

  • 값을 저장할 때 사용하는 식별자
    1. 변수 선언 let pi; ⇨ 값 할당 pi = 3.14159265;
    2. 변수 초기화 let pi = 3.14159265;

1) 변수의 종류

① Primivie Type

  • 언어 설계 당시 정한 타입 → 크기 고정 (4byte)
  • number, boolean, null, undefined, infinite, NaN
  • 변수의 값을 그대로 저장
  • = 연산자 사용 시 값이 복사 됨

② Reference Type (참조 타입)

  • 값 저장X, 값이 있는 메모리 주소(참조값) 저장

  • 프리미티브 타입이 아닌 모든 데이터 (string, array, object, function...)

    • let arr1 = [1, 2, 3];
       let arr2 = arr1;
      
       arr1[0] = 10;
       console.log(arr1[0], arr2[0]); // 10 10
      
       arr2[2] = 20;
       console.log(arr1[1], arr2[1]); // 20 20
      		```
  • 실제 데이터에 대한 참조사 없어지면 쓰레기(garbage)값이 됨

	let arr1 = [1, 2, 3];
	let arr2 = arr1;

	arr1[0] = 10;
	console.log(arr1[0], arr2[0]); // 10 10

	arr2[2] = 20;
	console.log(arr1[1], arr2[1]); // 20 20

2) 변수 scope

  • 전역 변수 (Global)

    • 함수 밖에서 전역 레벨에서 선언된 변수
    • 모든 함수에서 사용 가능
  • 지역 변수 (Local)

    • 함수(블록) 내에서 선언된 변수
    • 함수의 매개변수도 지역변수
    • 함수가 호출되고 선언문이 실행 되었을 때 메모리에 생성
    • 함수(블록)가 끝날 때 메모리에서 제거
    • 함수(블록) 밖에서는 사용 X (변수 존재X)

전역변수와 지역변수 이름이 같을 경우 - 지역변수로 간주


3) 변수 선언 키워드

  • var
    - 비권장
    - 중복 선언 가능 , 재할당 가능
    - 전역 변수

  • let

    • 범위 내에서 다시 선언 X
    • 업데이트(재할당) 가능
    • 지역 변수, 해당 블록 내에서만 사용 가능

  • const
    • 재선언/업데이트 X
    • 지역 변수, 해당 블록 내에서만 사용 가능
    • 상수
    • 선언 중 초기화 해야 함
  • 재할당이 필요 없는 상수와 객체에는 const 사용
    : 재할당 방지 - 안전
  • 재할당 필요한 경우 let
    : 변수의 스코프는 최대한 좁게 만드는 것이 좋음




4. 조건문

1) if

if (조건) {
  true일 때
}
⇨ 시행 문장이 한 행일 경우 중괄호`{}` 생략 가능

2) if - else

if (조건) {
  true 일 때
} else {
  false 일 때
}
  • 요즘 많이 쓰는 표현
    • if (조건) return true일때;
      return false일때;

3) if - else if

if (조건1) {
  조건1 true 일 때
} else if (조건2) {
  조건1 false, 조건2 true 일 때
} else {
  false 일 때
}




5. 반복문

1) while

  • 조건을 거짓으로 만드는 문장 없으면 무한 반복
  • 외부 요인으로 저건이 변경될 때
while (조건) {
  true 일 때 실행문
}

2) for

  • 원하는 횟수만큼 반복하고 싶을 때
for (초기식; 조건식; 종결식) {
  true 일 때 실행문
}

0개의 댓글