본문 바로가기

JavaScript15

JavaScript_배열의 주요 메소드 splice - 배열에서 지정된 위치에 아이템을 삭제하거나 추가할 수 있다 splice 구성 splice(index, howmany, item, item ...) index : 삭제/추가 발생할 인덱스 howmany : 삭제할 갯수 (0을 입력하면 삭제되지 않는다) (index 위치부터 갯수만큼 삭제된다) item : index 위치에 추가할 값 (추가할 값이 없을때는 생략 가능) forEach - 배열의 처음부터 끝까지 배열의 모든 값을 반복처리 한다 (배열의 저장된 모든 값을 소비할 때 사용하는 메소드) forEach 구성 forEach(currentValue, index) {...} currentValue : 배열의 현재 값을 전달받는다 index : 배열의 현재 인덱스 값을 전달받는다 예시 // .. 2024. 4. 4.
JavaScript_Ajax, JSON Ajax(Asynchronous JavaScript and XML) 자바스크립트와 XML(JSON)을 활용한 서버와의 비동기 데이터 통신 XMLHttpRequest 객체를 활용해서 서버와 데이터 통신을 한다 Ajax의 특징 자바스크립트로 서버와 데이터 통신이 가능 페이지의 리로딩없이 화면을 일부분을 갱신하는게 가능해졌다 (서버로부터 데이터를 가져와서) Ajax의 대표적인 기능 구글 맵 포털사이트 검색기능 대부분의 하위분류를 조회하는 기능 XMLHttpRequest 웹 브라우저의 화면 뒤에서 웹서버와 HTTP통신으로 데이터 교환이 가능한 객체 - 전체 페이지의 리로딩없이 웹 페이지의 일부분을 서버로 받아온 데이터로 갱신하는 것이 가능 모든 브라우저에 내장되어 있다(Chrome, Safari, FireFox.. 2024. 1. 18.
JavaScript_이벤트 버블링 이벤트 버블링 : 자바스크립트에서 이벤트 버블링(Event Bubbling)은 문서 객체 모델(DOM)의 이벤트 전파 방식 중 하나 이벤트가 발생한 요소에서 시작하여 상위 요소로 이벤트가 전파되는 메커니즘을 의미 하위 요소에서 이벤트가 발생하면 이벤트가 해당 요소의 부모, 그 부모의 부모, 그 부모의 부모의 부모로 계속해서 전파 이벤트 버블링은 이벤트가 발생한 요소에서 상위 요소로 전파되기 때문에 부모 요소에서도 같은 종류의 이벤트 핸들러를 등록하면 자식 요소의 이벤트도 감지할 수 있다. 이벤트 버블링을 사용하는 이유 1. 더 효율적인 코드 구조 : 이벤트 버블링을 이용하면 이벤트 핸들러를 상위 요소에 등록하여 코드를 간결하게 하는 것이 가능. 특히 동적으로 생성되는 요소에 대한 이벤트 처리가 필요한 경.. 2024. 1. 17.
JavaScript_DOM, BOM DOM(Document Object Model) 문서 객체 모델 HTML, XML 등의 문서를 엑세스하는 표준을 정의하고 있다 DOM은 w3c에서 HTML, XML 문서를 다루는 표준(인터페이스) 정의 DOM에 정의된 표준에 대한 구현은 브라우저 제조사, 프로그래밍 언어 개발사, 라이브러리 개발자가 담당 DOM에서 정의한 표준은 브라우저 종류나, 프로그래밍 언어의 종류에 상관없이 동일한 API로 구현 DOM의 특징 모든 엘리먼트는 객체 모든 엘리먼트의 프로퍼티를 정의하고 있다 엘리먼트를 엑세스하는 메소드를 정의하고 있다 모든 엘리먼트의 이벤트를 정의하고 있다 DOM의 주요 객체 객체 설명 Document 웹 브라우저 HTML 문서를 로딩했을 때, Document 객체가 된다 Element HTML의 태그.. 2024. 1. 16.