Animated Rainbow Nyan Cat
본문 바로가기
javascript

join() / push() / pop()

by 이유나1 2022. 8. 11.
728x90
반응형

배열 객체

배열(array)은 같은 타입의 변수들로 이루어진 유한 집합으로 정의됩니다


join()

join 은 배열의 요서들을 연결하여 하나의 문자열로 만드는 함수이다. 배열의 길이가 0이면 빈 문자열을 반환하게 된다. 구분값이 존재하지 않으면 쉼표로 표기되어 연결되고 빈 문자열일 경우 구분없이 연결된다.

번호 기본값 메서드 리턴값
1 [100, 200, 300, 400, 500] length 5
2 [100, 200, 300, 400, 500] length 5
3 [1, 2, ['a', 'b']] length 3
const arrNum = [100, 200, 300, 400, 500];
//01
document.querySelector(".sample01_N1").innerHTML = "1";
document.querySelector(".sample01_Q1").innerHTML = "[100, 200, 300, 400, 500]";
document.querySelector(".sample01_M1").innerHTML = "length";
document.querySelector(".sample01_P1").innerHTML = arrNum.length;
const arrTxt = [a, b, c, d, e];
//02
document.querySelector(".sample01_N2").innerHTML = "2";
document.querySelector(".sample01_Q2").innerHTML = "[a, b, c, d, e]";
document.querySelector(".sample01_M2").innerHTML = "length";
document.querySelector(".sample01_P2").innerHTML = arrTxt.length;
const arr = [1, 2, ['a', 'b']];
//03
document.querySelector(".sample01_N2").innerHTML = "3";
document.querySelector(".sample01_Q2").innerHTML = "[1, 2, ['a', 'b']]";
document.querySelector(".sample01_M2").innerHTML = "length";
document.querySelector(".sample01_P2").innerHTML = arr.length;

push()

push() 메서드 는 Array(배열)의 마지막에 새로운 요서를 추가하고 난후 변경된 배열의 길이를 반환하는 함수이다.

번호 기본값 메서드 리턴값
1 [100, 200, 300, 400, 500] join() 100200300400500
2 [100, 200, 300, 400, 500] join('') 100200300400500
3 [1, 2, ['a', 'b']] join(' ') 100★200★300★400★500
4 [1, 2, ['a', 'b']] join('-') 100-200-300-400-500
const arrNum = [100, 200, 300, 400, 500];
const text1 = arrNum.join('');
const text2 = arrNum.join('');
const text3 = arrNum.join('★');
const text4 = arrNum.join('-');

pop()

pop() 메서드 는 배열의 마지막 요소를 제거한 후, 제거한 요소를 반환 한다.

번호 기본값 메서드 리턴값 결과값
1 [100, 200, 300, 400, 500] push(600) 6 100,200,300,400,500,600
2 [100, 200, 300, 400, 500] pop(600) 500 100,200,300,400
//01
const arrNum = [100, 200, 300, 400, 500];
const arrPush = arrNum.push(600);
document.querySelector(".sample03_N1").innerHTML = "1";
document.querySelector(".sample03_Q1").innerHTML = "[100, 200, 300, 400, 500]";
document.querySelector(".sample03_M1").innerHTML = "push(600)";
document.querySelector(".sample03_P1").innerHTML = arrPush; //6
document.querySelector(".sample03_A1").innerHTML = arrNum; //100,200,300,400,500,600
//02
const arrNum2 = [100, 200, 300, 400, 500];
const arrPush2 = arrNum2.pop();
document.querySelector(".sample03_N2").innerHTML = "2";
document.querySelector(".sample03_Q2").innerHTML = "[100, 200, 300, 400, 500]";
document.querySelector(".sample03_M2").innerHTML = "pop(600)";
document.querySelector(".sample03_P2").innerHTML = arrPush2; // 리턴값 500
document.querySelector(".sample03_A2").innerHTML = arrNum2; //100,200,300,400
728x90

'javascript' 카테고리의 다른 글

정규식 표현  (3) 2022.08.16
내장함수  (1) 2022.08.14
요소 선택  (7) 2022.08.05
전역변수와 지역변수  (4) 2022.07.29
함수  (5) 2022.07.26

댓글


/
/
/

CSS
광고준비중입니다.