[Javascript] 자바스크립트의 내장객체

자바스크립트의 내장객체로는Number Array Date String 가 대표적이다.

Number 객체

참고. Number 메서드

        var n = 10;

        // 💡 MAX_VALUE, MIN_VALUE : 최대값, 최소값
        console.log(Number.MAX_VALUE);
        console.log(Number.MIN_VALUE);

        // 💡 toString : 수치값을 문자열로 변경
        console.log(n.toString(), typeof n.toString()); // 10 string
        console.log(n.toString(2), n.toString(8), n.toString(16)); // 2진수 8진수 16진수 변경

        // 💡 toFixed() : 소수 부분 자릿수 반환
        var n2 = 15.6749;
        console.log(n2.toFixed()); // 16 (정수)
        console.log(n2.toFixed(2)); // 15.67 (소수점 2자리)

        // 💡 parseInt() : 문자열👉정수
        console.log(Number.parseInt("10") + 10); // 20

        // 💡 parseFloat() : 문자열👉실수
        console.log(Number.parseFloat("3.14") + 10); // 13.14

        // 💡 숫자인가?
        console.log( Number.isInteger(10), Number.isInteger("hello")); // true false

        // 💡 NaN인가?
        console.log("8.NaN인가?:", Number.isNaN(NaN), Number.isInteger("hello")); // true false

Array 객체

참고. Array 메서드

      var arr = [10, 20, 30];

        // 💡 length : 배열의 크기 반환
        console.log(arr.length); // 3

        // 💡 push() : 배열의 마지막 요소에 추가
        // 💡 pop() : 배열의 마지막 요소를 제거 후 리턴
        arr.push(40);
        arr.push(50, 60, 70);
        console.log(arr); // [10, 20, 30, 40, 50, 60, 70]

        arr.pop();
        arr.pop();
        console.log(arr); // [10, 20, 30, 40, 50]

        // 💡 shift() : 배열의 첫 번째 요소 제거
        // 💡 unshift() : 배열의 첫 번째 요소에 추가
        arr.shift(); // 10 제거 
        arr.unshift(0);

        // 💡 splice() 특정 위치에 삽입 및 삭제
        // splice(시작위치, 삭제 개수, 저장할 값, 저장할 값, ...)
        arr.splice(0, 0, 1, 2, 3); // 0번째 위치에 1,2,3 삽입
        arr.splice(3, 3); // 3번째 위치에서 3개 값 삭제
        arr.splice(1, 1, 900, 800); // 1번째 위치에서 1개 삭제 후 900, 800 삽입

        // 💡 reverse() :  배열의 요소 순서를 역순으로
        arr.reverse();

        // 💡 sort() : 배열 요소 정렬 ( 기본값: 사전식으로 정렬 )
        var arr = [16,25,8,75,91,17,9];
        arr.sort();
        console.log(arr.toString()); // 16,17,25,75,8,9,91
        
        // 오름차순 or 내림차순 👉  function 사용
        arr.sort(function(a,b){return a-b}); //오름차순
        console.log(arr.toString());  // 8,9,16,17,25,75,91

        arr.sort(function(a,b){return b-a}); //내림차순
        console.log(arr.toString());  // 91,75,25,17,16,9,8


        /***** 원본을 유지하는 메서드 *****/

        var arr = ["a", "b", "c"];

        // 💡 slice() : 요소의 특정 부분 반환
        // slice(시작위치, 종료위치) 시작 인덱스부터 종료 인덱스 바로 앞까지의 모든 배열요소 추출
        var tmp = arr.slice(0, 1);
        var arr2 = arr.slice(0, 2); // 새로운 배열로 반환도 가능
        console.log(tmp); // ['a']
        console.log(arr2); // ['a', 'b']

        // 💡 indexOf() : 특정 값의 위치 값 반환
        console.log(arr.indexOf('c')); // 2
        console.log(arr.indexOf('d')); // 없으면 -1 

        // 💡 split() : 
        var str = "사과/바나나/수박"
        var arr = str.split("/");
        console.log(arr); // ['사과', '바나나', '수박']

        // 💡 join() :
        var str = arr.join(" and ");
        console.log(str); // 사과 and 바나나 and 수박

        // 💡 fill : 배열채우기
        var arr = [6,2,8];
        arr.fill(100);
        console.log(arr); // [100, 100, 100]

        arr.fill(90,1,4);
        console.log(arr); // [100, 90, 90]

        // 💡 concat() : 배열의 요소 합치기
        var arr = [1, 2, 3];
        var arr2 = ['a', 'b', 'c'];

        var mix = arr.concat(arr2);
        console.log(mix); [1, 2, 3, 'a', 'b', 'c']

Date 객체

참고. Date 메서드

      var day = new Date(); 
      console.log(day); // Tue Jul 04 2023 13:20:39 GMT+0900 (한국 표준시)

      console.log("년도:", day.getFullYear());
      console.log("월:", day.getMonth() + 1); // 0~11 범위로 관리. 따라서 +1
      console.log("일:", day.getDate());
      console.log("시:", day.getHours());
      console.log("분:", day.getMinutes());
      console.log("초:", day.getSeconds());

      // 날짜변경
      var d2 = new Date();

      d2.setFullYear(2000);
      d2.setMonth(10);
      d2.setDate(6);

      console.log(d2); // 2000-10-6

  <script>
    window.onload = function() {
      setInterval(showTime, 1000);
    };
    function showTime() {
      var view = document.getElementById('view');
      var date = new Date();
      view.innerHTML = date.toLocaleTimeString();
    };
  </script>
</head>
<body>
  현재 시간 : <span id="view"></span>
</body>

현재 시간을 1초마다 업데이트

• toLocalTimeString() : 현재 날짜와 시간을 현지 시간(local time)으로 표시
• setInterval() : 현재시간을 업데이트

String 객체

참고. String 메서드

       var s = "hello";

        // 💡 length : 문자열의 길이 
        console.log(s.length);

        // 💡 charAt() : 특정 문자 추출
        console.log(s.charAt(2)); // 1

        // 💡 concat() : 문자열 연결 
        console.log(s.concat(" world", "!")); // hello world!

        // 💡 indexOf("찾을문자") : 특정 문자 위치추출
        console.log(s.indexOf('e'));
        //    indexOf('찾을문자', '시작위치');
        console.log(s.indexOf('e', 2)); // 없으면 -1

        // 💡 substring('시작위치', '종료위치'), substr('시작위치', '종료위치') : 부분 문자열 반환
        console.log(s.substring(0, 4)); // hell 
        console.log(s.substr(0, 3)); // hel

        // 💡 toUpperCase() , toLowerCase() : 대소문자 변환
        var s = "HeLLO WoRLD";
        console.log(s.toUpperCase());
        console.log(s.toLowerCase());

        // 💡 startsWith(), endsWith() : 지정된 문자열로 시작하는가? 마무리하는가? true false
        console.log(s.startsWith("He"), s.startsWith("x")); // true false
        console.log(s.endsWith("D"), s.endsWith("x")); // true false

        // 💡 replace(), replaceAll() : 문자 변경
        console.log(s.replace("L", "X")); // HeXLO WoRLD ( 처음 일치하는 문자만 변경 )
        console.log(s.replaceAll("L", "X")); // HeXXO WoRXD ( 일치하는 모든 문자 변경)

        // 💡 trim() : 공백 제거
        var s = "    Hello     "
        console.log(s.trim()); // Hello

        // 💡 split() : 문자 분리 후 배열로 반환
        var s = "사과/바나나/수박";
        var arr = s.split("/");
        console.log(arr); // ['사과', '바나나', '수박']

        var arr = s.split("/", 2);
        console.log(arr); // ['사과', '바나나']

        // 💡 includes(): 문자열 포함 여부
        console.log(s.includes("사과")); // true
        console.log(s.includes("딸기")); // false

        // 💡 repeat() : 반복
        var s = "hello";
        console.log( s.repeat(2)); // hellohello