본문 바로가기

개발9

[CS50] - C #include #include int main(void) { printf("hello, world\n"); } #include : 작성하는 c 프로그램이 stdio.h라는 파일(라이브러리) 안에 미리 작성된 함수들에 접근 가능하도록 하는 코드 Compile Compile: 소스 코드를 오브젝트 코드(0과 1로 이루어진 기계어)로 변환하는 과정 Terminal에서 clang hello.c -o 실행파일명 명령어로 hello.c 파일을 compile한다. clang hello.c clang hello.c -o hello Compile한 결과로 실행파일이 생기는데, ./실행파일명 을 terminal에 입력해서 실행할 수 있다. ls했을 때 컴파일된 코드에는 *가 붙어있다 stdio.h 말고 다른 파일을 추가.. 2022. 4. 8.
ASCII code와 Unicode 컴퓨터는 정보를 표현하고 저장하기 위해서 0과 1을 나타낼 수 있는 기본 단위인 bit를 사용한다. bit를 사용하면 0과 1의 두 가지 수만 나타낼 수 있기 때문에 더 큰 수를 나타내기 위해서는 여러 bit의 모음을 사용해야 한다. 8개의 bit를 모은 단위를 byte라고 하며, 0~255 총 256개의 수를 나타낼 수 있다. 컴퓨터에서 우리가 다루는 정보에는 숫자만 있는 것이 아니다. 글자, 사진, 영상, 소리 등 다양한 정보가 있는데 bit로 그런 정보를 나타내기 위해서는 통일된 약속이 필요하다. 1. ASCII code ASCII code는 영어 알파벳 인코딩을 위해 만들어진 7bit 부호 체계이다. 총 128개의 문자를 표현할 수 있고, 그 안에는 영어 알파벳 대소문자(52개), 특수문자(32개.. 2022. 4. 5.
DOM이란 DOM이란 Document Object Model(문서 객체 모델, DOM)은 HTML, XML 문서의 프로그래밍 interface이다. 웹페이지는 일종의 문서(document)이고, 우리는 DOM을 통해서 프로그래밍 언어와 웹 페이지의 문서 구조를 연결할 수 있다. DOM은 웹 페이지의 구조화된 표현(structured representation)을 제공하는데, 여기에는 요소(element)들을 나타내는 노드, 노드의 프로퍼티, 노드를 조작할 수 있는 메서드가 포함된다. DOM tree DOM이 제공하는 웹페이지의 구조화된 표현을 DOM tree라고 한다. DOM tree는 계층적 트리 구조로 표현되며, 브라우저가 불러온 웹 페이지를 의미하는 Document interface가 DOM tree의 시작점.. 2022. 3. 1.
[JS] 데이터 타입(Data type) - 복사, 불변성과 가변성 이번 포스팅의 내용을 잘 이해하기 위해서는 [JS] 메모리와 데이터에 대한 이해가 필요합니다. [JS] 메모리와 데이터 컴퓨터는 우리의 명령(코드)에 따라 데이터를 조작하는 동작을 수행합니다. 이때, 조작의 대상인 데이터와 컴퓨터가 수행해야하는 명령어들은 컴퓨터의 메모리(RAM)에 저장됩니다. 코드에서 명 hangeoreum.tistory.com 자바스크립트에서 데이터에는 타입이 존재하고, 기본형(Primitive type)과 참조형(Reference type)으로 구분 가능합니다. 기본형에는 숫자(Number), BigIng, 문자열(String), 불리언(Boolean), null, undefined, 심볼(Symbol)이 포함됩니다. 참조형에는 객체(Object)가 있고 배열(Array), 함수(F.. 2022. 1. 12.
[JS] 메모리와 데이터 컴퓨터는 우리의 명령(코드)에 따라 데이터를 조작하는 동작을 수행합니다. 이때, 조작의 대상인 데이터와 컴퓨터가 수행해야하는 명령어들은 컴퓨터의 메모리(RAM)에 저장됩니다. 코드에서 명령어와 변수에 선언하는 데이터들이 메모리에 저장되고, CPU 프로세서를 통해 명령어와 데이터를 읽어 동작하게됩니다. 1. 메모리 메모리에는 수많은 비트가 저장되고 각각의 비트는 고유한 식별자(unique identifier)를 통해 위치를 확인할 수 있습니다. 비트는 0이나 1의 두 가지 값만 표현할 수 있기 때문에 비트 단위로 데이터를 처리하는 것은 큰 용량의 데이터를 처리하기에는 매우 비효율적입니다. 비트를 여러 개를 하나의 단위로 관리한다면 하나의 단위로 표현할 수 있는 값의 수도 많아지고 처리 시간도 줄일 수 있어.. 2022. 1. 10.
[JS] Event Delegation(이벤트 위임) 이벤트 위임을 이해하기 위해서는 이벤트 버블링과 캡쳐링에 대한 이해가 필요합니다. 이벤트 버블링과 캡쳐링에 대해 잘 모르시는 분은 아래 글을 참고하시면 될 것 같습니다. [JS] Event Bubbling과 Capturing [JS] Event Bubbling과 Capturing 웹페이지에서 가장 중요한 것 중 하나를 뽑자면 사용자와의 인터렉션을 꼽을 수 있습니다. 인터렉션은 브라우저 이벤트로 구현할 수 있고, 주로 DOM 이벤트를 이용합니다. 이벤트에는 마우스, hangeoreum.tistory.com 1. 이벤트 위임(Event Delegation) 이벤트 위임은 상위 요소에서 하위 요소의 이벤트를 제어하는 방식입니다. Vanilla JS로 웹페이지를 만들다 보면 다음과 같은 동작을 수행하고 싶은 경.. 2022. 1. 6.
[JS] Event Bubbling과 Capturing 웹페이지에서 가장 중요한 것 중 하나를 뽑자면 사용자와의 인터렉션을 꼽을 수 있습니다. 인터렉션은 브라우저 이벤트로 구현할 수 있고, 주로 DOM 이벤트를 이용합니다. 이벤트에는 마우스, 키보드, 폼(form) 관련 기본적인 사용자 인터렉션뿐만 아니라, 네트워크나 리소스 등 렌더링 관련 이벤트까지 다양한 종류가 있습니다. [목차] 1. 이벤트 등록 2. 이벤트 객체 3. 이벤트 흐름(Event Flow) 4. 이벤트 버블링(Event Bubbling) 5. 이벤트 캡처링(Event Capturing) 6. 이벤트 흐름 중단하기 1. 이벤트 등록 1 - 1. addEventListener() 웹페이지에서 이벤트를 구현하기 위해서는 먼저 DOM 요소에 이벤트를 등록해야 합니다. 이렇게 DOM 요소가 이벤트를.. 2022. 1. 6.
[JS] var, let, const와 hoisting ES6가 나오기 전까지 JS에서 변수를 선언하기 위해서는 var를 사용했습니다. var는 다음과 같은 특징을 갖고 있는데, 이 특징들로 예상치 못한 issue가 생기기도 합니다. 함수 레벨 scope(Function-level scope) var 키워드 생략 가능 전역 객체 property 생성 중복 선언 가능 hoisting ES6에서 let과 const가 도입되면서 var을 사용하면서 생기는 문제점들을 보완했습니다. [목차] 1. var 2. let과 const 3. Hoisting 1. var 1 - 1. 함수 레벨 scope 함수 안에서 var을 사용해 변수를 선언하면 그 변수는 선언된 함수 안에서만 사용가능합니다. 함수 밖에서 var을 사용한다면, 선언된 변수는 global scope를 갖습니다.. 2021. 10. 24.
[JS] 실행 컨텍스트(Execution Context) 실행 컨텍스트(Execution Context, EC)는 실행할 코드에 제공할 환경 정보들을 모아놓은 객체로, JS의 동적 언어로서의 성격을 잘 드러내는 개념입니다. 이름에서 유추할 수 있는 것처럼 코드가 실행되기 위해 필요한 환경이라고 생각할 수도 있습니다. 실행 컨텍스트에 대해 잘 이해한다면 scope, hoisting, this, closure 같은 JS의 필수적인 개념들을 이해하는데 도움이 됩니다. [목차] 1. 실행 컨텍스트(Execution Context) 2. 실행 컨텍스트 스택(Execution Context Stack) 3. 실행 컨텍스트의 구성 4. 실행 컨텍스트의 생성 과정 5. Hoisting 1. 실행 컨텍스트(Execution Context) JS 코드를 실행하기 위해서 자바스크.. 2021. 10. 23.

티스토리툴바