728x90 반응형 SMALL 분류 전체보기136 프로토타입과 객체지향 프로그래밍 프로토타입이란? JavaScript는 프로토타입 기반 객체지향 프로그래밍 언어입니다. 클래스 기반 객체지향 프로그래밍 언어는 객체 생성 이전에 클래스를 정의하고 이를 통해 객체(인스턴스)를 생성하지만, 프로토타입 기반 객체지향 프로그래밍 언어는 클래스 없이도 객체를 생성할 수 있습니다. 자바스크립트의 모든 객체는 자신의 부모 역할을 담당하는 객체와 연결되어 있기 때문에, 부모 객체의 프로퍼티 또는 메소드를 상속받아 사용할 수 있게 합니다. 이 때, 부모 객체를 Prototype(프로토타입)이라고 하고, Prototype은 생성자 함수에 의해 생성된 각각의 객체에 공유 프로퍼티를 제공하기 위해 사용합니다. 이는 객체를 생성할 때, 그 객체는 자신의 부모 역할을 하는 프로토타입 객체를 가리키는 [[proto.. 2024. 3. 20. 클라이언트 사이드 렌더링(CSR) vs 서버 사이드 렌더링(SSR) 브라우저 렌더링이란? 브라우저가 서버로부터 요청해 받은 내용을 브라우저 화면(View)에 표시해주는 작업을 말한다. 브라우저가 서버로부터 HTML, CSS, JavaScript 문서를 전달받아 브라우저 엔진이 각 문서를 해석해 브라우저 화면을 그려준다. 브라우저 렌더링은 크게 클라이언트 사이드 렌더링(CSR)과 서버 사이드 렌더링(SSR) 방식으로 나누어진다. 클라이언트 사이드 렌더링(CSR) CSR은 "Client-Side Rendering"의 약어로, 클라이언트 측에서 페이지를 렌더링하는 방식을 말한다. CSR은 서버로부터 받아온 데이터를 클라이언트에서 JavaScript를 통해 동적으로 조작하여 렌더링한다. 클라이언트에서 데이터를 받아오고 렌더링하기 때문에 초기 로딩 속도는 느리지만, 이후에는 페이.. 2023. 4. 17. 동기(Synchronous)와 비동기(Asynchronous) 동기(Synchronous)와 비동기(Asynchronous)는 프로그래밍에서 매우 중요한 개념이다. 동기(Synchronous) 동기는 호출하는 함수가 반환하기 전에 작업이 완료될 때까지 기다리는 것을 의미한다. 즉, 호출한 함수는 결과가 반환될 때까지 블로킹(blocking)되며, 결과가 반환된 후에야 다음 코드를 실행할 수 있다. 이러한 특성 때문에, 동기 방식은 순차적인 처리를 보장하고, 코드가 간단하고 직관적이다. 하지만, 작업이 끝날 때까지 대기해야 하기 때문에, 시간이 오래 걸리는 작업을 수행할 때는 성능 이슈가 발생할 수 있다. function func1(){ console.log('func1'); func2(); } function func2(){ console.log('func2'); .. 2023. 4. 16. Base64 인코딩이란? Base64 인코딩을 알아보기 전, 인코딩에 대해서 먼저 알아봐야한다. 인코딩(encoding)이란? 인코딩(encoding)은 컴퓨터를 이용해 영상 · 이미지 · 소리 데이터를 생성할 때 데이터의 양을 줄이기 위해 데이터를 코드화하고 압축하는 것이다. 즉, 정보의 형태나 형식을 표준화, 보안, 처리 속도 향상, 저장 공간 절약 등을 위해서 다른 형태나 형식으로 변환하는 처리 혹은 그 처리 방식을 말한다. Base 64란? 컴퓨터 분야에서 쓰이는 Base 64 (베이스 육십사)란, 8비트 이진 데이터(예를 들어 실행 파일이나, ZIP 파일 등)를 문자 코드에 영향을 받지 않는 공통 ASCII 영역의 문자들로만 이루어진 일련의 문자열로 바꾸는 인코딩 방식을 가리키는 개념이다. Base64 인코딩은 8비트 .. 2023. 4. 16. HTML의 inline 요소와 block 요소 HTML의 인라인(inline) 요소와 블록(block) 요소는 웹페이지의 레이아웃과 구조를 결정하는 데 중요한 역할을 한다. 인라인(inline) 요소 인라인 요소는 텍스트나 이미지 등과 같은 작은 내용을 표시하는 데 사용된다. 인라인 요소는 컨텐츠가 차지하는 공간 만큼만 공간을 차지한다. 즉, 다른 요소와 함께 한 줄에 표시될 수 있다. ex) , , , , 등 이것은 인라인 요소입니다. 이것은 인라인 요소입니다. 이것은 인라인 요소입니다. See the Pen inline 요소 by Jo Sujeong (@suzzeong) on CodePen. 블록(block) 요소 블록 요소는 대형 콘텐츠, 예를 들어 단락, 제목, 목록 등과 같은 구조적 요소를 나타내는 데 사용된다. 블록 요소는 자신의 줄을 차.. 2023. 4. 7. ul 요소와 ol 요소의 자식 요소는 li 요소 , HTML에서 요소와 요소 모두 목록을 나타내기 위한 요소다. 하지만, 두 요소의 차이점은 목록의 형태다. 요소 요소는 비순서 목록(unordered list)을 나타내며, 목록 항목이 순서 없이 나열된다. 아이템 앞에 추가되는 마커(marker)는 검정색의 작은 원(bullet)이나 정사각형 모양으로 표현된다. 요소 요소는 순서 목록(ordered list)을 나타내며, 목록 항목이 순서대로 나열된다. 이 때 목록 항목은 숫자, 알파벳, 로마 숫자 등과 같은 순서 지시자로 표시된다. 목록이 어떻게 표시되어야 하는지에 따라 과 중에서 선택하여 사용하면 된다. 요소와 요소의 자식 요소는 목록 항목을 나타내는 요소이어야 한다. 요소는 왜 , 요소의 자식 요소여야만 하나? HTML 명세에서 정의된 규칙으로,.. 2023. 4. 7. 이전 1 2 3 4 ··· 23 다음 728x90 반응형 LIST
