| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | 6 | |
| 7 | 8 | 9 | 10 | 11 | 12 | 13 |
| 14 | 15 | 16 | 17 | 18 | 19 | 20 |
| 21 | 22 | 23 | 24 | 25 | 26 | 27 |
| 28 | 29 | 30 |
- MySQL
- 신한은행청년희망적금
- 자바문자열연결
- Eclipse
- 자바기초
- 청년적금
- 공부
- 청년희망적금미리보기
- 자바스크립트배열
- Java
- 자바강의노트
- equals()
- 자바공부
- mysql오류
- if문
- 자바배열
- 저축장려금
- apachetomcat
- 이클립스
- 2022청년희망적금
- 자바
- insert
- 자바스크립트
- 개발공부
- 참조변수
- 배열함수
- ToString()
- 청년희망적금
- StringBuffer
- 이클립스설치
- Today
- Total
eterno
[JavaScript] 배열 객체 메서드(reverse(), sort(), splice(), pop(), shift(), push(), unshift(), join(), slice(), concat(), toString()) 본문
[JavaScript] 배열 객체 메서드(reverse(), sort(), splice(), pop(), shift(), push(), unshift(), join(), slice(), concat(), toString())
영원한별똥별 2023. 3. 5. 13:09
배열객체에서 사용할 수 있는 메서드
* 원본 배열을 변경하는 메서드(메서드를 사용한 후에 원본을 출력하면 변환된 값으로 출력됨)
: reverse(), sort(), splice(), pop(), shift(), push(), unshift()
* 원본배열을 변경하지 않고 참조하는 메서드
: join(), slice(), concat(), toString()
원본 배열을 변경하는 메서드
resverse()
: 배열 객체의 순서를 거꾸로 바꾼 후 반환
var arr = [1, 2, 3, 4];
document.write(arr); //1,2,3,4
document.write("<br>"); //한줄띄어쓰기
document.write(arr.reverse()); // 결과 : 4,3,2,1
* resverse() 메서드는 배열 원본 자체가 변경되기때문에 다시 arr()를 출력해도 4,3,2,1로 출력 됩니다.
sort()
: 배열 오름차순 정렬
var arr = [1, 2, 5, 0, 3, 4 ];
document.write(arr.sort()); //결과 : 0,1,2,3,4,5
splice()
: 인덱스 구간을 지정하고 해당 구간에 새로운 데이터 삽입
var arr = [1, 2, 3, 4 ];
//2번째 인덱스에서 2개의 값을 지우고 9, 8 을 추가
document.write(arr.splice(2, 2, "9", "8")); // 결과 : 3, 4
document.write("<br>");
document.write(arr); // 결과 : 1,2,9,8
* arr.splice()에서는 내가 지울 인덱스의 값이 출력되고 실제로 적용된 데이터는 arr에 담겨있습니다.
pop()
: 배열의 마지막 요소 반환
var arr = [1, 2, 3, 4 ];
document.write(arr.pop()); // 결과 : 4
shift()
: 배열의 첫번째 요소 반환
var arr = [1, 2, 3, 4 ];
document.write(arr.shift()); //결과 : 1
push()
: 배열의 마지막에 새로운 인덱스 추가
var arr = [1, 2, 3, 4 ];
document.write(arr.push("5")); // 결과 : 5
document.write("<br>");
document.write(arr); // 결과 : 1,2,3,4,5
* push()의 결과 값은 배열의 길이(length)가 반환됩니다.
unshift()
: 배열의 첫번쨰에 새로운 인덱스 추가
var arr = [1, 2, 3, 4 ];
document.write(arr.unshift(5)); // 결과 : 5
document.write("<br>");
document.write(arr); : 결과 : 5,1,2,3,4
원본배열을 변경하지 않고 참조하는 메서드
join()
: 배열 사이에 문자열을 추가하여 반환
var arr = [1, 2, 3, 4];
document.write(arr.join("-"));
//결과 : 1-2-3-4
slice(index1, index2)
: 배열 객체 에서 원하는 인덱스 데이터를 반환
var arr = [1, 2, 3, 4 ];
// 첫번째 인덱스에서 세번째 인덱스 이전값 반환(-> 1, 2번째 인덱스 요소 반환)
document.write(arr.slice(1, 3)); // 결과 : 2,3
//두번째 인덱스부터 마지막 인덱스까지 반환
document.write(arr.slice(2)); // 결과 : 3,4
concat()
: 배열 요소를 결합
var arr = [1, 2, 3, 4 ];
//배열 + 문자열
document.write(arr.concat("5"));
document.write("<br>");
//배열 + 배열
document.write(arr.concat([5, 6, 7]));
document.write("<br>");
//배열 + 문자열 + 배열
document.write(arr.concat("5", [6, 7]));
toString()
: 배열을 하나의 문자열로 반환
var arr = [1, 2, 3, 4 ];
document.write(arr); // 결과 : 1,2,3,4
document.write(typeof(arr)); //결과 : object
document.write("<br>");
document.write(arr.toString()); // 결과 : 1,2,3,4
document.write(typeof(arr.toString())); // 결과 : string
* typeof() 메서드는 객체의 데이터타입을 반환해주는 메서드
참고) http://www.tcpschool.com/javascript/js_standard_arrayMethod
Doit! 자바스크립트 + 제이쿼리입문
'JavaScript > 공부' 카테고리의 다른 글
| [jQuery] 제이쿼리 라이브러리 연동하기(다운로드 , CDN) (0) | 2023.03.11 |
|---|---|
| [JavaScript] 배열 객체 생성 (1) | 2023.03.05 |