자바스크립트 변수

Javascript 2011. 12. 5. 21:01

아래는 자바스크립트 실행 시 변수 선언 및 정의에 대한 프로세스 입니다.


1. 자바스크립트 실행 시 모든 전역 변수(x, y)가 선언 됩니다.

- 여기서 실행 시 라는 의미는 x  전역변수 선언문인 "var x ;'" 까지 언어처리가
(인터프리터) 되지 않았을 경우를 의미 합니다. (코드 상 1 ~ 2 라인의 alert(x), alert(y)에 해당 합니다.)

2. "자바스크립트"는 선언만 되고 정의되지 않은 변수는 모두  "undefined" 를 참조
합니다.(즉, 아래 결과처럼 모두 "undefined" 를 출력합니다.)

  1. alert(x); // undefiend
  2. alert(y); // undefined
  3.  
  4. var x;
  5. alert(x); // undefiend
  6. var y;
  7. alert(y); // undefined
 



var 선언문 없이 선언된 암묵적 전역변수는 변수인가?


  1. alert(x); // undefiend
  2. alert(y); // undefined
  3. alert(z); // ?
  4.  
  5. var x;
  6. alert(x); // undefiend
  7. var y;
  8. alert(y); // undefined
  9. z;
  10. alert(z);


위 코드와 같이 총 3개의 전역변수(x, y, z)가 있습니다.

하지만 x, y 와는 다르게 z는 var 선언문이 없습니다.


이 같은 전역변수를 보통 [암묵적 변수] 라고 합니다.

그리고 이런 경우 3번라인의 alert(z);는 // 'z'가 정의되지 않았다는 에러가 발생합니다.


이유는 x, y 변수와는 달리 z는 var 선언문으로 선언되지 않았으며, 즉, 자바스크립트

실행시 미리 선언되지 않기 때문입니다.



위같은 에러를 피하기 위해서는 아래와 같이 코드를 작성해야 합니다.


  1. z = undefined;
  2. alert(z);

즉, 위와 같이 암묵적 변수에 접근하기 위해서는 변수에 값을 정의 후 접근해야 에러가

나지 않습니다.



그럼 "암묵적 변수"에 대한 더 자세한 내용을 알기 위해 다음 예제를 보시겠습니다.


  1. alert(x); // undefiend
  2. alert(y); // undefined
  3.  
  4. var x = 'x';
  5.  
  6. alert(x); // undefiend
  7. alert(window.x); // x
  8. alert(window['x']); // x
  9. alert(this.x); // x
  10.  
  11. var y = 'y';
  12. alert(y); // y
  13. alert(window.y); // y
  14. alert(window['y']); // y
  15. alert(this.y); // y
  16.  
  17.  
  18. z = 'z';
  19. alert(z); // z
  20. alert(window.z); // z
  21. alert(window['z']); // z
  22. alert(this.z); // z
  23.  
  24. delete x;
  25. delete y;
  26. delete z;
  27.  
  28. alert(typeof x); // string
  29. alert(typeof y); // string
  30. alert(typeof z); // undefined



위 코드와 같이 이번 예제에서는 x, y, z 모든 변수가, 전역객체의 프로퍼티로 접근이

가능 합니다.


하지만 25 ~ 27라인의 결과를 보십시오? 뭔가 이상하지 않으신가요?


분명, 21 ~ 23라인에서 delete 연산자로 x, y, z를 모두 제거 했지만

결과를 보면 z를 제외한 x, y 2개의 변수는 제거 되지 않았습니다.



이런 결과가 나오게된 이유는 몰까요?


먼저 delete 연산자의 정의를 살펴 보겠습니다. 

delete 연산자는 객체의 속성 혹은 배열변수의 요소를 제거하는데 사용된다.


즉, delete 연산자는 객체의 프로퍼티 및 배열변수를 제거하는 연산자 입니다.


x, y 변수도 전역 객체의 프로퍼티로 접근은 가능 하지만 엄밀히 말하자면 delete 연산자로

삭제 되지않기 때문에 객체(window)의 프로퍼티로는 볼 수 없습니다.


반대로 z는 일반 변수(x, y) 처럼 자바스크립트 실행 시 선언되지 않으며,

delete 연산자로 제거 되기 때문에 전역변수가 아닌 객체(window)의 프로퍼티로 봐야

합니다.



저작자표시
Posted by 전성균

Javascript new 단항 연산자의 객체 인스턴스 생성 프로세스

카테고리 없음 2011. 11. 24. 16:56 

function create_object(){

    var private_name = 'private';
    this.public_name = 'public';
}


var newObject = new create_object();

alert(newObject.private_name); //undefined
alert(newObject.public_name); //public

1. create_object 함수객체를 선언 및 정의한다.

2. create_object 함수객체안에 지역변수(private_name)와 해당 this의 프로퍼티(this.public_name)를 선언 정의한다.

3. 단항 연산자 new 뒤에 함수객체(create_object)가 오게되면 new는 어떤 객체(this)를 만들어 내부적으로 생성자(create_object)의 인수(arguments)로 넘겨준다.

- 여기서 생성자(create_object)란?

해당 함수객체(create_object)의 인스턴스를 new 연산자와 함께 구성하는 역활을 담당하기 때문에 기능상 의미로 생성자라 부른다.

create_object는 함수객체 이며 동시에 create_object는 클래스의 생성자 이기도 하다.

4. 첫번째 alert(newObject.private_name)의 결과가 undefined인 이유는 JS엔진은 create_object 클래스의 지역변수(private_name)는 class의 private와 같은 변수로써 생성자로 만들어진 인스턴스에서 접근할수없다.

5. 두번째 alert(newObject.private_name)의 결과가 'public'인 이유는 해당 지역변수(private_name)와는 다르게 생성자로 만들어진 인스턴스로 인해 접근가능하다.

저작자표시
Posted by 전성균

Javascript Statement

Javascript 2011. 11. 24. 15:09

Statement란? 단어뜻: [성명, 진술, 서술]


1. Expression Statement (표현문)

자바스크립트에서의 문장끝에 오는 ;(세미콜론[할당문])

2. Block Statement (복합문)

흔히 블록({})이라 불리는 이 복합문은 표현문의 집합입니다.
(이 블록은 하나의 문장처럼 사용되기 때문에 이 또한 문장입니다.)


  1. {
  2.     표현문;
  3. };
  4.  
  5.  
  6. {
  7.     var i = 0;
  8.     alert(i); // 0
  9.  
  10.     {
  11.         var i = 1;
  12.         alert(i);   // 1
  13.     }
  14.  
  15.     alert(i); // 1
  16. };


1. 바깥쪽 블록의 전역변수 i가 선언되고 안쪽 블록의 전역변수 i가 선언된다.

2. 바깥쪽 블록의 전역변수 i에 0이 정의되고 안쪽 블록의 전역변수 i에 1이 정의된다.

3. 안쪽 블록의 alert(i)는 1되고 바깥쪽 블록의 alert(i)도 1 된다.


  1. var i = 2;
  2. (function()
  3. {
  4.     alert(i); // undefined
  5.    
  6.     var i = 2; // 2
  7.     alert(i);
  8.  
  9.     if (true)
  10.     {
  11.         var i = 3;
  12.     }
  13.  
  14.     alert(i); // 3
  15.  
  16. })();


1. 전역변수 i가 선언되고 2가 정의된다.

2. 최초 alert(i)의 반환값이 "undefined" 가 나오는 이유는 "자바스크립트"의 유효범위는 Function 내부에서만 존재 하기 때문이며, 즉, 함수 내부 아래 지역변수로 i가 선언 되었기 때문입니다.

3. if문 내부에서 지역변수 i가 선언되고 3이 정의된다.

4. 마지막 alert(i)의 반환값이 "3"이 나오는 이유는 앞서 말했듯이 "자바스크립트"의
유효범위는 Function 내부에서만 존재 하기 때문입니다.



3. if, else, else if (조건문)


  1. if (true) {
  2. }
  3. else if (false) {
  4. }
  5. else{
  6. }
 

모든 if문 즉 조건문은 타 언어와 별반 다르지 않아 넘어간다.

  
  1. var is = true;
  2. switch (is){  
  3. case true :    
  4.     alert(true);      
  5.     break;
  6. case false :
  7.     alert(true);      
  8.     break;
  9. default :
  10.     alert(true);  
  11.     break;
  12. }


자바스크립트에서의 switch 비교문이 타 언어와 다른점은 비교값으로 정수 리터럴뿐만
아니라 모든 문자열이올수 있다.



4. while, do while


  1. var sum = 0;
  2. while ( sum < 100 ) {  
  3.     sum = sum + 1;
  4. }
  5.  
  6. alert(sum); // 100
  7.  
  8.  
  9. var sum = 0;
  10. do {  
  11.     sum = sum + 1;
  12. } while ( sum < 100 );
  13.  
  14. alert(sum); // 100


5. for, for in


  1. var length = 10;
  2. for (var i = length; i--;){
  3.     alert(i); // 9 8 7 6 5 4 3 2 1 0
  4. }
  5.  
  6. var arr = [1];
  7. for (var n in arr) {
  8.     alert(arr[n]); // 1  
  9. }
  10.  
  11.  
  12. for (var n in document.body.childNodes){
  13.     alert(n); // lenght 0
  14. }
label, break, continue


break :

  1. for (i = 0; i < 10; i++) {
  2.     // i의 값이 5가 되면 순환문을 빠져나간다.
  3.     if (i === 5) break;
  4. }
continue :

  1. for (i = 0; i < 10; ++i) {
  2.     // i가 2와 같다면 continue문을 만나 아래 표현식을 생략하고 다음 i부터 순회를 시작 합니다.
  3.     if (i == 2) continue;  
  4.     alert(i);
  5. }
label :


  1. outter:
  2. for (i = 0; i < 10; i++) {
  3.     inner:
  4.     for (k = 0; k < 10; k++){
  5.         if (k === 5) break outter;
  6.  
  7.         alert(i);
  8.     }
  9. }



1. 바깥쪽에 for문에 outter label를 배치하고 안쪽 for문에 inner label을 배치한다.



2. 안쪽 for문의 조건문 if 조건식이 true라면 바깥쪽 for문 label인 outter for문의 순회를 종료시킨다.



3. alert(i)는 0이 다섯번 찍히고 종료한다.

            





  





  



  





    
        
            저작자표시 
        
    


  




		

		

			Posted by 전성균
		


		

		

			

				
				
			

		


		

		

	


              
          

						
						
							

								prev 
									
									 1
									
									 ···
									
									 52
									
									 53
									
									 54
									
									 55
									
									 56
									
								next 

								
							

						
					


					


					

						openclose
					


					
					

				


				


				
			

		

	


  
티스토리툴바