JavaScript

1. DOM (1) DOM의 기본 개념 1. javascript가 왜 생겼는데? 브라우저에서 쓰려고 만들어진 JS에요! 본연의 역할 : 웹 페이지를 동적으로 만들기 위해! 즉, HTML문서를 조작해서 생명력을 불어넣어주기 위해 만들어진 언어에요. 2. 웹 페이지가 뜨는 과정 클라이언트가 브라우저에 ‘www.naver.com’ 주소를 입력 클라이언트가 서버에게 ‘요청(request)’ naver서버는 클라이언트에게 ‘응답(response)’으로 HTML 문서(document) 전달 브라우저가 렌더링 엔진으로 HTML 파일을 해석(parsing 파싱) 랜더링 엔진이 HTML문서에 코드 한줄, 한줄 보면서 ‘해석'해요. javascript가 알아들을 수 있는 방식으로 해석한 내용을 토대로 다음 이미지 처럼 D..

1. 콜백함수 예시 // setTimeout setTimeout(function() { console.log("Hello, world!"); }, 1000); // forEach const numbers = [1, 2, 3, 4, 5]; numbers.forEach(function(number) { console.log(number); }); (1) 콜백함수란 다른 코드의 인자로 넘겨주는 함수에요! 인자로 넘겨준다는 얘기는 콜백함수를 넘겨받는 코드가 있다는 얘기겠죠. forEach, setTimeout 등이 되겠네요. 콜백 함수를 넘겨받은 위와 같은 코드 forEach, setTimeout 등은 이 콜백 함수를 필요에 따라 적절한 시점에 실행하게 돼요.(제어권이 그들에게 있는거죠) 콜백 함수는 다른 코드..

1. 데이터 타입 심화 (1) 데이터 타입의 종류(기본형과 참조형) 자바스크립트에서 값의 타입은 크게 기본형(Primitive Type)과 참조형(Reference Type)으로 구분됩니다. 기본형과 참조형의 구분 기준은 값의 저장 방식과, 불변성 여부입니다. 💡 [기본형과 참조형의 구분 기준] 복제의 방식 기본형 : 값이 담긴 주소값을 바로 복제 참조형 : 값이 담긴 주소값들로 이루어진 묶음을 가리키는 주소값을 복제 불변성의 여부 기본형 : 불변성을 띔 참조형 : 불변성을 띄지 않음 “불변성을 띈다” 이 말을 이해하기 위해서 아래에서 메모리와 데이터에 대한 내용을 이해해 봅시다. (2) 메모리와 데이터에 관한 배경지식 메모리와 데이터 비트 컴퓨터가 이해할 수 있는 가장 작은 단위죠 0과 1을 가지고 있..

1. 일급 객체로서의 함수 자바스크립트에서 함수는 일급 객체(First-Class Object)라고 해요. 그래서 함수를 객체처럼 여러가지 방식으로 다룰 수 있어요. 일반 객체와 달리 함수는 특별한 능력을 가지고 있습니다. 함수가 일급 객체로 취급되기 때문에, 우리는 함수를 매우 유연하게 사용할 수 있어요. 그래서 자바스크립트에서 함수는 매우 중요한 개념(이렇게 따로 빼야 할 만큼)이에요. 아래에서 함수가 일급 객체로 취급되는 5가지 경우에 대해 알아볼게요. (1) 변수에 함수를 할당 함수는 변수에 할당할 수 있습니다. 함수는 값으로 취급되기 때문에, 다른 변수와 마찬가지로 변수에 할당할 수 있습니다. 변수에 할당된 함수는 나중에 사용할 수 있습니다. const sayHello = function() {..

JS 언어의 특징 [1] 객체 지향 프로그래밍 지원 자바스크립트는 객체 지향 프로그래밍이 가능한 언어로서, 객체를 생성하고 관리하는 데에 강점이 있습니다. 이를 통해 복잡한 기능을 구현할 수 있습니다. ℹ️ 객체지향 vs 절차지향 절차지향 프로그래밍은 순서대로 실행되는 일련의 과정을 단계적으로 기술하여 프로그램을 만드는 것이고, 객체지향 프로그래밍은 데이터와 함수를 객체라는 그룹으로 묶어서 처리하는 방법입니다. 예를 들어, 절차지향 프로그래밍에서는 첫 번째 일을 처리한 다음에 두 번째 일을 처리하고, 그 다음에 세 번째 일을 처리하는 순서대로 프로그램을 만듭니다. 반면 객체지향 프로그래밍에서는 데이터와 함수를 객체라는 그룹으로 묶어서 처리합니다. 객체는 상태와 행동을 가지고 있으며, 상태는 객체의 속성(..