JavaScript
배열 관련 함수
M_master
2019. 10. 4. 16:40
배열 선언 방법
var Array1 = [];
var Array2 = new Array();
console.log(Array1.length);
// 0
console.log(Array2.length);
// 0
배열에 데이터 추가 하기 ( unshift(), push() )
- 배열_이름.unshift(element1, element2, ..., elementN) : 배열의 맨 처음에 값을 추가
var Array1 = [];
Array1.unshift('javascript');
console.log(Array1);
// ["javascript"]
Array1.unshift('java');
console.log(Array1);
// ["java", "javascript"]
Array1.unshift('c++', 'PHP');
console.log(Array1);
// ["c++", "PHP", "java", "javascript"]
- 배열_이름.push(element1, element2, ..., elementN) : 배열의 맨 마지막에 값을 추가
var Array1 = [];
Array1.push('javascript');
console.log(Array1);
// ["javascript"]
Array1.push('java');
console.log(Array1);
// ["javascript", "java"]
Array1.push('c++', 'PHP');
console.log(Array1);
// ["javascript", "java", "c++", "PHP"]
배열에 있는 값을 제거하기 ( shift(), pop() )
- 배열_이름.shift() : 배열의 맨 처음 값을 제거
var Array1 = ["javascript", "java", "c++"];
Array1.shift();
console.log(Array1);
// ["java", "c++"]
- 배열_이름.pop() : 배열의 맨 마지막 값을 제거
var Array1 = ["javascript", "java", "c++"];
Array1.pop();
console.log(Array1);
// ["javascript", "java"]
배열에서 데이터 위치 찾기 ( indexOf() )
- 배열_이름.indexOf("찾을 값") : 찾을 값을 입력하면 배열의 위치를 반환
var Array1 = ["javascript", "java", "c++"];
console.log(Array1.indexOf("javascript"));
// 0
console.log(Array1.indexOf("java"));
// 1
console.log(Array1.indexOf("c++"));
// 2
만약에 배열에 없는 데이터를 입력하면 항상 -1을 return 합니다.
그러므로 -1이 출력된다면 해당 데이터가 배열에 존재하지 않는 다는 것을 알 수 있습니다.
var Array1 = ["javascript", "java", "c++"];
console.log(Array1.indexOf("c"));
// -1
console.log(Array1.indexOf("c#"));
// -1
두 개의 배열 합치기 ( concat() )
- 배열_이름.concat(string2, string3[,..., stringN]) : 문자열과 문자열을 합친 값을 리턴한다.
var Array1 = ["javascript", "java", "c++"];
var Array2 = new Array("c#", "Python");
var Array3 = new Array("PHP");
console.log(Array1);
// ["javascript", "java", "c++"]
console.log(Array2);
// ["c#", "Python"]
console.log(Array1.concat(Array2));
// ["javascript", "java", "c++", "c#", "Python"]
console.log(Array3);
// ["PHP"]
console.log(Array1.concat(Array2, Array3));
// ["javascript", "java", "c++", "c#", "Python", "PHP"]
배열에서 일부 데이터를 이용해 새 배열 만들기 ( slice() )
- 배열_이름.slice(start, end) : 배열의 원소 중 특정구간에 해당하는 것들을 추출
var Array1 = ["javascript", "java", "c++", "php"];
console.log(Array1);
// ["javascript", "java", "c++", "php"]
var Array2 = Array1.slice(1, 2);
console.log(Array2);
// ["java"]
console.log(Array1);
// ["javascript", "java", "c++", "php"]
console.log(Array1.slice(1));
// ["java", "c++", "php"]
console.log(Array1.slice(-2));
// ["c++", "php"]
// 인자가 음수인 경우 뒤에서 부터 카운팅
배열에서 일부를 지우고 새로운 데이터를 삽입 ( splice() )
- 배열_이름.splice(index, howmany, element1, ...., elementN) : 배열의 특정구간을 추출하거나, 특정구간에 특정 배열을 추가함
※ 주의사항 : slice와 다르게 기존의 배열의 데이터가 변경됩니다.
1. 배열의 일부를 지우거나 가져올 때
2. 배열의 중간에 한개의 데이터를 넣을 때
3. 배열의 일부를 지우고 새로운 데이터를 넣을 때(위 두가지를 동시에 하는 것)
// 1. 배열의 일부를 지우거나 가져올 때
var Array1 = ["javascript", "java", "c++", "php"];
console.log(Array1);
// ["javascript", "java", "c++", "php"]
console.log(Array1.splice(2)); // 시작점 2부터 배열의 마직막 원소까지를 대상
// ["c++", "php"]
console.log(Array1); // 원본 배열의 값이 수정된다.
// ["javascript", "java"]
var Array1 = ["javascript", "java", "c++", "php"];
console.log(Array1.splice(1, 3));
// ["java", "c++", "php"]
// 2. 배열의 중간에 여러개의 데이터를 넣을 때
var Array1 = ["javascript", "java", "c++", "php"];
Array1.splice(1, 0, '1', '2', '3');
console.log(Array1);
// ["javascript", "1", "2", "3", "java", "c++", "php"]
// 3. 배열의 일부를 지우고 새로운 데이터를 넣을 때(위 두가지를 동시에 하는 것)
var Array1 = ["javascript", "java", "c++", "php"];
Array1.splice(1, 2, '1', '2', '3');
console.log(Array1);
// ["javascript", "1", "2", "3", "php"]
728x90