Let's Write_ 프론트엔드

[1w 1] 그림으로 배우는 http & network basic 시작 ~ 96p

기술서적 - 주4회 10페이지 읽기

 

시작 ~96p


http 인터넷 통신의 역사
인터넷을 통해 데이터가 전송되는 방식
> 주소를 입력하면 브라우저의 DNS 가 주소를 컴퓨터가 이해할 수 있는 ip주소로 서버에 요청하고 4단계를 거쳐서 서버에 도달. 요청받은 서버는 해당하는 주소의 데이터를 응답하여 다시 되돌려주면 클라이언트는 받아서 화면에 그린다..
ip
TCP : Transfer Control Protocol
프로토콜은 4개의 계층으로 나누어 관리 ㅡ 문제발생시 더 쉽게 찾거나 컨트롤할 수있다.
패킷을 전송하여 데이터가 옮겨짐
http 메소드
요청, 응답
응답코드

느낌 : 구 정보처리 자격증 공부하고 나서 보면 잘 이해될 것 같은 책이다. 기본지식이 조금 필요함. 근데 나는 구 정보처리를 조금 공부했다.. 다시 공부해야겠네^^..
그림이 있어서 한 페이지당 글이 많은건 아니라서 술술 잘읽힌다. 그림이 이해를 좀 더 돕는것 같기도 하고 아닌것 같기도 하고 아리송하다.

 

 

'기술서적 - 주4회 10페이지 읽기' 카테고리의 다른 글

[1w 4] 프론트엔드 프로젝트가이드  (0) 2020.02.01
[1w 3]http&network  (0) 2020.01.31
[1w 2] http&network basic p94-105  (0) 2020.01.29
코어자바스크립트  (0) 2020.01.23

코어자바스크립트

기술서적 - 주4회 10페이지 읽기

코어자바스크립트 p144 - 201 / 1회독 끝

 

부분적용함수
커링함수 ㅡ 실습필요
6프로토타입
constructor, instance
프로토타입체인
객체전용 메서드 = static
7클래스
클래스와 인스턴스
상속
constructor 복구하기
es6이 클래스

react - class, JSX 콜백함수에서 this

TIL

React를 사용할 때 일반적으로 DOM 요소가 생성된 후에 리스너를 추가하기 위해 addEventListener 를 호출할 필요가 없습니다.

대신 요소가 처음 렌더링될 때 리스너를 제공합니다.

ES6 class 를 이용해 요소를 정의할 때 이벤트 핸들러의 일반적인 패턴은 클래스의 메서드 형태입니다. 

 

JSX 콜백에서 this 의 의미에 대해 주의해야합니다.

자바스크립트에서 클래스 메서드는 기본적으로 bound 되지 않습니다. 만약 constructor 내부에서 

this.handleClick = this.handleClick.bind(this) 바인드를 잊은채로 onClick 에 전달하면, this 는 함수가 실제로 호출될 때 undefined 로 취급됩니다.

 

이건 React에서 정의한 동작이 아닙니다. 자바스크립트의 함수의 동작 방식 의 일부입니다.

일반적으로 onClick={this.handleClick} 처럼 () 없이 메서드를 참조하면, 그 메서드를 bind 해야합니다.

만약 bind 를 호출하는 게 귀찮은 경우 이 문제를 해결할 수 있는 두가지 방법이 있습니다.

 

1. 만약 실험 기능인 퍼블릭 클래스 필드 문법 을 사용한다면 클래스 필드를 정확히 콜백에 bind할 수 있습니다.

- 함수선언에서 화살표함수를 사용

 

2. JSX에서 이벤트에 거는 콜백함수에서 화살표함수를 사용

이경우는 바인드를 하지 않아도 되지만, 해당 컴포넌트를 렌더링 할때마다 서로 다른 콜백이 만들어진다.

. 대부분의 경우에서 크게 문제는 없습니다. 하지만 만약 콜백에서 하위 컴포넌트에 prop을 전달하는 경우, 이 컴포넌트는 큰 비용으로 다시 렌더링될 수 있습니다. 이런 종류의 성능 문제를 피하기 위해 보통

 

생성자 함수에서 바인딩하거나

클래스 필드 문법을 사용하는 걸 권장합니다.

 

https://reactjs-kr.firebaseapp.com/docs/handling-events.html