yyeon111

⚪ 렉시컬 스코프 렉시컬 스코프 혹은 정적 스코프라고 한다. JS에서 지원하고 있는 환경이다. 렉시컬 스코프란 함수가 호출된 곳을 기준이 아닌, 함수가 선언된 곳을 기준으로 두는 것을 말한다. 반대로 동적 스코프란 함수가 호출된 곳을 기준으로 하는 것을 말한다. ⚫ 렉시컬 환경 함수 범위를 렉시컬 환경이라 한다. 렉시컬 환경의 구성요소에는, 환경레코드, 외부렉시컬 환경, 해당 함수 렉시컬 환경 이 있다. ⚪ 스코프 체인 함수 내에 변수가 없을 시, 상위 스코프에 변수를 찾아 나가는 현상을 말한다. 따라서 중첩 함수로 코드를 작성했을 경우, JS는 렉시컬 스코프 환경이기 때문에, 함수가 선언된 곳을 기준으로 스코프 체인이 일어난다. ⚪ 클로저 중첩 함수에서 함수가 종료되었음에도 불구하고, 렉시컬 스코프에 ..

옵셔널 체이닝을 공부하다가 예제를 보고 이해가 안되는 부분이 있어서 코드를 뜯어보았다. 분명 property를 반환하는 함수임에도 불구하고 계속 빈 객체를 반환하는 것이였다. 그래서 예제인 코드를 수정해서 검토해 본 결과, undefined를 인식하는 방법이 JS와 JSON에서 다르다는 것을 확인 할 수 있었다. ⚪ 예제 const rand = () => Math.random() rand() ? { prop1: rand() ? { prop2: rand() ? { prop3: rand() ? '성공!' : undefined } : undefined } : undefined } : undefined; const result = notSure(); cons..

옵셔널 체이닝 연산자 ?. 는 네트워크에 요청하여 어떠한 데이터가 들어올지 모르는 상황에서 사용한다. 만약, prop3라는 property를 들어올 것을 기대했는데 막상 들어온 데이터에는 prop3라는 property가 없는 상황에서 접근한다면 에러가 발생한다. const rand = () => Math.random() rand() ? { prop1: rand() ? { prop2: rand() ? { prop3: rand() ? '성공' : undefined } : undefined } : undefined } : undefined; const result = notSure(); console.log(JSON.stringify(result)); co..

에러에 대해 참고하기위해 블로그를 찾아보다보면 var로 작성한 코드가 종종 보였고, 그럴때마다 해당 포스팅은 거르고 봤었다. 왜냐하면 var는 JS의 초창기에 썼던 키워드이기 때문에 오래전에 포스팅 했던 글이라는 것이라는 걸 파악할 수 있기 때문이다. var대신 현재 변수를 선언할 때 let과 const 상수를 사용하는데, 이는 var의 문제점을 발견하고 만들어냈기 때문이다. 공식 문서를 보아도 var를 쓰는 것을 지양한다는 문구를 확인 할 수 있다. 현재 쓰지 않음에도 불구하고, var에 대해 공부하는 이유는 1. 예전에 쓴 코드를 해석 할 때 필요하다. 2. 면접 시 var과 let, const의 차이에 대한 질문이 빈번히 나온다. ⚪ 선언 없이 사용 가능 var로 선언을 하지 않고 초기화를 설정하더..

에러타입에는 SyntaxError, TypeError, ReferenceError, RangeError 종류가 있다. 이 에러는 컴퓨터가 에러타입을 인지하여 해당 생성자함수를 통해 인스턴스를 만든다. 따라서, 인스턴스의 종류에 따라 표식, name, message를 새롭게 지정 해 줄 수 있다. const errorFuncs = [ () => {(3).split('');}, () => {hello();}, () => {(123.456).toFixed(-1);} ]; errorFuncs.forEach(func => { try{ func(); } catch (e) { if (e.name = TypeError) { console.error('자료형을 확인하세요.', e); return; } if (e inst..

에러에는 name 앞에 붙는 표시, name, message, casue를 지정 할 수 있다. ⚪ 표식 바꾸기 name 앞에 붙는 표식은 Error의 인스턴스를 만들 때 프로퍼티로 들어가지 않는다. try...catch문에서 첫번 째 인자로 표식을 줄 수 있다. 직접 Error 생성자 함수를 통해 인스턴스를 만들 때는 표식을 지정 할 수 없다. ⚪ name 바꾸기 Error객체의 name의 default는 Error이다. 이 name은 Error의 static property로서 들어가 있다. 또한, Error Type에 따른 static property도 지정이 되어있어, 해당 Type의 에러가 발생 했을 경우, 이름이 Type으로 바뀐다. 이는 class에서 배웠듯이 부모 class가 static을 ..

⚪ error 핸들링 하는 방법 (try ... catch) error가 날 것 같은 문단을 try문으로 감싼다. error가 나지 않을 시에는 try문은 정상적으로 실행된다. error가 난 객체를 catch문 인자로 전달해서 해결할 코드를 catch문에 적는다. 💡catch로 전달된 에러는 타입의 종류에 따라 Error 생성자 함수의 종속된 에러타입의 인스턴스의 객체이다. catch문에서 생성된 에러의 정보를 전달 함으로써 확인 할 수 있다. ⭐ console.error(인자) 보통 에러를 확인 하기 위해 console.error메서드를 사용한다. error의 첫번 째 인자는 name 앞에 붙이는 표식을 작성 할 수 있다. name은 에러타입에 맞게 default로 설정되어 있다. 두번 째 인자는 보..

에러 핸들링의 중요성 JS에서 에러 핸들링은 중요하다. 이유는 인터프리터 언어이기 때문에, 사용자에게 배포 후 에러가 발생하면 큰 사고가 터지기 때문이다. 그래서 그 전에 개발자가 알아볼 수 있게 에러를 확인하고 처리를 하거나, 에러가 발생하지 않는 어떠한 상황에서 에러를 고의로 발생시켜 해당 상황이 나왔을 경우 해결방안을 설정 할 수 있다. ⚪ Error객체 에러가 났을 경우 생기는 객체가 Error의 객체이다. 컴퓨터 상으로 에러라고 인식하지 못하지만, 개발자가 에러로 인식하는 상황을 지정해서, Error임을 명시 할 수 있다. ⚪ Error타입과 Error타입의 인스턴스 기본 Error을 통해 만든 인스턴스 이외에 컴퓨터가 인식하는 Error에는 종류가 있다. 인식한 Error의 객체는, Error..

generator은 iterable의 대체 기능이며 사용하기 더욱 간편하다, 이유는, iterable을 생성할 때는, iterable protocol에 맞춰 일일이 작성을 해 줘야 하는데, generator는 알아서 다 가지고 있기 때문이다. iterable을 생성 할 때에는, iterable protocol을 준수한 [Symbol.iterator] 함수를 가지고 있으면 된다. 반면에 generator은 자체가 함수이며, yield 자체가 [Symbol.iterator]을 가지고 있기 때문에 generator을 실행하기 위해 첫 함수 호출이 필수이다. const iterable = { [Symbol.iterator] () { return { next() { return {value: , done: } }..

iterable은 요소를 순회하거나, 스프레드를 통해 얕은 복사를 하고, 디스트럭쳐링을 할 수 있기 때문에 유용한 타입이다. 메서드를 통해 이터러블 타입으로 변경을 할 수 있지만, 직접 이터러블의 객체를 만들 수 있다. 이터러블을 만들기 위해선 이터러블 규약을 지켜서 작성 해 주면 된다. ⚪ 이터러블 규약(iterable protocol) Array, String, Set, Map을 살펴보면, 내부에 [Symbol.iterator]함수가 있다. 이 함수는, 객체를 반환하는데, next() 라는 함수를 가지고 있다. next함수는 객체를 반환하는데, 반환된 객체는 value, done의 프로퍼티를 가지고 있다. ⭐ [Symbol.iterator] () : 객체반환(iterator 라고 부름) 객체(iter..