개발공부블로그

고정 헤더 영역

글 제목

메뉴 레이어

개발공부블로그

메뉴 리스트

  • 홈
  • 태그
  • 방명록
  • 분류 전체보기 (21)
    • 개발공부 (21)
      • JavaScript (9)
      • EcmaScript6 (3)
      • Node.js (0)
      • C (3)
      • JSP Servlet (3)
      • Java (0)
      • OS (2)
      • SQL (0)
      • HTML CSS (1)
      • HTTP (0)

검색 레이어

개발공부블로그

검색 영역

컨텐츠 검색

인사이드자바스크립트

  • [JavaScript] 스코프 체인

    2019.09.11 by 임우찬

  • [JavaScript] 실행 컨텍스트(2)

    2019.09.11 by 임우찬

  • [JavaScript] 실행 컨텍스트(1)

    2019.09.11 by 임우찬

  • [JavaScript]함수와 프로토타입 체이닝(5)

    2019.09.11 by 임우찬

  • [JavaScript] 함수와 프로토타입 체이닝(4)

    2019.09.11 by 임우찬

  • [JavaScript] 함수와 프로토타입 체이닝(3)

    2019.09.11 by 임우찬

  • [JavaScript] 함수와 프로토타입 체이닝(2)

    2019.09.11 by 임우찬

  • [JavaScript] 함수와 프로토타입 체이닝(1)

    2019.09.11 by 임우찬

[JavaScript] 스코프 체인

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

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

[JavaScript] 실행 컨텍스트(2)

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

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

[JavaScript] 실행 컨텍스트(1)

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

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

[JavaScript]함수와 프로토타입 체이닝(5)

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

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

[JavaScript] 함수와 프로토타입 체이닝(4)

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

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

[JavaScript] 함수와 프로토타입 체이닝(3)

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

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

[JavaScript] 함수와 프로토타입 체이닝(2)

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

[JavaScript] 함수와 프로토타입 체이닝(1)

1. 객체란? 서로 연관된 함수와 변수를 그룹핑한 그릇으로, 객체 내의 변수를 property, 함수를 method라고 부른다. 2. 함수 표현식 방식 - 자바스크립트에서 함수는 일급객체로, 함수도 하나의 값처럼 취급한다. ​ * 일급 객체란? : 다음과 같은 조건을 만족할 때 일급 객체라고 말할 수 있다. 1. 변수나 데이터 구조 안에 담을 수 있다. 2. 파라미터로 전달 할 수 있다. 3. 반환 값(return value)로 사용할 수 있다. 4. 할당에 사용된 이름과 관계없이 고유한 구별이 가능하다. 5. 동적으로 프로퍼티 할당이 가능하다. 2-(1). 선언문 방식 ex) ​ 2-(2). 함수 표현식 ​ - 생성된 함수를 변수에 할당하여 함수를 생성하는 것을 "함수 표현식"이라고 한다. *(참고) ..

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

추가 정보

인기글

최신글

페이징

이전
1
다음
TISTORY
개발공부블로그 © Magazine Lab
페이스북 트위터 인스타그램 유투브 메일

티스토리툴바