[2022-08-18] TIL - 16일차

2022. 8. 18. 09:56ㆍGolfzon tech/TIL

😁 Today I Learned

  • javascript 
  • var , let , const

index.html

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="main.js"></script>
    <script>
        window.onload = function(){
            console.log("onload...");
        };

        var a = 10;
        // console.log(console.log(a)); // undefined
        console.log(a);
        console.log(typeof(a));
        console.log("=======");
        
        var a = 'aa'; // '' "" 둘다 스트링이다.
        console.log(a);
        console.log(typeof(a)); // string 타입
        console.log("=======");
        
        var a = 3.14;
        console.log(a);
        console.log(typeof(a)); // number 타입
        console.log("=======");
        
        var obj = null;
        console.log(obj);
        console.log(typeof(obj)); // object 타입
        console.log("=======");
        
        var arr = [];
        console.log(arr);
        console.log(typeof(arr)); // object 타입
        console.log("=======");

        var vo = {};
        console.log(vo);
        console.log(typeof(vo)); // object 타입
        console.log("=======");

        var fn = function(){}; // javascript 의 가장 최상위는 function 이다.
        console.log(fn);
        console.log(typeof(fn)); // object 타입
        console.log("=======");
        
        // 캐스팅
        var bool = true;
        console.log(String(bool));
        console.log(typeof(String(bool)));
        console.log("=======");
        
        console.log(typeof(Number("123")));
        console.log(typeof(Number(true)));
        console.log(typeof(Number("abc")));
        console.log(typeof(NaN));
        console.log(Number("abc"));
        console.log("=======");
        

        // 0만 아니면 그냥 참이다.
        console.log(Boolean("abc")); // 참
        console.log(Boolean("")); // 거짓
        console.log(Boolean("   ")); // 참    비어있지 않음.
        console.log(Boolean(null)); // 거짓
        console.log("=======");
        console.log(Boolean({})); // 참
        console.log(Boolean(0)); // 거짓
        console.log(Boolean(undefined)); // 거짓
        
        // 일단 var 를 붙여서 써라.. 전역변수랑 느낌이 다르다. 자바처럼 생각하지말고 var 를 붙이면 된다.
        
    </script>
</head>
<body>
    <h1>index page</h1>
</body>
</html>
  • typeof는 데이터 타입을 알 수 있다.
  • NaN 은 타입도 NaN이다.
  • Boolean 은 비어있지 않은 값이 오면 참이다. 

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        console.log("start...");
        var a = 10;
        var a = 100;
        console.log(a);

        // let은 var 처럼 동일한 이름으로 쓸 수 없다. 자바랑 똑같~
        let b = 20;
        b = 200;
        console.log(b);

        // 같은 변수 선언 불가.
        const c = 10; // 상수라 초기화를 해줘야한다.
        console.log(c);
        // c = 'lee'; // 수정불가. 상수니까 에러남.


        // var 표기가 없는 변수 선언가능.
        // var과 유사하지만 함수와 연관해서 주의해야한다.
        x = 111;
        console.log(x); 




    </script>
</head>
<body>
    <h1>Var let const</h1>
    
</body>
</html>
  • let과 const는 자바와 비슷하게 사용된다. (let 은 변수 하나만 선언 가능하며, const는 상수라 변경 불가하다.) 

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        console.log("start...");

        var a = 10;
        var a = 100;
        console.log(a);

        console.log("kor : " + kor); // 에러는 안난다.
        if(true){
            console.log("name : " + name);
            var kor = 99;
        }
        var name = "kim"; // 선언만 된다면 에러는 안난다.

        
        
        // let은 var 처럼 동일한 이름으로 쓸 수 없다. 자바랑 똑같~
        let b = 20;
        b = 200;
        console.log(b);

        
        if("kim"){
            console.log("hello : " + b);
            // console.log("eng : " + eng); // error
            let math = 77;
            console.log("math : " + math);
        }
        let eng = 88;
        // console.log("math : " + math); // error

        // 같은 변수 선언 불가.
        const c = 10; // 상수라 초기화를 해줘야한다.
        console.log(c);
        // c = 'lee'; // 수정불가. 상수니까 에러남.


        // var 표기가 없는 변수 선언가능.
        // var과 유사하지만 함수와 연관해서 주의해야한다.
        y = 111;
        
        if (true) {
            // console.log("x1 : " + x);
            console.log("y : " + y);
        }
        

        sleep(); // 선언 위에 호출해도 된다.
        function sleep() {
            x = 10; // 전역변수처럼 
            console.log("x2 : " + x);
        }
        sleep(); // 선언 위에 호출해도 된다.
        console.log(x);


    </script>
</head>
<body>
    <h1>Var let const</h1>
    
</body>
</html>

 

  • function을 선언하고 호출을 선언부 위에 해도 호출이 된다.
  • function 안에 타입 없이 자바의 지역변수처럼 사용하더라도 밖에서 변수를 사용할 수 있다. let은 안된다.
728x90
저작자표시

'Golfzon tech > TIL' 카테고리의 다른 글

[2022-08-22] TIL - 18일차  (0) 2022.08.22
[2022-08-19] TIL - 17일차  (0) 2022.08.20
[2022-08-17] TIL - 15일차  (0) 2022.08.17
[2022-08-16] TIL - 14일차  (0) 2022.08.16
[2022-08-12] TIL - 13일차  (0) 2022.08.16

관련글

티스토리툴바