공부/JavaScript4 JavaScript의 변수 자바스크립트에서 변수를 선언하는 방법과 각 변수의 특성에 대해 알아보자. 자바스크립트는 'var',' let', 'const' 키워두룰 사용하여 변수를 선언할 수 있습니다.1. var'var' 키워드는 ES6 이전에 변수를 선언하는 유일한 방법이었습니다. 함수 스코르를 가지며, 변수 호이스팅(hoistiong)이 발생한다.함수 스코프 : 'var'로 선언된 변수는 함수 내부에서만 유효합니다.변수 호이스팅 : 변수가 선언되기 전에 사용할 수 있는 특성입니다.하지만 선언만 호이스팅되며, 할당은 호이스팅되지 않습니다. example();2. let'let' 키워드는 ES6(ECMAScript 2015)에서 도입되었으면, 블록 스코프를 가집니다. 변수 호이스팅은 발생하지만, 초기화되지 않은 생태에.. 2024. 5. 27. JavaScript Ajax이해하기 AJAX(Asynchronous JavaScript and XML)는 웹페이지를 새로 고침하지 않고도 서버와 데이터를 주고 받을 수 있게 해주는 기술입니다. Ajax를 사용하면 웹 애들리케이션의 성능과 사용자 경험을 크게 향상시킬 수 있습니다. 1. Ajax란? Ajax는 다음의 약자입니다.Asynchronous: 비동기적으로 서버와 통신하여 페이지 새로고침 없이 데이터를 주고받습니다.JavaScript: JavaScript를 사용하여 Ajax요청을 만듭니다.XML: 초기에는 XML를 사용했으나, 현재는 JSON 형식을 더 많이 사용합니다Ajax의 기본 과정은 다음과 같습니다.클라이언트(웹 브라우저)가 이벤트(예:버튼클릭)를 트리거합니다.JavaScript가 서버로 요청을 보냅니다.서버가 요청을 처리하고.. 2024. 5. 22. JavaScript 언어의 가상 DOM(Virtual DOM) 이해하기 웹 개발의 복잡성이 증가하면서 효율적인 UI 업데이트가 중요해졌습니다. 이 글에서는 자바스크립트 언어에서 중요한 개념 중 하나인 가상 DOM(Virtual DOM)에 대해 설명하고, 이를 통해 어떻게 웹 애플리케이션의 성능을 향상시킬 수 있는지 알아보겠습니다. 1. DOM(Document Object Model)란? DOM은 HTML, XML 문서의 구조를 트리 구조로 표현한 것으로, 자바스크립트를 통해 문서의 내용, 구조, 스타일을 동적으로 조작할 수 있게 해줍니다. 하지만, DOM을 직접 조작하는 것은 성능 저하를 일으킬 수 있습니다. 특히, 많은 요소가 변경되는 경우, 브라우저는 이를 다시 렌더링해야 하므로 느려질 수 있습니다. 예제 코드: DOM 조작 Hello, World! Upd.. 2024. 5. 20. JavaScript - 이벤트(Event) 이벤트웹 페이지 내 마우스, 키 입력 시 상호작용으로 일어나는 이벤트 1. 마우스 이벤트이벤트설명 click마우스 클릭 시 발생dbclick마우스 더블클릭했 시 동작 mouseover마우스 특정 위치에 가져다 놨을 때 mouseout마우스 특정 위치에서 벗어났을 때 mousedown마우스 클릭 유지 할 시 mouseup마우스 유지 끝났을 때 mousemove마우스 움직였을 때 contextmenu마우스 우클릭 시 메뉴가 나오는 동작 2.키보드 이벤트이벤트설명keydown키 눌렀을 때 발생keyup키 떼을 때 발생keypress키 누름 유지시 발생 3.폼 이벤트이벤트설명focus포커스가 이동되었을 때 발생blur포커스가 벗어났을 때 발생change값이 변경 되었을 때 발생submitsubmit 버튼을 .. 2024. 4. 30. 이전 1 다음