개발 도구 (Development Tools)/JavaScript

#2. 기본 자바스크립트 문법

BiCute 2023. 5. 5. 08:00
반응형

 

# 변수(Variables)

 

JavaScript에서 변수는 값을 저장하는 공간을 의미합니다.

변수는 어떤 값을 할당하여 생성할 수 있습니다. 이 값은 나중에 변경할 수 있습니다.

JavaScript에서는 변수를 생성하기 위해 "var" 키워드를 사용할 수 있습니다.

다음은 값 "10"을 갖는 변수 "x"를 정의하는 예입니다.

var x = 10;

 

JavaScript에서는 변수의 이름은 알파벳, 숫자, 밑줄, 달러 기호로 구성될 수 있으며, 자바스크립트 스타일 가이드에서는 알파벳으로 시작하는 것을 권장하고 있습니다.

ES6에서는 "let"과 "const" 키워드를 사용하여 변수를 생성할 수 있습니다.

"let"은 변수 값을 변경할 수 있는 변수를 정의하고, "const"는 값이 한 번 할당되면 변경할 수 없는 변수를 정의합니다.

let y = 20;
y = 25; // 가능

const z = 30;
z = 35; // 오류

 

 

 

# 데이터 타입(Data Types)

 

JavaScript에는 다음과 같은 데이터 타입이 있습니다:

  1. Number: 정수와 부동 소수점 숫자 모두를 표현하는 데 사용됩니다. 예를 들어, 123과 3.14는 둘 다 자바스크립트에서 숫자로 간주됩니다.
  2. String: 문자열을 표현하는 데 사용됩니다. 문자열은 항상 따옴표(') 또는 쌍따옴표(")로 묶여 있습니다. 예를 들어, "Hello World"는 자바스크립트에서 문자열입니다.
  3. Boolean: 논리 값을 표현하는 데 사용됩니다. true 또는 false로 표현됩니다.
  4. Undefined: 값의 없음을 표현합니다. 선언만 되고 값이 할당되지 않은 변수의 타입은 undefined입니다.
  5. Null: 어떤 객체 값도 없음을 명시적으로 표현하는 타입입니다. undefined와 달리, null은 프로그래머에 의해 명시적으로 설정됩니다.
  6. Object: 키-값 쌍으로 표현되는 속성의 모음입니다. 객체는 배열과 맵과 같은 복잡한 데이터 구조를 표현하는 데 사용할 수 있습니다.
  7. Symbol: ECMAScript 6에서 새로 소개된 데이터 타입입니다. 객체의 고유하고 열거 불가능(non-enumerable)한 속성을 만드는 데 사용됩니다.

Number, String, Boolean은 기본 데이터 타입(Primitive Type)이며, 나머지 타입은 객체 타입(Reference Type)입니다

JavaScript에서 데이터 타입은 자동으로 판단됩니다(Dynamic Typing), 값에 의해 타입이 결정됩니다.

또한, 한 변수에는 언제든지 다른 타입의 값을 할당할 수 있습니다.

let value = 123;
console.log(typeof value); // "number"

value = "Hello, World!";
console.log(typeof value); // "string"

 

 

 

# 연산자(Operators)

 

JavaScript에는 다음과 같은 연산자가 있습니다:

  1. 산술 연산자(Arithmetic Operators): +, -, *, /, %, ++, -- 등
  2. 비교 연산자(Comparison Operators): ==, ===, !=, !==, >, >=, <, <= 등
  3. 논리 연산자(Logical Operators): &&, ||, ! 등
  4. 대입 연산자(Assignment Operators): =, +=, -=, *=, /=, %= 등
  5. 삼항 연산자(Ternary Operator): (condition) ? value1 : value2
  6. 스프레드 연산자(Spread Operator): ...
  7. 구조 분해 할당(Destructuring Assignment): let [a, b] = [1, 2] 등

산술 연산자는 수학적 연산을 수행하며, 비교 연산자는 값의 크기 비교를 수행합니다.

논리 연산자는 논리 연산(AND, OR, NOT)을 수행합니다.

대입 연산자는 값을 대입하며, 삼항 연산자는 조건에 따라 값을 결정할 때 사용됩니다.

스프레드 연산자는 배열을 펼칠 때 사용되며, 구조 분해 할당은 객체나 배열에서 값을 추출할 때 사용됩니다.

 

 

 

# 표현식(Expressions)

 

자바스크립트의 표현식은 어떤 값을 계산하는 코드 블록을 의미합니다. 표현식은 값을 반환하며, 그 값은 변수에 할당할 수 있거나 다른 표현식에서 사용할 수 있습니다.

자바스크립트에서 표현식은 다음과 같은 형태로 구성됩니다:

  1. 숫자 리터럴 표현식: 숫자를 나타내는 것, 예를 들어 42 또는 3.14
  2. 문자열 리터럴 표현식: 문자열을 나타내는 것, 예를 들어 "Hello, World!"
  3. 변수 표현식: 변수에 할당된 값, 예를 들어 x
  4. 연산자 표현식: 두 표현식을 연산하는 것, 예를 들어 x + y
  5. 관계식 표현식: 두 표현식을 비교하는 것, 예를 들어 x < y
  6. 논리 표현식: 여러 관계식 표현식을 결합하는 것, 예를 들어 x < y && x > 0
  7. 함수 표현식: 함수를 나타내는 것, 예를 들어 function(x) { return x * 2; }
  8. 객체 리터럴 표현식: 객체를 나타내는 것, 예를 들어 { name: "John Doe", age: 30 }
  9. 배열 리터럴 표현식: 배열을 나타내는 것, 예를 들어 [1, 2, 3]
  10. 조건 연산자 표현식: 조건에 따라 다른 값을 반환하는 것, 예를 들어 x > 0 ? "positive" : "negative"
  11. 객체 프로퍼티 접근 표현식: 객체의 프로퍼티에 접근하는 것, 예를 들어 obj.name
  12. 배열 요소 접근 표현식: 배열의 요소에 접근하는 것, 예를 들어 arr[0]

이 뿐만 아니라, 자바스크립트에서는 다양한 내장 함수와 객체 메서드, 제어 구조 등을 표현식으로 표현할 수 있습니다. 표현식은 자바스크립트의 기본 구성 요소이므로, 자바스크립트의 기초적인 이해는 표현식에 대한 이해부터 시작됩니다.

표현식을 자유자재로 사용할 수 있으면, 자바스크립트를 효율적으로 사용할 수 있습니다.

따라서, 표현식에 대한 이해는 자바스크립트의 기초 지식을 습득하는 과정에서 매우 중요한 것입니다.

 

 

 

# 구문(Statements)

 

자바스크립트의 구문(Statement)은 어떠한 작업을 수행하기 위해 필요한 코드 블록을 의미합니다.
자바스크립트에서는 다양한 종류의 문이 존재합니다.

 

예를 들어,

  • if문은 조건에 따라 코드 블록을 실행하는 데 사용됩니다.
  • for문은 반복문을 수행하는 데 사용됩니다.
  • while문은 주어진 조건이 참일 때 계속해서 코드 블록을 수행하는 데 사용됩니다.
  • switch문은 여러 가지 값 중 하나에 대한 처리를 제공합니다.

자바스크립트의 문은 순서대로 실행되며, 특정 문의 실행이 끝나면 다음 문으로 넘어갑니다.
따라서, 문은 자바스크립트의 제어 흐름을 결정하는 핵심적인 역할을 합니다.

 

 

 

# 예약어(Keywords)

 

자바스크립트의 키워드(Keyword)는 언어에서 이미 정의된 기능을 나타내는 것으로, 특정한 목적에 따라 프로그램의 흐름을 결정하는데 사용됩니다.

자바스크립트에서는 다음과 같은 키워드를 제공합니다.

 

  1. var: 변수 선언을 위한 키워드입니다.
  2. let: 변수 선언을 위한 키워드입니다. ECMAScript 6에서 추가된 것으로, var 보다 좀 더 강력한 동적 변수 선언 기능을 제공합니다.
  3. const: 변경할 수 없는 변수 선언을 위한 키워드입니다. ECMAScript 6에서 추가된 것으로, let과 마찬가지로 동적 변수 선언 기능을 제공합니다.
  4. function: 함수 정의를 위한 키워드입니다.
  5. if: 조건문을 위한 키워드입니다.
  6. else: if 조건문의 반대 조건을 위한 키워드입니다.
  7. switch: 여러 가지 조건 중 하나를 선택하는 제어 구조를 정의하는 키워드입니다.
  8. case: switch 구조에서 각각의 케이스를 정의하는 키워드입니다.
  9. default: switch 구조에서 모든 케이스에 해당하지 않을 경우 실행할 코드 블록을 정의하는 키워드입니다.
  10. for: 반복문을 정의하는 키워드입니다.
  11. while: 조건이 참인 동안 반복 실행하는 반복문을 정의하는 키워드입니다.
  12. do...while: 적어도 한 번은 실행한 뒤, 조건이 참인 동안 반복 실행하는 반복문을 정의하는 키워드입니다.
  13. break: 반복문을 강제로 종료하는 키워드입니다.
  14. continue: 현재 반복을 종료하고 다음 반복으로 넘어가는 키워드입니다.
  15. return: 함수의 실행을 종료하고 결과 값을 반환하는 키워드입니다.
  16. try: 예외 처리를 위한 키워드입니다.
  17. catch: try 구문에서 발생한 예외를 처리하는 키워드입니다.
  18. finally: 예외 발생 여부에 관계없이 무조건 실행할 코드 블록을 정의하는 키워드입니다.
  19. throw: 예외를 강제로 발생시키는 키워드입니다.
  20. debugger: 디버거를 중지시키고 디버깅 모드를 실행하는 키워드입니다.
  21. instanceof: 객체가 특정 타입의 인스턴스인지 확인하는 키워드입니다.

이외에도 자바스크립트에는 다양한 키워드가 존재하지만, 위의 키워드들이 가장 기본적으로 사용되는 키워드들입니다.

반응형