goshek 님의 블로그

== 자바 컬렉션 프레임워크 == : 데이터를 저장하고 처리하는 자료구조의 표준화된 설계  컬렉션 프레임 워크의 주요 인터페이스 1. Collection >> 자바 컬렉션 프레임워크의 상위 인터페이스, 데이터의 집합을 다룸  2. List : 데이터의 순서를 유지, 중복 허용(ArayList, LinkedList등 )  3. Set : 데이터 순서를 유지X, 중복 허용X(Hashset, TreeSet등)  4. Map : 키-값 쌍으로 이루어진 데이터를 다룸, 키는 중복 허용X, 값은 중복 허용 (HashMap, TreeMap등)컬렉션 프레임워크 사용방법  1. 데이터의 특성에 맞는 클래스 선택 2. 데이터의 중복에 대한 필요성, 순서 유지에 대한 필요성 점검 3. 키-값 쌍 데이터의 필요성

/*    쿠키    : 웹 사이트가 사용자의 브라우저에 저장하는 작은 텍스트 파일    & 쿠키의 구조    -이름: 각 쿠키를 식별하는 고유한 이름     -값: 각 쿠키에 저장하는 정보의 문자열    -만료날짜: 쿠키의 수명    -경로 도메인 secure플래그, HttpOnly플래그        & 쿠키의 한계    - 용량 제한(4KB), 보안에 취약(개인 정보 보호 문제)    & 쿠키 생성 및    1. 쿠키 생성    : document. cookie 속성    : 웹 브라우저에 쿠키를 생성하고 관리 (쿠키 설정, 읽기, 수정 및 삭제)    >>document.cookie에 문자열을 할당하면 생성과 수정이 가능    (필수) 쿠키의 이름, 값    (선택, 추가 사항) 만료 날짜, 경로,..

/*    ! 자바 스크립트 예외    cf) 오류(Error, 에러)    : 부정확하거나 유효하지 않은 동작         ? 1. 오류의 종류    1) 구문 오류    : 프로그램 실행 전에 발생    >> 코드를 작성할 때 발생하는 오류    >> 문법이 언어의 정의된 규칙을 따르지 않을 때 발생    ex) 괄호를 닫지 않거나 잘못된 키워드 사용*/console.log('===구문 오류 예제===');//console.log('프로그램이 시작되었습니다./*    2) 런타임 오류    : 프로그램 실행중에 발생    >> 예측 가능한 비정상적인 조건 또는 예외적인 사건을 의미    >> 코드가 순차적으로 실행되다가 오류가 위치하는 부분 이후에 실행이 중단    ex) 파일을 찾을 수 없거나, ..

htmlDOCTYPE html>html lang="ko">head>  meta charset="UTF-8">  meta name="viewport" content="width=device-width, initial-scale=1.0">  title>dom03.htmltitle>  style>    #first, #second {      border: 1px solid black;    }  style>head>body>  div id="first">    h1>첫 번째 div태그 내부h1>  div>    div id="second">    h1>두 번째 div태그 내부h1>  div>  hr />  h3>제거 대상 문서 객체h3>    script src="./dom03.js">script>body>..

js/*    ! 문서 객체 가져오기    ? head, body, title    document.head    document.body    document.title    ? body 요소 내부에서 만든 다른 요소들    querySelector(), querySelectorAll(), getElementById()    ! DOM 수정하기    # 1) 글자 조작하기    문서객체.textContent    : 입력된 문자열을 그대로 넣기    문서객체.innerHTML    : 입력된 문자열을 HTML형식으로 넣기*/document.addEventListener('DOMContentLoaded', ()=>{    const a= document.getElementById('textContent'..

/*    ! DOM (문서 객체 모델, Document Object Model)    +) 문서 객체    : HTML 안에서 요소로 불리는 객체를 JS에서는 문서 객체라 불림    #1. DOM 정의    : 웹 페이지를 문서 객체로 조작하고 관리할 수 있는 인터페이스(상호작용, 규약)    # 2. DoM 활용 방법    : JS에서 DOM에 접근하는 경우 요소를 선택, 추가, 수정, 삭제하는 메소드와 속성에 접근이 가능    # 3. DOM 조작 방법    1) DOMContentLoded 이벤트    : JS 내에서 문서 객체를 조작할 때 사용    >> HTML의 모든 문서 구조(내용)가 모두 로드된 이후 이벤트 발생    문서 객체가 정립된 이후에 콜백 함수(화살표 함수)가 실행 */docu..

/*    ! 자바스크립트 비동기 프로그래밍 -async(비동기적인)/ await (기다리다)    : async 함수 내에서 await 키워드를 사용    >> 비동기 작업이 완료될 때까지 awiat 실행을 일시적으로 멈춤    ? async 함수 구조    : 함수 자체를 비동기 함수로 정의하는 키워드    : async function 함수명(){}    >> 항상 Promise 객체를 반환    - async 함수 내부에서 awiat키워드를 사용    >> Promise의 결과를 기다림    # async awiat 비동기 예시    : 사용자의 정보를 가져오는 함수*/async function fetchData(){    // 비동기 작업을 수행}async function fetchUserDat..

/*    ! 자바스크립트 비동기 프로그래밍- promise(프로미스)    # 1. promise 정의    : 비동기 작업의 완료 또는 실패를 나타내는 '객체'    >> 콜백 지옥을 피하고, 비동기 처리에 대한 가독성 향상    >> 현재는 알 수 없지만, 나중에 결과를 나타낼 수 있는 값    # 2. promise 상태(3가지)    1) 대기(pending)    : 초기 상태, 비동기 연산이 완료되지X    2) 이행(fullfilled)    : 비동기 연산이 성공(완료) >> 프로미스가 결과값을 반환한 상태    3) 거부(rejected)    : 비동기 연산이 실패 >> 프로미스가 에러를 반환한 상태    # 3. promise 생성 및 사용법 (기본 구조)    : new promi..

async.js/*    ! 비동기 프로그래밍    : 시간이 같지 않음    : 특정코드의 실행 완료를 기다리지 않고 다음 코드를 실행하는 프로그래밍 방식    >> 프로그래밍의 실행 흐름을 차단하지 않고, '시간이 오래 소요'되는 작업 처리에 사용    EX) '네트워크 요청(서버와의 통신)', 파일 I/O등에 주로 사용    ? 비동기 프로그래밍 예시    *=== 동기 프로그래밍 ===*/function work(){    const start= Date.now();    //현재 날짜, 시간을 숫자 형태로 반환    for(let i=0; i9999999999;i++){    }    const end=Date.now();    console.log(end -start + 'ms');}work(..

module01.js/*    ! 모듈    # 1. 모듈의 정의    : 재사용 가능한 코드 조각    >> 함수, 변수, 클래스, 파일등을 포함    # 2. 모듈의 특징    - 각각의 모듈은 독립성을 가짐    - 다른 코드 내부에서 재사용 가능    - 네임스페이스 관리    - 가독성 및 조직화 향상    # 3. ES6모듈    : ES2015 이후에 JS에서 공식적으로 모듈 시스템을 도입    >> import, export 문을 통해 모듈을 가져오고 내보내는 방식 도입        -스코프 격리    : 모듈 내에서 선언된 변수, 함수, 클래스 등은 모듈 외부에서 접근 X    >> 전역 변수의 사용 줄이고 이름 충돌을 방지    - 재사용성과 유지보수성 향상    # import문 사용..