CS 스터디 10

[JS] Lexical scope 와 closure 와 this

closure는 함수를 선언하는 과정에서 결정된다. 함수가 생성될 때, 함수와 렉시컬 환경을 기억해 놓는 것이다. 즉, 당시의 외부 변수를 기억하는 것. 여기서 렉시컬이라는 것은, 자바스크립트가 따르고 있는 스코프 모델이다. 자바스크립트는 렉시컬 스코프를 따르는데, 이는 함수가 호출될 때가 아니라 선언될 때, 상위 스코프를 결정하는 규칙이라고 보면 된다. 아래 예시를 보자. let num = 1; function a() { let num = 2; b(); } function b() { console.log(num); } a(); b(); 위 예시에서 결과값이 어떻게 나올까? 정답은 둘다 1이 나온다는 것이다. a(); // 1 b(); // 1 혹시 a() 의 경우 2가 나올 것이라 예측했을 수도 있다...

CS 스터디 2021.11.07

[JS] 객체 구조분해 할당 이름 바꾸기, 객체 spread syntax

const a = { name: "woong", age: 12, }; const { name: myName, age: myAge } = a; console.log(myName); // woong console.log(myAge); // 12 위 방식으로 객체 전개 구문에서 변수 이름을 바꿔줄 수 있다. const a = { name: "woong", age: 12, }; const b = Object.assign({}, a); const c = { ...a }; b.name = "hoon"; console.log(a.name); // woong (안바뀜) c.name = "june"; console.log(a.name); // woong (안바뀜) b 와 c 두 방식 모두 객체의 주소가 복사된 것이 아니..

CS 스터디 2021.11.07

[JS] let, const 와 var 의 차이

1. 적용되는 스코프가 다르다. var 는 "함수 스코프"로 작동한다. let, const 는 "블록 스코피"로 작동한다. var의 경우, 함수가 아닌 if, for, while, try/catch 문 안에서 선언된 변수를 중괄호 { } 밖에서도 사용 가능하다. if (true) { var a = 1; } console.log(a); //1이 정상적으로 출력된다. 그러나 let, const 의 경우 블록 스코프로 작동하기 때문에 함수 뿐만아니라 if, for, while, try/catch 문 내부에서 다른 스코프를 갖는다 (switch는 블록 스코프가 아님!) if (true) { let a = 1; } console.log(a); // a is not defined 오류 발생 2. var는 함수를 재..

CS 스터디 2021.11.07

[웅's HTTP 완벽가이드] 3장 (2편) - 상태 메시지와 헤더 총정리 (HTTP/1.1까지)

'HTTP 완벽 가이드' 책을 읽고 정리한 내용입니다. 1장 HTTP 기초 링크 : https://codeboyed.tistory.com/17 2장 URL과 리소스 링크 : https://codeboyed.tistory.com/19 3장(1편) HTTP 메시지 중 메소드 : https://codeboyed.tistory.com/23 3장은 HTTP 요청과 응답 시 사용되는 HTTP 메시지에 관한 내용입니다. 내용이 상대적으로 많아서 1편과 2편으로 구성했습니다. 개발자 도구의 네트워크 탭을 열어, HTTP 메시지에 어떤 요소가 있는 지 한 번 보는 것도 좋을 것 같습니다. 3.4 상태코드 HTTP 상태 코드는 크게 5가지로 나뉜다. 상태 코드는 클라이언트에게 그들의 트랜잭션을 이해할 수 있는 쉬운 방법을..

CS 스터디 2021.10.24

[웅's HTTP 완벽 가이드] 3장(1편) - HTTP 메시지 ( 메서드 총정리 )

'HTTP 완벽 가이드' 책을 읽고 정리한 내용입니다. 1장 HTTP 기초 링크 : https://codeboyed.tistory.com/17 2장 URL과 리소스 링크 : https://codeboyed.tistory.com/19 3장은 HTTP 요청과 응답 시 사용되는 HTTP 메시지에 관한 내용입니다. 내용이 상대적으로 많아서 1편과 2편으로 구성했습니다. 개발자 도구의 네트워크 탭을 열어, HTTP 메시지에 어떤 요소가 있는 지 한 번 보는 것도 좋을 것 같습니다. 3.1 메시지의 흐름 3.1.1 메시지는 원 서버 방향을 인바운드로 하여 송신된다. HTTP는 인바운드와 아웃바운드라는 용어를 사용한다. 이는 트랜잭션의 방향을 표현하기 위함이다. 원 서버로 향하는 것은 인바운드로 이동하는 것이고( 서..

CS 스터디 2021.10.17

[웅's HTTP 완벽 가이드] 2장 - URL과 리소스

'HTTP 완벽 가이드' 책을 읽고 정리한 내용입니다. 1장 HTTP 기초 링크 : https://codeboyed.tistory.com/17 2장에서는 인터넷의 리소스를 사용하기 위해 꼭 알아야 하는 URL 의 개념에 대해 다룹니다. 글을 읽기전 아래 URL에 대해서 자신이 아는 내용을 혼자 설명해보고 글을 읽는 것도 좋은 공부방법이 될 것 같습니다. https://codeboyed.tistory.com/manage/newpost/?type=post&returnURL=%2Fmanage%2F# URL(Uniform Resource Locator)은 인터넷의 리소스를 가리키는 표준이름이다. URL은 전자정보 일부를 가리키고 그것이 어디에 있고 어떻게 접근할 수 있는지 알려준다. 2.1 인터넷 리소스 탐색하..

CS 스터디 2021.10.03

[웅's HTTP 완벽 가이드] 1장 - HTTP 기초

'HTTP 완벽 가이드' 책을 읽고 정리한 내용입니다. 1장에서는 HTTP 통신이 어떻게 이루어지는 지와 앞으로 다루게 될 웹어플리케이션의 간략한 소개가 있었다. 먼저, 이번 장의 키워드들을 나열했다. 글을 읽기 전, 자신이 아는 개념을 간단하게 설명해보면 좋을 것 같다. HTTP ( HyperText Transfer Protocol ) URI ( Uniform Resource Identifier ) URL ( Uniform Resource Locatior ) URN ( Uniform Resource Name ) HTTP 메소드 종류 HTTP 상태 코드 HTTP 메시지 TCP/IP HTTP 프락시 웹 캐시 게이트웨이 HTTP 터널 1.1 HTTP란? 전 세계의 웹브라우저, 서버, 웹 애플리케이션이 대화할..

CS 스터디 2021.09.25

[JS] Object Prototype 이란?

안녕하세요 :) 이번 포스팅은 [자바스크립트 프로토타입] 입니다. 1. Prototype 이란? 모든 자바스크립트의 객체 (Objects) 들은 Prototype 으로부터 Properties 와 methods 를 상속 받습니다. 예시로 우리가 자주 사용하는 list 를 하나 생성하겠습니다. let list = [1, 2, 3]; console.log(list.length) //3 위 예시를 보면 list 객체만 정의했을 뿐인데, list 내부 요소들의 개수를 알려주는 length 변수가 생성된 것을 알 수 있습니다. length 변수는 어떻게 생성된 것일까요? 콘솔창에서 list를 생성하고 그 모습을 보게 되면 [[Prototype]] 속성이 추가된 것이 보입니다. 이는 list 와 같은 Array ty..

CS 스터디 2021.09.06