Front End/JavaScript
클로저
클로저JavaScript에서는 다른 컴퓨터 언어와 조금 다른 특성이 몇 가지 있는데, 그 중 종종 사용되는 것이 클로저라는 개념이다. JavaScript는 함수가 호출되는 환경과 별개로 기존에 선언되어 있던 환경, 즉 어휘적 환경을 기준으로 변수를 조회하려 한다. 이와 같은 이유로 “외부 함수의 변수에 접근할 수 있는 내부 함수”를 클로저 함수라 일컫는다.첫 번째 특징 : 함수를 리턴하는 함수// 화살표 함수를 이용한 간단한 덧셈 함수 const add = (x, y) => x + y; add(5, 7); // 12 // 함수의 호출이 두 번 발생하는 화살표 함수 const adder = x => y => x + y; adder(5)(7); // 12 // 리턴 값이 함수의 형태 typeof adder(..
스코프
스코프(Scope)변수 접근 규칙에 따른 유효 범위. 가장 바깥의 스코프를 전역 스코프(Global scope)라 부르며, 그 외의 안쪽을 지역 스코프(Local scope)라 부른다.if문이나 for문, 함수(function) 처럼 중괄호{}를 기준으로 전역/지역 스코프를 구분전역 스코프에서 선언한 변수는 지역 스코프에서 사용 가능지역 스코프에서 선언한 변수는 전역 스코프에서 사용 불가지역 변수는 전역 변수보다 더 높은 우선순위를 가진다.let name = 'nine'; // 전역변수 function showName(){ let name = 'floor'; // 지역변수 console.log(name); // 두 번째 출력 } console.log(name); // 첫 번째 출력 showName(); ..
Koans를 통해 알게 된 것들
Koans는 불교에서 유래된 단어로 결론을 내리기 전에 이게 왜 맞는지 깊게 고민한다는 의미라고 한다. 단순히 문제를 푸는 것이 아니라, 문제를 푸는 과정에서 왜 문제의 해답이 나왔는 지에 대해 되짚어보면서 깊이 이해하라는 뜻으로 받아들였다. 이번 Koans를 풀면서 알게 된 것들을 정리한다.mocha, chai : 테스트 자동화Koans는 mocha, chai 라는 프레임워크와 라이브러리를 사용해 우리가 푼 문제가 맞는지 틀린지 자동으로 실행하여 확인해준다. 이는 단순히 문제를 푸는 것을 넘어, 테스트를 자동화하여 개발할 때 유용하게 사용 할 수 있다.코드를 테스트를 해야 하는 이유는 우리가 단순히 함수 하나를 구현하고 끝내지 않기 때문이다. 여러 함수를 사용하고 유기적으로 돌아가는 어플리케이션 제작을..
비동기
동기 vs. 비동기비동기의 주요 사례비동기를 순차적으로 구현하는 세 가지 방법CallBackPromise메서드 체이닝async / await타이머 API동기 vs. 비동기요청을 순차적으로 처리하는 것을 동기적(synchronous)이라고 표현한다. 먼저 들어온 요청 A를 처리하는 동안 그 이후에 들어온 요청 B를 막고(blocking), 처리가 완료되면 B을 처리하기 때문에 B의 시작 시점과 A의 완료 시점이 같은 상황을 말하는 것이다.이에 반해, 비동기(asynchronous)는 요청이 들어오는 것을 막지 않고(non-blocking) 처리가 완료된 요청은 바로 완료한다. 이는 먼저 들어온 요청 A의 완료 시점과 이후의 요청 B의 시작 시점이 다르다. 이 때, 처리하는 시점은 다르더라도 일단 후에 들어..
고차함수
일급 객체(first-class citizen)고차 함수(higher order function)다른 함수를 인자로 받는 경우함수를 리턴하는 경우함수를 인자로 받고 함수를 리턴하는 경우내장 고차 함수Array.filter()Array.map()Array.reduce()ex. 배열을 객체로 만드는 예제고차 함수의 중요성 : 추상화추상화값 수준에서의 추상화사고 수준에서의 추상화사고 수준의 추상화의 예시일급 객체(first-class citizen)비행기에 퍼스트 클래스, 이코노미 클래스가 나뉘어 다른 대우를 받는 것 처럼 JavaScript에는 특별한 대우를 받는 일급 객체가 존재한다. 대표적인 일급 객체 중 하나가 함수다. 함수는 아래와 같은 특별 취급을 받는다.변수에 할당(assignment) 할 수 있..