본문 바로가기
코딩 공부/JavaScript

[JS] 내장 객체

by 현장 2022. 10. 31.

날짜

날짜 정보를 가지고 오거나, 날짜 관련 작업이 필요할 때 쓰이며기본 날짜 정보를 사용자의 컴퓨터 기준으로 날짜 정보로 가지고 온다

구문 : var 변수명 = new Data();
//날짜 객체 선언하기
   var date = new Date(); //현제 날짜 정보를 가지고 온다.
   var date2 = new Date('2020-09-20'); //입력된 날짜을 객체화 시켜준다.
   var date3 = new Date(2020,8,17); //입력된 날짜을 객체화 시켜준다.
   var date4 = new Date('2020-09-15 12:00:00'); //입력된 날짜을 객체화 시켜준다.
   console.log(date);
   console.log(date2);
   console.log(date3);
   console.log(date4);

활용

// 선언된 날짜객체 연산 하기

var sumDate = date2 - date3;
var diff = sumDate / 24 / 60 / 60 / 1000;

/*
프로그램에서의 시간
1초 - 1000;
1분 - 1000 * 60
1시간 - 1000 * 60 * 60
하루 - 1000 * 60 * 60 * 24
*/
console.log(sumDate, 'date2 - date3', diff);

//메서드 활용하여 날짜 변경하기

var date5 = new Date();
console.log(date5.getFullYear(), '년도');
console.log(date5.getMonth() + 1, '월');
console.log(date5.getDate(), '일');
console.log(date5.getDay(), '요일');

date5.setDate(date5.getDate() + 35);

console.log('================================');
console.log(date5.getFullYear(), '년도');
console.log(date5.getMonth() + 1, '월');
console.log(date5.getDate(), '일');
console.log(date5.getDay(), '요일');

 


수학

최댓값, 반올림, 최솟값 등 산술 연산자로 구할 수 없는 값을 구할 수 있는 객체

 //절댓값 구하기
var n = -10;
var result = Math.abs(n);
console.log(result, 'abs');

//소숫점 반올림
var n2 = 10.55;
var result2 = Math.round(n2);
console.log(result2, 'round');

//소숫점 올림
var n3 = 11.1;
var result3 = Math.ceil(n3);
console.log(result3, 'ceil');

//소숫점 내림
var n4 = 11.9;
var result4 = Math.floor(n4);
console.log(result4, 'floor');

//소숫점 2번째 자리 반올림 
var n5 = 10.55;
var result5 = Math.round(n5 * 10) / 10;
console.log(result5, '2번째 자리 round');

배열

하나의 데이터 저장소를 쪼개서 데이터를 저장할 수 있는 객체이며 여러 개의 값을 순차적으로 나열한 자료구조입니다.

/* 배열 선언 */
var arr = [];
var arr = new Array();
//인덱스 - 배열에 저장된 데이타의 주소값이며, 처음 시작 0으로 시작한다.

고차함수 사용 불가능

- Array.isArray

전달된 인수가 배열이면 true, 배열이 아니면 false 를 반환

// true
Array.isArray([]);
Array.isArray([1]);  
Array.isArray(new Array());

// false  
Array.isArray();
Array.isArray({});
Array.isArray(null);
Array.isArray(undefined);

- Array.indexOf

원본 배열에서 인수로 전달된 요소를 검색하여 인덱스 반환

const arr = [1, 2, 2, 3];
arr.indexOf(2); // 1
arr.indexOf(4); // -1 , 검색 후 없을 시 -1 반환
// 두 번째 인수는 검색을 시작할 인덱스
arr.indexOf(2, 2); // 2

- Array.push

인수로 전달받은 모든 값을 원본 배열의 마지막 요소로 추가하고 변경된 length 프로퍼티 값을 반환

const arr = [1, 2, 3, 4];
const result = arr.push(5, 6);
console.log(result); // 6
console.log(arr); // [1, 2, 3, 4, 5, 6]

- Array.pop

원본 배열에서 마지막 요소를 제거하고 제거한 요소를 반환

const arr = [1, 2, 3];
let result = arr.pop();
console.log(result); // 3
console.log(arr); // [1, 2]

- Array.unshift

인수로 전달받은 모든 값을 원본 배열의 선두에 추가하고 length 프로퍼티 값을 반환

const arr = [1, 2];
let result = arr.unshift(3, 4);
console.log(result); // 4
console.log(arr); // [3, 4, 1, 2]

- Array.shift

원본 배열에서 마지막 요소를 제거하고 제거한 요소를 반환

const arr = [1, 2];
const result = arr.shift();
console.log(result); // 1
// 원본 배열을 직접 변경
console.log(arr); // [2]

- Array.concat

인수로 전달된 값들을 원본 배열의 마지막 요소로 추가한 새로운 배열을 반환

const arr1 = [1, 2];
const arr2 = [3, 4];
// 배열 arr2를 원본 배열 arr1의 마지막 요소로 추가하고 새로운 배열을 반환
let result = arr1.concat(arr2);
console.log(result); // [1, 2, 3, 4]

- Array.join

원본 배열의 모든 문자열로 변환한 후, 인수로 전달받은 구분자로 연결한 문자열을 반환

const arr = [1, 2, 3, 4];
// 기본 구분자는 콤마
arr.join(); // '1,2,3,4';
arr.join(''); // '1234';
arr.join(':'); // '1:2:3:4'

- Array.splice

원본 배열의 중간에 요소를 추가하거나 중간에 있는 요소를 제거하는 경우 사용

const arr = [1, 2, 3, 4];
// 원본 배열의 인덱스 1부터 2개의 요소를 제거하고     그 자리에 새로운 요소 30, 40을 삽입
// splice(시작인덱스, 제거할 요소수, 삽입할 요소)
const result1 = arr.splice(1, 2, 30, 40);
// 제거한 요소를 배열로 반환 
console.log(result1); // [2, 3]
console.log(arr); // [1, 30, 40, 4]

const arr = [1, 2, 3, 4];
// 원본 배열의 인덱스 1부터 0개의 요소를 제거하고     그 자리에 새로운 요소 10을 삽입
const result2 = arr.splice(1, 0, 10);
console.log(result2); // []
console.log(arr); // [1, 10, 2, 3, 4]

- Array.slice

인수로 전달된 범위의 요소들을 복사하여 배열로 반환

slice(복사할 시작 인덱스, 복사종료할 인덱스)
const arr = [1, 2, 3];
arr.slice(0, 1); // [1] 종료될 인덱스 미만(포함x)
arr.slice(1, 2); // [2] 종료될 인덱스 미만(포함x)
// 원본 배열은 바뀌지 않음
console.log(arr); // [1,2,3]

- Array.flat

인수로 전달한 깊이만큼 재귀적으로 배열을 평탄화, 원본 배열을 바꾸지 않음

const arr = [1, [2, [3, [4]]]];
// 인수 없음 기본 깊이 1로 지정하여 반환
arr.flat(); // [1, 2, [3, [4]]]
// 깊이 2로 지정
arr.flat(2); // [1, 2, 3, [4]]
// 모두 평탄화
arr.flat(Infinity); // [1, 2, 3, 4]

고차함수 사용가능

- Array.sort

배열의 요소를 정렬 (오름차순)

sort(function(a,b){return ;})
const points = [40, 100, 1, 5, 2, 25, 10];

// 숫자 배열의 오름차순 정렬, 비교 함수의 반환값이 0보다 작으면 a를 우선하여 정렬
// -1: 작은 수 부터 , +1: 큰 수 부터, 0: 정렬안함
points.sort((a, b) => a - b);
console.log(points); // [1, 2, 5, 10, 25, 40, 100]

// 숫자 배열의 내림차순 정렬
points.sort((a, b) => b - a);
console.log(points); // [100, 40, 25, 5, 2, 1]

const arr = ['가', '나', '마', '라', 'A'];
 
 // 문자열 오름차순 정렬
 arr.sort();
 console.log(arr); // ['A', '가', '나', '라', '마']
 
 // 문자열 내림차순 정렬
 arr.sort(function(a, b){
  return b > a ? 1 : a > b ? -1 : 0;
 });
 console.log(arr); // ['마', '라', '나', '가', 'A']

- Array.map

자신을 호출한 배열의 모든 요소를 순회하면서 인수로 전달받은 콜백 함수를 반복 호출, 콜백 함수의 반환 값들로 구성된 새로운 배열을 반환. 원본 배열 바꾸지 않음

var arr = ['가', '나', '다', 'A', '마'];
var result = arr.map(function(element){
                return element;
            });
result.push('B');
// 복사 대상 배열에 영향 없음(부수효과 없음)
console.log(arr); 
console.log(result);

- Array.filter

콜백 함수의 반환 값이 true인 요소로만 구성된 새로운 배열을 반환

const numbers = [1, 2, 3, 4, 5];
const odds = numbers.filter(function(num) {
               return num % 2 == 1;
           });

console.log(odds); // [1, 3, 5]

문자열

문자열을 생성하면 문자열 객체로 문자열 객체를 생성하면 문자열 메서드와 속성을 사용 가능합니다.

구문
var 변수명 = '문자열';
var 변수명 = new String('문자열');
//length - 문자열의 크기를 알 수 있다.
var str = '홍길동';
console.log(str.length, 'length');

//indexOf('찾을 문자열') 
//문자열 왼쪽부터 인수값에 해당되는 문자열을 찾아 인덱스값 반환
var str2 = '대한민국전라북도전주시';
console.log(str2.indexOf('대한민국'), 'indexOf');
console.log(str2.indexOf('홍길동'), 'indexOf'); //일치하는 문자열이 없다면 -1 값 반환

//lastIndexOf('찾을 문자열')
//문자열 오른쪽부터 인수값에 해당되는 문자열을 찾아 인덱스값 반환
//일치하는 문자열이 없다면 -1 값 반환
var str3 = '대한민국전라북도전주시';
console.log(str3.lastIndexOf('전라북도'), 'lastIndexOf');

//substring(인덱스, 인덱스)
//문자열을 첫번째 인수 인덱스값부터 두번째 인덱스값까지 문자열을 잘라 반환
var str4 = '대한민국전라북도전주시';
console.log(str4.substring(4, 8), 'substring')

//split('검색문자열')
//인수값에 해당되는 문자열 기준으로 문자열을 쪼개 배열로 반환
var str5 = '대한민국,전라북도,전주시';
console.log(str6.split(','), 'split');

//replace('검색문자열', '새로운 문자열')
//첫번째 인수값에 해당되는 문자열을 두번째 인수값을 치환
//검색된 처음 문자열만 치환
//전체 문자열 치환 원할 경우 정규식으로 활용
var str6 = '대한민국전라북도전주시';
console.log(str6.replace('전주시', ''), 'replace');
console.log(str6.replace(/전주시/g, ''), '정규식 replace');

//trim() 
//앞뒤 공백 제거
var str7 = '대한민국 전라북도 전주시';
console.log(str7.trim());

//모든 공백 제거(replace 활용 정규표현식을 사용하여 공백제거)
console.log(str7.replace(/ /g, ''));

'코딩 공부 > JavaScript' 카테고리의 다른 글

[JS] 예외처리  (0) 2022.11.01
[JS] 일급객체와 일급함수  (0) 2022.10.31
[JS] 함수  (0) 2022.10.20
[JS] 객체  (0) 2022.10.14
[JS] 배열  (0) 2022.10.13