변수의 스코프, 브라우저 내장객체, 변수 호이스팅, 아규먼트(arguments), this, return, closure 클로저, each fnc, 이펙트-(animatem hide, show, fadeOut, fadeIn, slideUp, slideDown)

2019. 6. 25. 10:02jQuery

-------------------------------------변수의 스코프-------------------------------------

변수의 스코프
            - 변수의 접근범위를 지정하는 것이다.
            - 스코프의 종류
                        - 전역변수(Gloval Scope)
                                    function 밖에서 정의한 변수는 전역변수가 된다.
                                    function 안에서 변수를 정의할 때 var를 사용하지 않으면 전역변수가 된다.
                                    스크립트 코드 전체에서 접근할 수 있다.
                        - 지역변수(Local Scope)
                                    function 안에서 정의한 변수는 지역변수가 된다.



예시)
             // 전역변수 선언하기
            var username = "홍길동";
 
            function fn1() {
            // 지역변수 선언하기
                        var x = 10;
                        // var를 안쓰면 전역변수가 된다.
                        z = 30000;
                        var y = 20;

                        console.log(username); // 전역변수 사용하기
                        console.log(x, y); // 지역변수 사용하기
            }
 
            function fn2(){
                        var a = "서울특별시 종로구";
                        var b = "02-1234-5678";
 
                        console.log(username); // 전역변수 사용하기
                        console.log(a, b); // 지역변수 사용하기
                        console.log(z);
                        console.log(x, y); // 다른 함수에서 정의한 지역변수 사용하기
            }
 
            fn1();
            fn2();






브라우저 내장객체
            window
                        - 자바스크립트의 글로벌객체
                        - 나머지 내장객체(window를 제외한)를 전부 저장하고 있다.
                        - 스크립트내에서 선언되는 모든 글로벌 변수와 함수를 저장한다.
                        - window에 저장되면 글로벌 스코프를 가지고, 
                          스크립트의 오느 곳에서나 저장된 변수, 함수를 사용할 수 있다.
            document
            location
            history
            navigator
            screen





=========================변수 호이스팅 

hosting 
            - 자바스크립트의 기본동작이다.
            - 변수, 함수의 전언을 코드의 꼭대기로 이동시킨다.
            - "변수 끌어올리기"라고 부른다.
            - 자바스크립트에서는 변수호스팅 때문에 변수의
              변수의 스코프가 블록이 아니고, 함수단위로 관리된다.



예시) 변수 호이스팅 함수





=========================아규먼트 (arguments)

arguments
            모든 자바스크립트 함수에 기본으로 내장된 배열 객체 



예시) 아규먼츠 사용






===========================자바스크립트의 this()

자바스크립트의 this
            - 그 함수가 소속된 객체를 나타낸다.

            1. 함수안에서 this는 기본적으로 window객체다.
            2. 메소드안에서 this는 그 메소드가 소속된 객체다.
            3. call()을 사용한 경우 메소드안에서 this는 call(객체)의 매개변수로 전달된 객체다.




예시) this사용








=============================자바스크립트 return

자바스크립트의 함수는 다양한 반환값을 제공할 수 있다.
            1. 반환값이 명시되어있지 않는 경우 - undefined 반환
            2. 반환값으로 기본자요형값 반환 가능
            3. 반환값으로 객체 반환 가능
            4. 반환값으로 함수 반환 가능
            5. 반환값으로 제공받은 함수 실행 가능



예시) 자바스크립트의 return







============================자바스크립트의 closure

Closure(클로저)
            - parent 함수의 실행이 종료된 후에도
              parent 함수에서 정의된 변수에 엑세스할 수 있는 함수를 
              클로저라고 부른다.
            - 로컬변수를 private 변수처럼 동작하게 만들 수 있다.


예시) 





예시)







============================자바스크립트 each 및 fnc


예시) each사용하기







----------------------------------------자바스크립스 이펙스(effect)-------------------------------
            


예시) hide, show, fadeOut, fadeIn, slideUp, slideDown 사용하기






예시2) animate (애니메이터) 사용하기




예시3) animate (애니메이터) 사용하기