자바스크립트7 [JS] 크롬 개발자 도구를 통해서 자바스크립트 디버깅하기 자바스크립트 디버깅 consol.log를 통해 어디까지 오류가 났는지 파악을 할 수도 있지만 한줄한줄의 실행과정을 따라가며 오류를 찾는 방식이 조금 더 정확할 수 밖에 없다. 오늘은 디버깅에 대해서 알아보자 ! 중단점(break point) 정하기 크롬에서 할때와 코드 내에 추가하는 방식으로 나뉜다. (1) - 크롬에서 중단점 정하기 위와 같이 간단한 html 코드가 있다. 위 코드를 디버깅하길 원한다면 원하는 라인을 클릭해 중단점으로 잡고 리로드를 해준다. 5번 코드를 중단점으로 잡고 새로고침해준다. 새로고침을 하면 보다시피 5번 이전 코드까지 실행이 된다. 5번의 'hi' 로그가 콘솔에 찍혀있지 않다. 이 상태에서 위 'step over next function call' 버튼을 클릭하면 다음 코드 .. 2022. 11. 25. 코어자바스크립트 6장<프로토타입> 1. 프로토타입의 개념 이해 클래스와 상속의 관계를 JS에선 프로토타입으로 대체하고 있다. 1-1) constructor, prototype, instance var instance = new Constructor(); 위 코드를 저 도식에 비유해보자 어떤 생성자 함수(Constructor)를 new 연산자와 함께 호출하면 Constructor에서 정의된 내용을 바탕으로 새로운 인스턴스가 생성된다. 이때 instance에는 __proto__라는 프로퍼티가 자동으로 부여되는데 이 프로퍼티는 Constructor의 prototype이라는 프로퍼티를 참조한다. prototype은 객체다. 당연히 __proto__도 객체다. prototype 내부에는 인스턴스가 사용할 메서드를 저장한다. 그러면 인스턴스에서도 .. 2022. 8. 18. 코어자바스크립트 5장<클로저> 1. 클로저의 의미 및 원리 이해 위 코드에서 outer 함수 내부에 a라는 변수와 inner함수가 들어가 있고, outer 함수는 inner함수의 결과값을 반환한다. 따라서 outer 함수의 실행컨텍스트가 종료되는 시점에선 변수 a를 참조하는 참조카운트가 0이 되고, 변수 a와 inner함수는 가비지 컬렉터의 수집 대상이 될 것이다.(참조 카운트가 0이므로) 이제 위 코드르 보자, 이번엔 inner 함수의 결과값이 아닌 inner 함수 자체를 반환하고 있다. 따라서 outer 함수의 실행 컨텍스트가 종료될때(8번줄) outer2 변수는 outer의 실행 결과인 inner 함수를 참조한다. 이후 outer2를 호출하면 앞서 반환된 inner 함수가 실행되게 된다. 그런데 outer 함수는 이미 실행이 종.. 2022. 8. 17. 코어자바스크립트 4장<콜백 함수> 1. 콜백 함수란? 1-1)콜백 함수란? 콜백 함수는 다른 코드의 인자로 넘겨주는 함수이다. 콜백 함수를 넘겨받은 코드는 이 콜백 함수를 필요에 따라 적절한 시점에 시행할 것이다. 콜백 함수는 다른 코드(함수 OR 메서드)에게 인자로 넘겨줌으로서 그 제어권도 함께 위임한 함수이다. 콜백 함수를 위임받은 코드는 자체적인 내부 로직에 의해 이 콜백 함수를 적절한 시점에 시행할 것이다. ※일상 생활에서의 예시 A와 B는 다음 날 아침 8시에 만나기로 하고 잠을 잔다. 늦어도 6시에는 일어나야 약속에 늦지 않는다 A는 매우 불안한 마음에 수시로 깨어 시계를 확인한다. 계속 잠을 설치다 결국 5시즈음 포기하고 일어난다 B는 알람시계를 세팅한다. 알람이 잘못될 염려는 없고 평소 알람에 잘 일어나므로 완전 꿀잠을 자.. 2022. 8. 14. 코어자바스크립트 3장<this> 1. 상황에 따라 달라지는 this 스크립트에서 this는 기본적으로 실행 컨텍스트가 생성될 때 함께 결정된다. 실행 컨텍스트는 함수를 호출할 때 생성되므로, 바꿔 말하면 this는 함수를 호출할 때 결정된다. 1-1) 전역 공간에서의 this 전역 공간에서 this는 전역 객체를 가리킨다. 전역 객체는 JS 런타임 환경에 따라 다른 이름과 정보를 가진다(브라우저=window, Node.js=global) ※전역변수를 선언하면 자바스크립트 엔진은 이를 전역객체의 프로퍼티로도 할당한다!? 전역공간에서 변수 a에 1을 할당하니 window.a(전역객체)와 this.a 모두 1로 출력된다. 이는 '전역변수를 선언하면 자바스크립트 엔진은 이를 전역객체의 프로퍼티로 할당한다'라는 공식 때문이다. 따라서 windo.. 2022. 8. 13. 이전 1 2 다음
