[2주차 TIL] Javascript

1. 자바스크립트의 기본 문법

JavaScript는 웹 개발의 중심 언어로, 가볍고 유연한 특성을 가지고 있습니다. 다음은 자바스크립트의 기본적인 문법 특징입니다.

• 대소문자 구분: let과 Let은 다른 것으로 인식됩니다.
• 명령어 종료: 명령어 끝에 세미콜론(;)을 붙이는 것이 권장되지만 필수는 아닙니다.
• 주석 사용법:
  • 한 줄 주석: //
  • 여러 줄 주석: /* */

---

2. 변수 선언과 데이터 타입

JavaScript에서는 데이터를 저장하기 위해 변수를 사용하며, var, let, const를 통해 선언합니다.

• var: 과거에 많이 사용되었지만 현재는 권장되지 않습니다. 함수 스코프를 가지며, 의도치 않은 재선언 문제가 발생할 수 있습니다.
• let: 블록 스코프를 가지며, 값의 재할당이 가능합니다. 현대 JavaScript에서 가장 일반적으로 사용됩니다.
• const: 블록 스코프를 가지며, 선언과 동시에 값을 할당해야 하며 재할당이 불가능합니다.

데이터 타입

• 기본형 (Primitive):
  • 숫자(Number), 문자열(String), 불리언(Boolean), null, undefined, Symbol, BigInt
• 참조형 (Reference):
  • 객체(Object), 배열(Array), 함수(Function) 등

 

---

3. 함수 정의와 호출

함수 정의 방법

• 함수 선언식: 가장 일반적인 방식으로, 호출 전에 선언이 가능합니다.
• function greet(name) { return `Hello, ${name}!`; } console.log(greet("Jiyang"));
• 함수 표현식: 변수에 함수를 할당하는 방식으로, 할당 이후에만 호출 가능합니다.
• const add = function(a, b) { return a + b; }; console.log(add(3, 5));
• 화살표 함수 (Arrow Function): 간결한 문법을 제공하며, this 키워드의 동작이 다릅니다.
• const multiply = (a, b) => a * b; console.log(multiply(4, 5));

---

4. 객체와 배열의 사용 방법

객체 (Object)

객체는 키-값 쌍으로 이루어진 데이터 구조입니다.

const person = {
  name: "Jiyang",
  age: 25,
  greet() {
    return `Hi, I'm ${this.name}`;
  }
};
console.log(person.greet());

• 키와 값: 객체의 속성은 키와 값으로 구성됩니다.
• 메서드: 객체 내 함수는 메서드로 불립니다.

배열 (Array)

배열은 순서가 있는 데이터 리스트입니다.

const fruits = ["apple", "banana", "cherry"];
console.log(fruits[1]); // 'banana'
fruits.push("date");
console.log(fruits);

• 인덱스: 배열의 각 항목은 0부터 시작하는 인덱스를 가집니다.
• 메서드: push, pop, map, filter 등을 사용해 배열을 쉽게 조작할 수 있습니다.

 

---

5. 자주 사용하는 내장 함수들

문자열 관련 함수

• toUpperCase(): 문자열을 대문자로 변환
• includes(): 특정 문자열이 포함되어 있는지 확인
• const str = "Hello World!"; console.log(str.toUpperCase()); // HELLO WORLD! console.log(str.includes("World")); // true

배열 관련 함수

• map(): 배열의 각 요소에 함수를 적용하여 새로운 배열 생성
• filter(): 조건을 만족하는 요소만 추출
• const numbers = [1, 2, 3, 4]; console.log(numbers.map(n => n * 2)); // [2, 4, 6, 8] console.log(numbers.filter(n => n > 2)); // [3, 4]

수학 관련 함수

• Math.max(): 전달된 숫자 중 가장 큰 값 반환
• Math.random(): 0 이상 1 미만의 난수 생성
• console.log(Math.max(10, 20, 30)); // 30 console.log(Math.random()); // 예: 0.54321

객체 관련 함수

• Object.keys(): 객체의 키를 배열로 반환
• Object.values(): 객체의 값을 배열로 반환
• const obj = { a: 1, b: 2, c: 3 }; console.log(Object.keys(obj)); // ['a', 'b', 'c'] console.log(Object.values(obj)); // [1, 2, 3]