개발공부블로그

1. 스코프 체인이란? ​ - 실행컨텍스트 내용에서 스코프 정보에 대한 이야기를 했었다. ​ - 대강 다시 설명하자면, 실행 컨텍스트가 생성되면 js엔진은 해당 컨텍스트에서 실행에 필요한 여러가지 정보를 담은 "활성객체"라는 객체를 생성하는데, 이 활성 객체에 함수의 인자들을 유사 배열 형태로 담는 arguments라는 객체가 생성되고, 현재 컨텍스트의 유효범위를 나타내는 스코프 정보를 생성, 이후 변수생성과 this 바인딩을 한다고 하였다. ​ - 스코프 정보는 현재 실행중인 실행 컨텍스트 안에서 연결 리스트와 유사한 형식으로 만들어진다 하였는데, 이 리스트를 "스코프 체인"이라고 한다 하였다. [[scope]] 프로퍼티로 참조된다. ​ - 다시 설명하자면, 유효 범위를 나타내는 스코프가 [[scope..

개발공부/JavaScript 2019. 9. 11. 11:03

4. 스코프 정보 생성 ​ - 현재 컨텍스트의 유효범위를 나타내는 스코프 정보를 생성한다. - 이 스코프 정보는 현재 실행중인 실행 컨텍스트 안에서 연결 리스트와 유사한 형식으로 만들어진다. - 현재 컨텍스트에서 특정 변수로 접근해야 할 경우, 이 리스트를 활용한다. - 이 리스트에서 찾지 못한 변수는, 결국 정의되지 않은 변수에 접근하는 것으로 판단해 에러를 검출한다. - 이 리스트를 "스코프 체인"이라고 부른다 [[scope]]프로퍼티로 참조된다. - 여기서 현재 생성된 활성객체가 스코프 체인의 제일 앞에 추가된다. ​ * 스코프 정보생성을 그림으로 나타낸 것이다. ​ 5. 변수 생성 ​ - 현재 실행 컨텍스트 내부에서 사용되는 지역변수의 생성이 이루어진다. - 앞서 생성된 활성객체가 변수 객체로 사..

개발공부/JavaScript 2019. 9. 11. 10:59

1. 브라우저의 기본구조 ​ - 브라우저의 뜻은 다음과 같다. "인터넷상에서 웹에 연결시켜 주는 윈도 기반의 소프트웨어" 우리가 일반적으로 사용하는 크롬, 파이어폭스, 사파리, 엣지, 익스플로러등을 브라우저라고 부른다. ​ - 브라우저는 다음과 같이 구성되어 있다. ​ 1. 사용자 인터페이스 - 주소 표시줄, 이전/다음 버튼, 북마크 메뉴 등. 2. 브라우저 엔진 - 사용자 인터페이스와 렌더링 엔진 사이의 동작을 제어. 3. 렌더링 엔진 - 요청한 콘텐츠 표시. 예를 들어 HTML을 요청하면 HTML과 CSS를 파싱하여 화면에 표시함. 4. 통신 - HTTP 요청과 같은 네트워크 호출에 사용됨. 5. 자바스크립트 해석기(엔진) - 자바스크립트 코드를 해석하고 실행. 6. UI 백엔드 - 콤보 박스와 창 ..

개발공부/JavaScript 2019. 9. 11. 10:57

1. AJAX란? - AJAX(Asynchronous JavaScript And XML) 비동기 자바스크립트와 XML의 약자이다. - 그러나 사실 XML보다 주로 JSON을 많이 사용한다. - 비동기적으로 자바스크립트를 이용하여 서버와 통신하는 기술을 말한다. ​ - 자바스크립트를 이용하여 내부적으로 통신할 수 있는 방법으로, 사용자가 나중에 필요할 때 서버에서 가져갈 수 있도록 하는 것인데, 이는 곧 서버 입장에서 부담이 줄어든다. ​ ​ 2. 서버와 클라이언트 ​ - 클라이언트는 서비스/정보의 소비자. 즉, 사용자라고 생각하면 된다. - 서버는 서비스/정보의 제공자라고 생각하면 된다. - 이와 같이 클라이언트에서 서버에 어떤 정보를 요청했을 경우, 서버에서는 그 요청한 정보를 응답해준다. (여기서 말..

개발공부/JavaScript 2019. 9. 11. 10:54

* 프로토타입 객체도 객체이다. - 프로토타입 객체도 프로퍼티 추가 삭제가 가능하다. 이 말은 다시말해, 실시간으로 프로토타입 체이닝이 반영된다는 것이다. ​ 11. 프로토타입 메서드와 this 바인딩 - 프로토타입 객체가 가지는 메서드 : "프로토타입 메서드" 라고 부른다. - 객체의 메서드를 호출할 때 this바인딩과 동일하다. ​ -> * 객체의 메서드를 호출할 때 this 바인딩(앞 내용 다시) - 해당 메서드를 '호출'한 객체로 바인딩된다. (프로토타입 메서드도 동일하다는 말이다.) ​ ex) 생성자 함수 생성 -> (자동으로)프로토타입 객체 생성 -> 객체 'A' 생성 -> 프로토타입 객체에 메서드('this가 있음.') 추가. - > A객체에서 방금만든 메서드를 호출할 경우 this는 A에 ..

개발공부/JavaScript 2019. 9. 11. 10:51

*함수 리턴 규칙 1. 일반 함수나 메서드는 리턴값을 지정하지 않을 경우 undefined 값이 리턴된다. 2. 생성자 함수에서 리턴값을 지정하지 않을 경우 생성된 객체가 리턴된다. (예외상황1. 생성자함수에서 this로 바인딩되는 객체가 아닌 다른 객체에 리턴했을 때. => 그 다른 객체가 리턴된다.) (예외상황 2. 생성자 함수의 리턴값으로 넘긴 값이 객체가 아닌 boolean, 숫자, 문자열일때 => 이러한 리턴값 무시하고 this바인딩된 객체가 리턴된다.) ​ ​ 9. 프로토타입 체이닝 ​ - 자바스크립트는 객체지향 언어가 아닌 프로토타입 기반 객체지향 언어이다. - 따라서 자바스크립트는 클래스 개념이 없다. 이 때문에 객체 리터럴 또는 생성자 함수로 객체를 생성하는데, 이렇게 생성된 객체의 부모..

개발공부/JavaScript 2019. 9. 11. 10:50

*생성자 함수란? - 자바스크립트의 객체를 생성하는 역할을 한다. - C++ 이나 자바같은 객체지향 언어에서와 다르게 기존함수에 new연산자를 붙여 호출하면 해당 함수는 생성자 함수로 동작한다. - 이 이유 때문에 원치않는 생성자 함수로 동작할 수 있다. (이 때문에, JS 스타일 가이드에 따르면 특정 함수가 생성자 함수로 정의되어 있음을 알리기 위해 함수이름 첫 문자를 대문자로 쓰기를 권한다.) ​ 앞의 내용을 다시한번 정리해보자. * 객체란 : 서로 연관된 함수와 변수를 그룹핑한 그릇으로, 객체 내의 변수를 property 함수를 method라고 부른다. * 생성자란: 객체를 만드는 역할을 하는 함수다. * new를 생성자 앞에 붙일 경우, 객체를 생성하여 반환한다.(이러한 작업을 "초기화"라고 한다..

개발공부/JavaScript 2019. 9. 11. 10:47

7. 함수 호출 ​ 7-(1) arguments 객체 - 자바스크립트 언어 자체가 C/C++과 같은 엄격한 문법체크를 안한다. (함수 호출이 다른 언어와 달리 자유롭다) 예시) ​ 출력결과: func(); -> undefined, undefined func(1); -> 1, undefined func(1,2,3); -> 1,2 - 위 예시와 같이 인자를 어떻게 넘겨도 호출시 에러가 나지 않는다. - 이러한 특성 때문에 호출된 인자의 개수를 확인하고 이에 따라 동작을 다르게 해줘야 할 경우가 있는데, 이를 가능케 하는 것이 "arguments" 객체이다. - 따라서, 자바스크립트에서는 함수 호출 시 인수들과 암묵적으로 arguments 객체가 함수 내부로 전달된다. - 결론적으로, arguments 객체는..

개발공부/JavaScript 2019. 9. 11. 10:44