Notice
Recent Posts
Recent Comments
Link
250x250
«   2025/02   »
1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28
Tags
more
Archives
Today
Total
관리 메뉴

거인의 코딩일지

변수와 자료형 본문

코딩/JS

변수와 자료형

코딩거인 2023. 3. 4. 17:14
728x90
변수 선언 위치에 따른 구분!
  • JAVA
public class Student{
	// 자바에서 나눠지는 영역 3곳
     
    	//필드
    		//- class 에서 선언될 변수 선언된 곳
        	//- 멤버변수 선언
       		private String name; // = 인스턴스 변수
        	public static String schoolName; //= static 변수, class변수 
        
        //생성자
        
        //메소드
        	public void method(String name){
            	//매개변수(==파라미터)
                int num = 10; //= 지역변수
                
                if(num > 10){
                	int a = 20 //= if문에 한정된 지역변수
                }
            }
    
    
}
  • JavaScript
        //(js파일 / script 내부 라고 생각)
        var num1; // 전역 변수
        um2 = 200; // 전역 변수 (자바스크립트는 변수명 앞에 아무런 키워드 없으면 전역변수)

        function test(){
            var num3; // 지역변수
            num4; // 전역 변수(키워드가 없기 때문)
                //function이 끝나도 밖에서 호출하면 사용가능
            if(true){
                var num5 = 500; // 지역 변수
                        // 지역변수지만 if문을 벗어난 function까지 사용 가능
                num6; //전역변수
            }
        }

------------------------------------------------------------------------------

        var str ="JS 코드는 함수가 아닌 JS 파일 또는 script 태그 내부에 바로 작성시"
            +"HTML 랜더링 시 바로 수행된다.";

        console.log(str);

        var num1 = 100;
        num2 = 200;
        console.log(num1);
        console.log(num2);
        // 콘솔창에 별다른 지정 없어도 바로 나타난다.

        function test(){
            var num3 = 300;
            num4 = 400;
            console.log("함수 내부 num3 : " + num3);
            console.log("함수 내부 num4 : " + num4);
            // 호출하지 않으면 콘솔창에 나타나지 않는다.
            
            if(true){
                var num5 = 500;
                num6 = 600;
            }
            console.log("if문 종료 후 num5 : " + num5); // function 지역변수
            console.log("if문 종료 후 num6 : " + num6); // 전역변수
            // 둘다 콘솔창에 나타남!

}
// 호출
test();

// console.log(num3); // num3는 나타나지 않으나
console.log(num4); // 주석처리하면 num4는 콘솔창에 나타난다!
// **script 언어는 중간에 에러 발생 시 해석을 멈추기 때문

Java Script 의 변수 선언 방식!

Java Script는 변수 선언시 자료형이 아닌 var, let, const, (미작성) 중 하나를 골라서 작성한다

var : 변수, 변수명 중복 가능 중복이되면 덮어씌어지고 함수레벨 scope

let : 변수, 변수명 중복 불가, 블록{ }레벨 scope

const  : 상수, 변수명 중복 불가, 블록{ } 레벨 scope

자주 사용되는 순위는

const > let > var> 미작성 인데 미작성은 추천하지 않는다!


함수레벨scope 와 블록레벨scope 란?!

간단하게 표현하면

함수레벨스코프는 어디에 쓰나 전역변수가 선언되지만

블록레벨스코프는 함수에 넣으면 함수내에서만 사용하고

함수 밖에서 사용하면 전역변수로! 사용가능하다!!


Java Script의 자료형

JS는 변수 선언 시 별도의 자료형을 지정하지 않는다,(변수에 대입되는 값(리터럴)에 의해서 자료형이 결정됨)

  • string(문자열/ "abc", 'abc' 둘이 동일하다.)
  • number(숫자 / 100, 3.14, -5.2 등 정수와 실수 둘다 동일하게 number이다.)
  • boolean(논리값/ true, false)
  • object (객체 / 배열(Array), JS객체 {K : V, K : V})
    • Java 에서 Map와 비슷함!
  • function(함수)
  • undefined(자료형이 정의되지 않은 변수 > 값이 대입되지 않은 변수)
  • **null은 참조하는게 없음을 나타내는 리터럴 (자료형 X)
  • **typeof 변수명을 사용하면 해당 변수의 자료형을 반환하여 알 수 있다!

function에 대해서 알아보자!

function은 함수지만 두가지로 나눌수 있다

아래 코드를 보고 확인해 보자!

// function
    // 1) 변수명 == 함수명
    const fnSum = function(n1, n2){
        // 익명함수지만 fuSum 이름을 가지고 있다.
        return n1 + n2;
    }
    // 함수명만 작성하는 경우 -> 함수에 작성된 코드 자체가 반환
    typeBox.innerHTML += "<br><br>fnSum : "+ fnSum + "/" + typeof fnSum;
    
    //함수명(매개변수) == 함수 호출(함수 코드 수행됨)
    typeBox.innerHTML += "<br></br> fnSum(1,2) : " + fnSum(1,2);
    
    // 2) 함수를 매개변수로 전달하는 형태

    function plusFn(num, fn){
        return num + fn();
    }
    const result = plusFn(100, function(){
        return 30-10;
    })
	// result 안에 들어있는 함수의 리턴 값 즉! 30 - 10의 결과를 위의 plusfn에 넣어주면
    // plusFn 함수의 리턴값은 100 + 20 으로서 결과는 
    typeBox.innerHTML += "<br><br>result : "+ result;
    // 120 이 나오게 된다!

 

728x90