루루의 우당탕탕 개발 스토리 루루의 우당탕탕 개발 스토리

클로저 상태를 안전하게 변경하고 유지하기 위해 사용한다. 다시말해, 상태가 의도치 않게 변경되지 않도록 상태를 안전하게 은닉하고 특정 함수에게만 상태 변경을 허용하기 위해 사용한다. 변수 값은 누군가에 의해 언제든지 변경될 수 있어 오류 발생의 근본적 원인이 될 수 있다. 외부 상태 변경이나 가변 데이터를 피하고 불변성을 지향하는 함수형 프로그래밍에서 부수효과를 최대한 억제하여 오류를 피하고 프로그램의 안정성을 높이기 위해 클로저는 적극적으로 사용된다. 아래는 함수형 프로그래밍에서 클로저를 활용하는 간단한 예제다. // 함수를 인수로 전달받고 함수를 반환하는 고차 함수 // 이 함수는 카운트 상태를 유지하기 위한 자유 변수 counter를 기억하는 클로저를 반환한다. function makeCounter..

this 바인딩은 함수 호출 방식, 즉 함수가 어떻게 호출되었는지에 따라 동적으로 결정된다. 함수의 상위 스코프를 결정하는 방식인 렉시컬 스코프는 함수 정의가 평가되어 함수 객체가 생성되는 시점에 상위 스코프를 결정한다. 하지만 this 바인딩은 함수 호출 시점에 결정된다. this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. 아래는 일반 함수 내부, 메서드 내부, 생성자 함수 내부에서의 this 사용의 예시이다. // this는 어디서든지 참조 가능하다. // 전역에서 this는 전역 객체 window를 가리킨다. console.log(this); //window fu..

코드의 문맥은 렉시컬 환경으로 이뤄진다. 렉시컬 환경이란 코드가 어디서 실행되며 주변에 어떤 코드가 있는지를 뜻하며 이를 구현한 것이 실행컨텍스트이다. 모든 코드는 실행컨텍스트에서 평가되고 실시된다. 스코프는 실행 컨텍스트와 깊은 관련이 있다. 스코프? 실행컨텍스트? 렉시컬 환경? 모두 어려운 개념이지만 너무나 중요한 개념이다. 우선 이 개념들을 짚고 가기 전에 스코프에 대한 개념을 설명해보고자 한다. 스코프의 종류 전역/지역 구분 설명 스코프 변수 전역 코드의 가장 바깥 영역 전역 스코프 전역 변수 지역 함수 몸체 내부 지역 스코프 지역 변수 이 때 변수는 자신이 선언된 위치(전역 또는 지역)에 의해 자신이 유효한 범위인 스코프가 결정된다. 즉, 전역에서 선언된 변수는 전역 스코프를 갖는 전역 변수이고..

자바스크립트의 함수는 "일급 객체"이다. 함수가 일급객체라는 것은 함수를 값처럼 자유롭게 사용할 수 있다는 의미이다. 함수가 객체라는 사실은 다른 프로그래밍 언어와 구별되는 자바스크립트의 중요한 특징이다. 함수는 일급 객체이므로 함수 리터럴로 생성한 함수 객체를 변수에 할당할 수 있다. 이러한 함수 정의 방식을 함수 표현식이라고 한다. // 무명 함수 표현식 var add = function(x, y) { return x + y; }; console.log(add(2, 5)); //7 // 기명 함수 표현식 var add = function foo (x, y) { return x + y; }; console.log(add(2, 5)); // 7 console.log(foo(2, 5)); // Refere..

동기와 비동기 개념 차이 동기와 비동기 개념의 차이에 대해서는 이전에 포스팅한 적이 있다. 가볍게 정리하면 동기는 A, B, C의 호출이 순차적으로 있었을 때 A가 마무리 되고 나서야 B가 실행되고 B가 실행된 이후에야 C가 실행될 수 있다. 즉 순서가 순차적이다. 반면에 비동기함수는 A, B, C 호출이 동시에 일어난다. 특정 코드의 연산이 끝날 때 까지 코드의 실행을 멈추지 않고 다음 코드를 먼저 실행한다. A, B, C를 동시에 실행했을 때 B와 C의 결과가 먼저 발생될 수도 있다. 반면 웹개발을 하다보면 비동기 함수를 동기처럼 쓰고싶을 때가 있다. 함수를 호출하자마자 즉각적으로 실행되길 원하지만, 호출 후 데이터를 받고나서 이후의 작업이 필요할 때 주로 그러한 일들이 많았다. 주로 API를 호출하..

CORS Cross-Origin Resource Sharing 여기서 출처(Origin)란, URL 구조에서 Protocal, Host, Port를 합친 것을 말한다. https://tistory.com/ 를 기준으로 Protocal은 'https//' , Host는 'tistory.com' , Port는 https의 번호인 443을 나타낸다. 동일 출처 정책을 지키면 외부 리소스를 가져오지 못하지만 XSS나 XSRF 등의 보안 취약점을 노린 공격을 방어할 수 있다. Same origin 정책과 cross origin 정책은 아래와 같다. - Same origin 정책 Client와 Server가 동일한 IP주소에서 동작하고 있다면 별다른 제약없이 서로 주고받을 수 있다. - Cross origin 정책..