[JavaScript] 함수 1_실행컨텍스트, 스코프

안녕하세요. 이제 막 기획자로 시작한 아기 기획자 소소한G 입니다.

비전공자 출신으로 IT 웹 기획자로서 살아남기 위해 일주일에 두번 프로트엔드 개발 수업을 듣고 있어요.

온전히 비전공자의 시선으로 꼼꼼하게, 원초적으로 설명드리려고 합니다.

저처럼 초보자 웰컴이에용.

 

자바 스크립트 시간으로 돌아왔어요.

오늘은 함수의 첫번째 공부시간 입니다. 

---

 

[함수를 사용하는 이유]

코드 뭉탱이를 재사용하기위해서 사용한다.

 

[함수의 구성요소]

 

>> 괄호안의 x,y를 매개변수라고 한다.

return 뒤에 오는 result를 반환값(return value)라 한다.

: return을 쓰면 함수가 끝나버리기 때문에

이 후에 console.log를 찍어도 값이 나오지 않는다.

 

 

return; 만 써도 undefined 값이 나오지 않는다.

 

 

 

 

 

그렇다면 어떤 상황에서 return만 사용할까?

 

* 반복되는 행위를 멈추는 것은 break

* 함수는 반복되는 것이 아니어서 멈추는 break를 사용하지 않고 return을 사용한다.

 

 

>>함수실행

 

 

>>여기서 괄호안에 넘겨준 2,3을 인수라 한다.

 

 

 

** 함수를 정의하는 것만으로는 함수가 실행되지 않는다.

: 함수내부의 코드를 실행하려면, 반드시 

함수를 호출해 주어야 한다.

 

 

---

[예외처리하기] - 안전한 코드 짜기

위 함수에서 x, y가 빈 값일 때,

안전한 코드를 짜기 위한 예외처리

위와 같은 방법을 사용하면 안전한 코드가 된다. 

모든 기능은 함수 단위로 빼야하고 그 기능은 안전한 코드가 되어야 한다. 

---

 

[Scope_범위,타깃]

*scope란 현재 실행되는 "환경" 이다.

함수, scope

전역, scope

 

scope는 항상 위의 두 개만 주어진다.

하나의 함수에 하나의 scope가 생긴다. 

 

**참고) for문안에 있는 var i = 0;은 지역변수가 아닌 전역변수이다.

 

JavaScript = "함수" 기반 언어이다. 즉, 함수를 많이 사용하는 언어이다.

"함수"란 '코드의 뭉탱이'라고 이해할 수 있다 = 코드를 가지고 있으며 많은 코드를 재사용하기 위한 도구

 

---

1. 함수가 실행되는 순서를 알아보자.

함수가 실행되는 순서

 

2. 함수가 실행되는 순서를 알아보자2.

함수의 법칙 : 함수가 실행되지 않으면 그 함수를 실행했던 전 함수로 돌아간다. 

 

** 자바스크립트에서 가장 중요한 개념 **

실행 컨텍스트 (execution context) : 함수를 실행했을 때 실질적으로 실행이 되는 영역

함수의 실행 순서 = 스택 (stack)

>> Last In First Out (LIFO)

     First In Last Out (FILO)

을 stack이라 한다. 

 

** Queue = First In First Out (FIFO)

 

- 함수 실행 시작은 브라켓 시작 부분부터 끝은 브라켓이 닫히는 부분까지 실행

 

함수를 실행하면 그 이름을 붙인 박스가 실행이 된다. 

 

 

빨간색 영역이 함수 실행 영역이다. 

= 실행 컨텍스트 (execution context)

 

 

 

---

<실행 컨텍스트 스택 (execution context stack)>

= 리스트로 나타나 있다.

 

 

 

 

 

 

 

 

 

 

 

 

 

**왜 실행 컨텍스트 스택이 필요한가?

가장 큰 장점은 scope:

 - stack의 맨 마지막에 있는 현재 실행되고 있는 것

 - 현재 실행되고 있는 함수 = foo1()

 - 현재 실행되도 있는 함수가 끝나면 지워지고 다음 
   함수가 실행된다. 

 

Scope Chain : 현재 스코프에서 과거스코프, 과거 스코스 이렇게 연결되어 있는 것 (Chain)

이전의 실행 콘텍스트를 불러오는 것을 scope chain이라 한다.

= 상위 실행 콘텍스트에서 가지고 오는 것

add5에서 add를 추가할 때 five라는 값을 가지고 올 수 있기 때문에 

five는 전역에서 가지고 온 것

five가 없다? 글로벌에서 가지고 온 것

 

현재 실행되고 있는 영역이 scope고 

현재 사용되고 있는 scope를 기반으로 스코프의 값이 없으면

상위 실행콘텍스트에서 가지고 오는 것이 scope chain이다.

add에서 add5로 넘어갈 때 return으로 넘어갈 때 8이란 값을 던져준다.

그러면 five의 값을 글로벌로 던져준다.