분류 전체보기 225

[Javascript]스레드, 프로세스, 블로킹, 논블로킹

자바스크립트 cs관련 설명이 머무 좋아서 일부내용을 퍼왔다 출처: [JavaScript] 런타임 작동 방식, 비동기와 이벤트 루프 - 하나몬 ⚡️ [JavaScript] 런타임 작동 방식, 비동기와 이벤트 루프 ❗️알아볼 키워드 자바스크립트란? 자바스크립트 V8 엔진이란? 자바스크립트 런타임이란? 자바스크립트 싱글 스레드 기반 프로그래밍 hanamon.kr 자바스크립트와 싱글 스레드 자바스크립트는 싱글 스레드 프로그래밍 언어이다. 👉 스레드란? (single thread = 한 가닥) 스레드의 사전적 의미는 한 가닥의 실이라는 뜻이다. 한 가지 작업을 실행하기 위해 순차적으로 실행한 코드를 실처럼 이어 놓았다고 해서 유래된 이름이다. 싱글 스레드란 하나의 프로그램에서 동시에 하나의 코드만 실행할 수 있다..

[TIL] 비동기처리 과정 (Feat. Callback 함수)

자바스크립트의 경우 싱글 스레드 기반 언어이기 때문에 네트워크 관련 요청을 비동기적으로 처리하게 된다. 만약 동기적으로 처리한다면 즉시 처리되는 요청은 사용자에게 불편함을 주지 않으나, 어느 정도 시간이 걸리는 경우에는 클라이언트(브라우저)에서 네트워크 요청 처리하기 위해 다른 작업이 중단 될 것이다. 그래서 브라우저 에서는 이런 비동기 작업들을 처리하기 위한 장치들로 이벤트 루프와 태스크 큐 등을 가지고 있다 V8과 같은 자바스크립트 엔진은 단일 호출 스택(Call Stack)을 사용하며, 요청이 들어 올 때마다 해당 요청을 순차적으로 호출 스택에 담아 처리한다. 단일 호출 스택만을 사용한다면, pop을 통해 호출 스택에 있는 요청을 처리하기 때문에 비동기 요청 및 동시성에 대한 처리는 불가능해 진다...

TIL 2022.03.02

[자료구조] 스택, 큐

스택이란? 한쪽 끝으로만 넣고 뺄수 있는 자료구조 예를들어 빨래통이 있다고 한다면 빨래를 빨래통에 차례대로 넣고나서 세탁기에 넣을때 처음에 넣은 맨아래 빨래가 아닌 마지막에 넣은 빨래부터 아래로 세탁기에 넣는다. → 이러한 자료구조를 Last In First Out 이라고 해서 LIFO 자료구조 라고한다. 왜필요한가? 넣은 순서를 쌓아두고 있고 그 순서가 필요한 경우가 있다. 예를들어 컴퓨터의 되돌리기(Ctrl+Z) 기능의 경우 직전 행동으로 되돌리고 싶을때 사용하는 기능인데 이를위해서 행동들의 순서대로 기억해야하고 마지막 행동부터 처리해야하기때문에 이러한 스택을 사용한다. 스택구현 스택 이라는 자료구조에서 제공하는 기능 push(data): 맨위(뒤)에 데이터 넣기 pop(): 맨위의 데이터뽑기 pee..

[알고리즘] 정렬 ( 버블정렬, 선택정렬, 삽입정렬, 병합정렬)

정렬 버블정렬 요소들이 마치 거품이 일어나듯이 연쇄적으로 자기 자리를 찾아간다고하여 버블정렬이라고 부른다. 배열첫인덱스부터 끝인덱스까지 순차적으로 비교해가면서 순회하는 반복문을 사용 끝인덱스에 가장 큰수를 넣었다면 다시 처음부터 끝에 넣은 큰수 인덱스제외 비교해가며 순회한다. 시간복잡도는 O(N^2) 선택정렬(Selection Sort) 인덱스 0부터 배열의 길이만큼의 값을 비교하여 전체중 최소값의 인덱스를 기억하고 그것을 순차적으로 왼쪽부터 정렬하는것 시간복잡도는 O(N^2) 삽입정렬(Insertion Sort) 전체에서 필요할때만 하나씩 올바른 위치에 “삽입"하는 방식 인덱스0 부터 차례로 정렬을 하기때문에 만약 그다음 for문에 해당하는 인덱스값이 그 앞 인덱스에 해당하는 값과 비교하여 더 크다면 ..

[알고리즘] 이진탐색, 재귀함수

이진탐색(이분탐색) binary search 업다운 게임 전체범위의 딱 절반으로 탐색 총 배열의 길이가 N이라고 할때 그 절반을 탐색하므로 N/2 그다음 N/2/2 이므로 N/(2^2).... 가면 N/2^k 가 되고 이렇게 무한히 반복하다보면 1개만 남았을때를 가정하면 N/2^k = 1이 여야 하므로 k = log N 이된다. 즉 시간복잡도는 O(log N) 이라고 할수있다. 만약 배열이 정렬이 되어있지않다면 이진탐색이 되지않는다. 이럴때 정렬을 이용하여야한다. 재귀함수 자신의 함수안에서 다시한번 자신의 함수를 호출한다. 예를들어 60에서 0까지 카운트하는 함수를 만들때 위와같이 재귀함수를 쓴다. 팩토리얼 3! = 321 4! = 4321=43! 즉, Factorial(n)=n*Factorial(n-1..

[TIL] 20220228 검색어를 입력하세요. www

웹프로그래밍 강의듣다가 머리식힐겸 넷플릭스에서 드라마보는데 '검색어를 입력하세요. www' 라는 드라마가 눈에 띄어서 뭔가 웹 관련 드라마이겠구나 보기시작했다. 2019년에 방영했던거였는데 지금 보니깐 재밌다. 유니콘이라는 포털사이트 회사에서 인기검색어 조작관련, 사용자 유니콘 포털사이트를 이용 점유율 등이 나오는걸 보면서, 웹서비스를 할때 기본이되는 비즈니스적 사고와 그 안에서 벌어지는걸 드라마적으로 보니깐 흥미로웠다. 실무적으로 어떤 비즈니스적 마인드나 사건이 일어날수있는지를 드라마를 통해서 보고싶다면 강추다

TIL 2022.02.28

[CS] 웹 정의, 역사, 종류 등

웹프로그래밍 웹의 기본 목적 다른 여러 컴퓨터에서 문서를 공유하거나 보는 목적 웹에서 다루는 문서를 웹 문서 라고 부름 웹의 구조 인터넷을 활용 거미줄처럼 연결된 정보 소통망, world wide web →웹문서를 인터넷 상의 컴퓨터들 끼리 주고 받는 네트워크 시스템 웹 구성 웹서버 와 클라이언트 컴퓨터들로 구성 웹서버 웹사이트를 탑재하는 컴퓨터로 구글(www.google.com), 네이버(www.naver.com) 등 웹 문서, 이미지, 동영상 등의 데이터 저장 관리 웹 클라이언트의 요청을 받아 웹 문서 전송 웹 서버로 작동하도록 하는 소프트웨어를 실해하는 컴퓨터 웹 클라이언트 사용자 인터페이스 담당 웹 서버에 웹 문서를 요청하고 받아 사용자에게 볼수있도록 출력 인터넷과 웹은 다르다 인터넷 웹의 개념이..

공부/CS 2022.02.28

[TIL] 참조타입!!

오늘 한일 Linked List 구현 클래스,객체 원시타입, 참조타입 차이 ​알고리즘과 자료구조를 공부하면서 linked list 를 구현을 해보았다. 강의를 따라하면서 next 값을 계속 접근해가면서 새로운 값을 append 하는과정을 보면서 cur 이라는 변수에 class의 this.head 를 넣어주는데 cur = this.head 라고 있었고 이 this.head는 클래스를 참조하는것이였다. 순수 자바스크립트의 이론을 공부한지 오래되기도했고 이론과 실전을 접목하는 시간이 많이 없어서 몰랐는데 위의 스샷에서 cur = cur.next로 cur 에 접근하여 값이 바뀌면 this.head안에 있는 this.head.next 값도 바뀌는걸 보고 "응? 이게 왜 같이 바뀌는거지?" 라고 생각했다. '클래..

TIL 2022.02.26

[알고리즘] 자료구조, 배열, linked list

자료구조 특정 자료구조는 삽입/삭제가 빠르고, 특정 자료구조는 조회가 빠르다. 이렇게 어떤 경우에 이 자료가 좋고, 어떤 경우는 저 자료가 좋은 것 처럼 경우에 따라 다양한 자료구조와 알고리즘을 사용해야한다. 비유 못을 박을때는 망치가 필요, 나사를 뺄 때는 뺀치가 필요한것처럼, 다양한 공구들의 사용법을 배우는것이다. Array 순차적으로 데이터를 저장 배열은 크기가 정해진 데이터의 공간. 한번 정해지면 바꿀수 없다. ->원소를 새로 추가하려면, 새로운 공간을 할당을 해야하기때문에 매우 비효율적 자료구조 index를 통해 원소에 즉시 접근할수있다. Ex rooms[3] -> 즉시 접근 가능하다는것은 상수 시간내에 접근할수있으므로 O(1)내에 접근 할수있다고 말한다. 배열은 원소를 중간에 삽입/삭제 하려면..