오답노트

[JS] 함수 실행과 컨텍스트 본문

Web

[JS] 함수 실행과 컨텍스트

권멋져 2022. 11. 7. 21:58

함수의 호출 과정

  1. 함수 실행 영역 (Execute Context Stack) 생성
  2. 매개변수, argments 변수 생성 및 초기화
  3. 선언적 함수
  4. var
  5. this
  6. 코드 실행

 

var msg = 'global'
function outer() {
	var msg = 'outter'
    console.log(msg)
    inner()
    
    function inner(){
    	var msg = 'inner'
        console.log(msg)
    }
outer()

//outter
//inner

 

스코프와 스코프 체인

스코프는 유효 범위로 우선적으로 자기 자신의 컨텍스트에서 먼저 변수를 찾는다. 만약 변수가 존재하지 않으면 상위 컨텍스트에서 변수를 찾아 사용한다.

 

스코프 체인은 해당 코드의 스코프 안에 있는 변수를 정의하는 객체의 체인이다.

 

var msg = 'global'
function outer() {

    console.log(msg)
    inner()
    
    function inner(){

        console.log(msg)
    }
outer()

//global
//global

 

클로저

함수와 함수의 변수가 해석되는 스코프를 아울러 클로저라고한다. 

 

# test.js

var calc = function(x,y){
	var res = x/y
    return util(res)
}

var util = function(num){
	return Math.round(num)
}
<!DOCTYPE html>
<html lang="">
    <head>
        <meta charset="utf-8">
        <title>03-22</title>
        <script type="text/javascript" src="test.js"></script>
        <script type="text/javascript">
            function util() {
                return "hello"; 
            }
        </script>
        <script type="text/javascript">
            var divresult = calc(100, 6);
            console.log(divresult);
        </script>
    </head>
    <body>
    </body>
</html>

 

결과는 hello이다.

'Web' 카테고리의 다른 글

[JS] 호이스팅 (Hoisting) 과 함수 매개변수  (0) 2022.11.07
[JS] JavaScript 타입과 변수  (0) 2022.11.07
'Web' Related Articles more