frontend/JavaScript

JavaScript의 기본 문법

Mr.코딩 2023. 8. 2. 22:03

JavaScript의 작성법(=문법)에 대해 요약해 줘.

 

chatGTP3.5

자바스크립트의 기본 문법과 작성법을 상세히 설명하겠습니다.

 

변수 (Variables):

변수는 값을 저장하기 위해 사용되는 식별자입니다. 자바스크립트는 변수를 선언할 때 var, let, const 세 가지 키워드를 사용할 수 있습니다.

 

- var: 과거에는 주로 사용되었으나, 블록 스코프를 지원하지 않아서 권장되지 않습니다. (대신  let 사용이 더 권장된다.)

 var x = 10; 

 

- let: 블록 스코프를 지원하며, 변수의 값을 변경할 수 있습니다.

 let y = 20;

 

- const: 블록 스코프를 지원하며, 상수를 선언할 때 사용되며 값의 변경이 불가능합니다.

 const PI = 3.14; 


데이터 타입 (Data Types):

자바스크립트에는 다양한 데이터 타입이 있습니다.

 

- 숫자 (Number): 정수 및 부동소수점 숫자를 나타냅니다.

let num = 42;

let floatNum = 3.14;

 

- 문자열 (String): 문자들의 집합을 나타냅니다. 작은 따옴표(' ')나 큰 따옴표(" ")로 감싸서 생성합니다.

 

let name = 'John';

let message = "Hello, world!";

 

- 불리언 (Boolean): true 또는 false 값을 나타냅니다.

 

let isTrue = true;

let isFalse = false;

 

- 배열 (Array): 여러 값을 순차적으로 저장하는 자료구조입니다.

 

let fruits = ['apple', 'orange', 'banana'];

 

- 객체 (Object): 이름과 값으로 구성된 key-value 쌍을 저장하는 자료구조입니다.

 

let person = {
  name: 'John',
  age: 30,
  isMale: true
};


조건문 (Conditional Statements):

조건에 따라 다른 코드 블록을 실행하는데 사용됩니다.

 

if문: 주어진 조건이 true이면 특정 블록의 코드를 실행합니다.

let num = 10;
if (num > 5) {
  console.log("숫자는 5보다 큽니다.");
} else {
  console.log("숫자는 5보다 작거나 같습니다.");
}


else if문: 여러 개의 조건을 확인하고 다른 코드 블록을 실행합니다.

let num = 10;
if (num > 10) {
  console.log("숫자는 10보다 큽니다.");
} else if (num < 10) {
  console.log("숫자는 10보다 작습니다.");
} else {
  console.log("숫자는 10입니다.");
}


- switch문: 여러 가지 경우에 따라 코드를 실행합니다.

let day = 3;
switch (day) {
  case 1:
    console.log("월요일");
    break;
  case 2:
    console.log("화요일");
    break;
  case 3:
    console.log("수요일");
    break;
  default:
    console.log("기타 요일");
    break;
}


반복문 (Loops):

일련의 코드를 반복적으로 실행하는데 사용됩니다.

- for문: 특정 조건이 true인 동안 코드를 반복 실행합니다.

for (let i = 0; i < 5; i++) {
  console.log("반복 횟수:", i);
}

- while문: 특정 조건이 true인 동안 코드를 반복 실행합니다.


let i = 0;
while (i < 5) {
  console.log("반복 횟수:", i);
  i++;
}




함수 (Functions):

재사용 가능한 코드 블록을 만들 때 사용됩니다.


function add(a, b) {
  return a + b;
}

let result = add(5, 3); // result에 8이 저장됩니다.


객체 지향 프로그래밍 (Object-Oriented Programming):

자바스크립트는 객체 지향 프로그래밍을 지원합니다.

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  greet() {
    console.log(`안녕하세요, 저는 ${this.name}이고 ${this.age}살입니다.`);
  }
}

let person = new Person('John', 30);
person.greet(); // "안녕하세요, 저는 John이고 30살입니다."



이벤트 처리 (Event Handling):

 

웹 개발에서 자주 사용되는 기능 중 하나로, 사용자가 어떤 동작(클릭, 마우스 이동 등)을 했을 때 이에 대한 응답을 처리합니다.

```html
<button id="myButton">클릭해주세요</button>

<script>
  // 버튼 클릭 이벤트 처리
  document.getElementById

("myButton").addEventListener("click", function() {
    console.log("버튼이 클릭되었습니다.");
  });
</script>


위는 자바스크립트의 주요한 문법과 작성법에 대한 간략한 소개입니다. 물론 이는 자바스크립트의 전체 기능을 다루는 것이 아니며, 더 다양하고 복잡한 기능들이 있습니다. 그러나 이러한 기본 문법과 개념을 잘 숙지하고 익힌다면 좀 더 복잡한 기능을 이해하고 활용하는데 도움이 될 것입니다.


 

주석 (Comments):

 

주석은 코드에 설명을 추가하는 데 사용됩니다. 실행되지 않으며 코드에 영향을 주지 않습니다. 두 가지 유형의 주석이 있습니다.

- 한 줄 주석: // 뒤에 주석을 작성하면 해당 줄에 대한 주석이 됩니다.

// 이것은 한 줄 주석입니다.


- 여러 줄 주석: /* */ 사이에 주석을 작성하면 여러 줄에 걸친 주석이 됩니다.

/*
   이것은
   여러 줄
   주석입니다.
*/


Bard

JavaScript는 웹 브라우저에서 동작하는 프로그래밍 언어입니다. HTML과 CSS와 함께 웹 페이지를 생성하고 조작하는 데 사용됩니다. JavaScript는 동적 타이핑 언어로, 변수의 타입을 지정하지 않아도 사용할 수 있습니다. JavaScript의 기본 문법은 다음과 같습니다.

* 변수: 변수는 값을 저장하는 용도로 사용됩니다. 변수는 let, const, var 키워드를 사용하여 선언할 수 있습니다.

 

  • var 키워드는 가장 기본적인 변수 선언 키워드입니다. 변수를 선언할 때 변수의 유효 범위는 함수 내부로 제한됩니다.
  • let 키워드는 var 키워드와 유사하지만, 변수의 유효 범위는 블록 내부로 제한됩니다.
  • const 키워드는 변수를 상수로 선언합니다. 변수의 값을 변경할 수 없습니다.


* 함수: 함수는 특정 작업을 수행하는 코드 블록입니다. 함수는 function 키워드를 사용하여 선언할 수 있습니다.
* 조건문: 조건문은 특정 조건에 따라 코드를 실행할지 여부를 결정합니다. 조건문은 if, else if, else 키워드를 사용하여 사용할 수 있습니다.
* 반복문: 반복문은 특정 코드를 반복적으로 실행합니다. 반복문은 for, while, do while 키워드를 사용하여 사용할 수 있습니다.
* 객체: 객체는 키와 값의 쌍으로 구성된 데이터 구조입니다. 객체는 new 키워드를 사용하여 생성할 수 있습니다.
* 배열: 배열은 같은 종류의 데이터를 저장하는 자료 구조입니다. 배열은 new 키워드를 사용하여 생성할 수 있습니다.
* 문자열: 문자열은 문자열을 저장하는 자료 구조입니다. 문자열은 " ", ' '를 사용하여 생성할 수 있습니다.
* 숫자: 숫자는 숫자를 저장하는 자료 구조입니다. 숫자는 10진수, 2진수, 8진수, 16진수로 표현할 수 있습니다.
* 불리언: 불리언은 참과 거짓을 저장하는 자료 구조입니다. 불리언은 true, false로 표현할 수 있습니다.

JavaScript는 배우기 쉬운 언어이지만, 다양한 기능을 제공하기 때문에 익히는 데 시간이 걸릴 수 있습니다. JavaScript를 배우는 데 도움이 되는 리소스는 많으므로, 관심이 있다면 도전해 보세요.