전체 글

CS : 인터넷 네트워크 (1) 인터넷 프로토콜 계층

인터넷 프로토콜(규약) 스택의 4계층 1. 애플리케이션 계층 HTTP, FTP, SMTP, POP3, IMAP, DNS 등의 프로토콜을 사용한다. 웹 브라우저, 네트워크 게임, 채팅 프로그램 등과 같은 서비스를 이용할 수 있도록 사용자 애플리케이션과 상호 작용한다. SOCKET 라이브러리를 사용해 하위 계층과 통신한다. 2. 전송 계층 주요 프로토콜로는 TCP, UDP가 있다. 데이터의 신뢰성과 효율성을 관리한다. 애플리케이션은 전송 계층을 통해 데이터를 전송한다. TCP는 연결 지향적이며 신뢰성을 제공하며, UDP는 비연결 지향적이며 빠른 데이터 전송을 지원한다. 3. 인터넷 계층 주요 프로토콜로는 IP가 있다. 데이터를 패킷 형식으로 묶어서 목적지까지 라우팅하고 전달한다. (전송 계층과 인터넷 계층은..

[제로초] Promise와 동기/비동기 관련 짤막 키워드정리

https://sunshineyellow.tistory.com/64 위는 같이 볼만한 드림코딩 콜백지옥 탈출 Promise 기초 게시글. 제로초 인간JS엔진 보다가 추가적인 키워드 문장 정리가 필요해 작성한다. Promise란? 실행은 됐는데!!! 결과값을 나중에 쓸 수 있다. "실행은 됐는데"가 중요. 그래서 new Promise 안의 익명함수는 동기적으로 실행이 된다. 동기비동기 실행순서 관련해서 아래 코드가 중요하다. 기억해 놓자. let a = 2; const p = new Promise((resolve, reject) => { console.log('실행1'); setTimeout(() => { a = 5; console.log('실행3', a); resolve(a); }, 0); }); // ..

JavaScript 정리 : this (2) 화살표함수에서의 this

여기서 잠깐🔔 화살표 함수의 특징 생성자로 사용할 수 없음 스스로의 this, argument를 가지지 않음 return하지 않아도 값이 반환됨 (본문이 여러 줄로 이루어진 경우는 제외) 화살표 함수의 this는? this = 함수가 정의된 스코프의 this를 가리킴 (생성될 때 this가 결정되며, 화살표함수가 어떻게 사용/호출되든 this는 변하지 않는다.) const obj = { name: '철수', sayName: function() { const innerMethod = () => { return `${this.name}, 안녕!`; }; console.log(innerMethod()); } }; obj.sayName(); // 철수, 안녕! → 그러므로 객체의 메소드는 화살표 함수로 정의하지..

JavaScript 정리 : this (1) 상황별 this

JavaScript에서 this가 가리키는 객체는 정해져 있지 않으며, 호출될 때 결정된다. 아래처럼 다양한 상황에서 this가 어떤 객체를 가리키게 되는지 알아보자. (화살표함수에서의 this는 다음 글에서 정리한다.) 목차 전역 컨텍스트 (Global scope) & 함수 호출 객체에 속한 메서드 호출 객체에 속한 메서드의 내부 함수 호출 함수를 메서드로 호출 (call, apply, bind) 생성자 함수 호출 클래스 이벤트 핸들러 "use strict" 모드 1. 전역 컨텍스트 (Global scope) & 함수 호출 this = 전역 객체 (브라우저에서는 window) console.log(this); // 전역 객체 (브라우저에서는 window) function myFunction() { co..

Redux 정리 (3) : dispatch, useSelector, 컴포넌트가 상태를 업데이트하는 과정 총정리

dispatch dispatch는 Store의 메서드로, action을 Store에 전달하여 발생시키는 역할을 한다. store.dispatch(action)의 형태로 사용한다. subscribe subscribe는 Store의 메서드로, Store의 state(상태)가 변경될 때마다 특정 함수를 자동으로 호출한다. 컴포넌트에서 Store의 상태를 실시간으로 감지하고, 상태가 업데이트되면 자동으로 리렌더링을 할 수 있게 한다. * subscribe 함수를 실제로 사용할 일은 크게 없다. 보통 redux의 connect 함수 또는 react redux의 useSelector 훅을 사용한다. useSelector useSelector 훅(hook)은 redux store의 state를 component와 연..

Redux 정리 (2) : actions (액션생성자함수, type, payload)

actions action은 상태(State)에 변화를 발생시키는 객체이다. action 객체는 type 필드를 필수로 가지고 있어야 하며, 그 외의 값은 개발자 맘대로 넣을 수 있다. 참고로 ajax로 json 데이터를 받아올 때는 actions 파일에 넣게 된다. action 생성자함수 파일 개요 (userActions.js) 파일의 user자리는 개발자 마음대로 action 객체의 목적에 따라 작명하면 된다. (reducer와 동일) 이 파일에는 action 객체를 반환하는 액션 생성자 함수를 작성하게 된다. 이 파일은 일반적으로 아래처럼 작성된다. export const login = (username, password) => { return { type: 'LOGIN', payload: { us..