Welcome! Everything is fine.

[TIL] 241206 - Javascript, JQuery / Java 공부 본문

TIL

[TIL] 241206 - Javascript, JQuery / Java 공부

개발곰발 2024. 12. 6.
728x90

✅ 웹개발 기초 강의 듣기

Javascript 기초 문법

1️⃣ 변수 & 기본 연산

  • let 으로 변수를 선언한다.
  • 사칙연산 및 문자열 더하기가 가능하다.
  • 문자열은 작은 따옴표로 감싼다.
let a = 2
let b = 3
console.log(a+b)

let c = '대한'
let d = '민국'
console.log(c+d)

 

2️⃣ 리스트 & 딕셔너리

  • 리스트 : 순서를 지켜서 가지고 있는 형태
  • 딕셔너리 : 키(key) - 값(Vlaue)의 묶음
let fruits = ['사과','수박','딸기','감']
console.log(a[0]);

let person = {'name':'bob', 'age':30, 'height':180}
console.log(person['name']);

 

3️⃣ 반복문 & 조건문

let ages = [15, 30, 23, 28, 19];

ages.forEach(a => {
    console.log(a);
});

ages.forEach(a => {
    if (age < 20) {
        console.log('청소년입니다.')
    } else {
        console.log('성인입니다.')
    }
});

Javascript 활용 문법(DOM)

  • 함수 만들어서 Alert 띄우기
    함수의 기본 틀은 다음과 같다. <script> 태그 안에 작성한다.
function hey(){
	alert('안녕!');
}

 

그리고 button에 다음과 같이 onclick에 만든 함수의 이름을 적었다. 이렇게 하면 버튼을 눌렀을 때 알링창이 뜨는 동작을 구현할 수 있다.

<button onclick="hey()" type="button" class="btn btn-outline-light">영화 기록하기</button>

JQuery

JQuery 는 Javascript 코드를 더 쉽고 편리하게 사용할 수 있도록 하는 라이브러리이다.

Javascript로만 쓰면 길고 복잡하지만,

document.getElementById('hello').innerHTML = '안녕';

 

다음과 같이 JQuery를 이용해 더 쉽게 쓸 수 있다.

$('#hello').html('안녕');

 

JQuery를 가져오는 코드이다. <head> 태그 사이에 넣는다.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

 

다음과 같이 id를 부여하고,

<h1 id = "title" class="display-5 fw-bold">킹덤</h1>

 

부여한 id를 사용해 텍스트를 바꾼다.

function hey() {
    $('#title').text('쥬라기월드');
}

✅ 자바 강의 듣기

열거형(Enum Type)

✔️ 열거형(Enum Type) : 서로 관련된 상수 값의 집합을 정의하기 위해 제공되는 특별한 타입. 타입 안전 열거형 패턴을 쉽게 사용할 수 있도록 프로그래밍 언어에서 지원하는 것이 열거형이다.

 

강의에서 실습한 내용을 예로 들면, 다음과 같이 회원 등급을 열거형으로 표현할 수 있다.

public enum Grade {
    BASIC, GOLD, DIAMOND
}

 

✔️ 열거형의 특징

  • 열거형도 클래스이다.
  • 열거형을 정의할 때는 class 대신 enum을 사용한다.
  • 열거형은 자동으로 java.lang.enum을 상속받는다.
  • 외부에서 임의로 생성할 수 없다.

✔️ 열거형의 장점

  • 사전에 정의된 상수들로만 구성되어 유효하지 않은 값이 입력될 가능성X -> 타입 안정성 향상
  • 코드가 간결하고 명확해진다.
  • Enum에 새로운 상수를 추가하기만 하면 되므로 확장성이 커진다.

✔️ 주요 메서드

  • values() : 모든 ENUM 상수를 포함하는 배열을 반환한다.
  • valueOf(String name) : 주어진 이름과 일치하는 ENUM 상수를 반환한다.
  • name() : ENUM 상수의 이름을 문자열로 반환한다.
  • ordinal() : ENUM 상수의 선언 순서(0부터 시작)를 반환한다.
  • toString() : ENUM 상수의 이름을 문자열로 반환한다. name() 메서드와 유사하지만, toString() 은 직접 오버라이드 할 수 있다.