기린의 기록을 위한 공간

[JavaScript]문자 숫자 관련 함수 / 형변환 / 연산자 본문

Programming/JavaScript

[JavaScript]문자 숫자 관련 함수 / 형변환 / 연산자

girin code 2020. 2. 12. 19:49

[String 내장함수]

 <input id="length" type="text">

    <button onclick ="checkLength();">문자입력체크</button>

    <span id="result"></span>


//toUpperCase() 전부대문자로 , toLowerCAse() 전부소문자로

    var str = "Hello World How are You";

    console.log(str.toUpperCase(),str.toLowerCase());


    //문자열이 길이아는법 : legnth

    console.log("문자열 길이 : "+str.legnth);

    

    //값을 입력받았는지 확인할때 사용 2가지방법

    //trim() -> 공백을 삭제 해주는 함수

    function checkLength(){

        var val = document.getElementById("length").value;

        var re=document.getElementById("result");

        if(val.trim().length>0){ //trim() 함수 쓰면 공백써도 문자로 인식안함

           // alert('입력됨');

           re.innerHTML="<h4>정상적으로 입력함</h4>";

           re.style.color="green";

        }else{

            //alert("입력하세요");

            re.innerHTML="<h4>입력해야합니다.</h4>";

            re.style.color="red";

        }

    }




//특정문자열의 위치를 찾는 함수 : indexOf()/lastIndexOf

    //앞에서부터 세서 위치를 찾아줌

    console.log(str.indexOf('a'));

    //뒤에서부터 세서 위치를 찾아줌

    console.log("lastIndexOf : "+str.lastIndexOf("H"));


    //특정 한개문자만 출력하는 함수 : charAt()

    console.log("charAt : " + str.charAt(10));


    //특정 문자만 잘라내기 : substring()

    console.log("substring : " + str.substring(0,4)); //0~3번인덱스까지 잘라줌

    //a부터 e까지 문자 잘라내기 (+1을 해줘야함)

    console.log(str.substring(str.indexOf("a"),str.lastIndexOf("e")+1));


    //특정 문자열 포함여부를 확인 : includes()

    var str3 = '문자열';

    console.log(str3.includes("열")); //true


    //문자열을 특정기호를 기준으로 배열로 변환 : split()

    var hobby = "게임 코딩 취미";

    var arr2 = hobby.split(" ");

    console.log(arr2+" : " +typeof(arr2));

    console.log(arr2[0]); //게임



[숫자 관련 함수]

//숫자관련 함수 Math객체에 선언되어 있음

    //Math : 자바에 있는것이랑 비슷 소수점처리, 랜덤값처리

    var num = 100;

    var num2 = -100;

    console.log(Math.abs(num),Math.abs(num2));


    //소수점을 처리하는 함수 : round()반올림, ceil()올림, floor()내림

    var num3 = 123.456;

    console.log(num3,Math.round(num3),Math.ceil(num3),Math.floor(num3));


    //random처리 : 0~1 랜덤값이 출력 / 랜덤값에 *10을하고 내림처리

    console.log(Math.random(),Math.ceil(Math.random()*10));


    //max() / min() : 매개변수로 들어온 값중 큰값, 작은값 출력

    console.log(Math.max(1,2,3,4,5,6));

    console.log(Math.min(1,2,3,4,5,6));


    var arrInt=[10,4,20,5,4,3,8,60,3];

    console.log(Math.max(...arrInt));//ecma6 ...을이용해서 변수를 불러오면 배열에 있는 값을 알아서 다불러옴



[형변환]

    var num4=100; 

    //숫자 -> 문자

    console.log(num4+":"+typeof(num4),String(num4)+":"+typeof(String(num4)));

    console.log(typeof(""+num4)); //문자열인 ""을더해주면 string이 됨


    //문자 -> 숫자 ( + 뻬고 - / % 등등하면 숫자로바뀜)

    var str4 = "400달러";

    var str5 = "500";

    var num5 = 3;

    //parseInt() / parseFloat()함수를 이용해서 형변환이 가능

    var calc = parseInt(str4)-num5;

    //기본숫자 형변환 : Number()사용

    calc = Number(str5)+3

    console.log(calc+":"+typeof(calc));

    </script>



[연산자]

    <script>

        //=== !== 연산만 확인 나머지는 다똑같음

        var str6 = "200";

        var num7 = 200;

        var str7="200";

        var num8="300";

        var str8="300";

        console.log(str6==num7);

        console.log(str6===num7); //자료형이 다르므로 false (자료형까지 같은지 확인해주는)

        console.log(str6===str7);


        //부정연산

        console.log(str6!=num7);

        console.log(str6!=num8);

        console.log(str6!==num7);//값은 같지만 자료형이 다르므로 true

        console.log(str6!==str7);


        //삼항연산

        str6>300?document.getElementById("length").value=str6

                :document.getElementById("result").innerHTML=str6;   

    </script>

'Programming > JavaScript' 카테고리의 다른 글

[JavaScript]배열  (0) 2020.02.12
[JavaScript] 조건문  (0) 2020.02.12
[JavaScript]변수의 자료형  (0) 2020.02.12
[JavaScript] 변수  (0) 2020.02.12
[JavaScript]태그에 접근하는 방법  (0) 2020.02.12
Comments