javascript - 배열(Array) 객체 정리 (속성 및 메소드)

최재원·2022년 3월 10일
0
post-thumbnail

배열

  • 여러 객체(Entity)값을 순차적으로 나열한 자료구조(알고리즘 내 사용 빈도 多)
  • 배열 내 값을 요소(element)라고 하며, 배열 요소는 index로 접근

대표 속성(property)과 메서드(method)

  • 배열 크기 및 배열 여부 확인 : Array.length(), Array.isArray()
  • 배열 추가, 삭제 : Array.push(), Array.pop(), Array.unshift(), Array.shift(), Array.slice(), Array.splice()
  • 배열 탐색 : Array.indexOf(), Array.lastindexOf(), Array.includes()
  • 배열 변형 : Array.sort(), Array.reverse(), Array.join()


Array.length()

배열의 길이를 반환

<script>
let arr = [ 1, 2, 3, 4 ];
console.log( arr.length ); // 4
</script>

Array.isArray()

인자가 Array인지 판별합니다. Array이면 true, 아니면 false를 반환

<script>
arr.isArray([1, 2, 3]);  // true
arr.isArray({foo: 123}); // false
arr.isArray('foobar');   // false
arr.isArray(undefined);  // false
</script>

Array.push()

배열 뒷부분에 요소 삽입

<script>
let arr = [ 1, 2, 3, 4 ];
arr.push( 5 );
console.log( arr ); // [ 1, 2, 3, 4, 5 ]
</script>

Array.pop()

배열 뒷부분의 요소를 제거

<script>
let arr = [ 1, 2, 3, 4 ];
arr.pop();
console.log( arr ); // [ 1, 2, 3]
</script>

Array.unshift()

배열 앞부분에 요소를 추가

<script>
let arr = [ 1, 2, 3, 4 ];
arr.unshift(0);
console.log( arr ); // [ 0, 1, 2, 3, 4]
</script>

Array.shift()

배열 앞부분의 요소를 제거

<script>
let arr = [ 1, 2, 3, 4 ];
arr.shift();
console.log( arr ); // [ 2, 3, 4]
</script>

Array.slice()

배열의 일부분을 잘라 반환한다. 원본 배열은 바뀌지 않습니다.

<script>
let arr = [ 1, 2, 3, 4, 5 ];
console.log(arr.slice(2)); //  [3, 4, 5]
console.log(arr.slice(3)); // [4, 5]
console.log(arr.slice(1,3)); // [2, 3]
console.log(arr.slice(2,4)); // [3, 4]
console.log(arr.slice(-3)); // [3, 4, 5]
console.log( arr ); // [ 1, 2, 3, 4, 5]
</script>

Array.splice()

배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경한다.

<script>

- 배열 요소 추가하기
let arr = [0,1,2,3];

// 배열 2번째 위치한곳에 숫자 5를 추가한다.
arr.splice(2,0,5); // [0, 1, 5, 2, 3]

// 배열 2번째 위치한곳에 숫자 5,7을 추가한다.
arr.splice(2,0,5,7); //[0, 1, 5, 7, 2, 3]



- 배열 요소 제거하기
let arr = [0,1,2,3];

// 배열 1번째 부터 1개를 제거한다.
arr.splice(1,1); // [0, 2, 3]

// 배열 1번째 부터 2개를 제거한다.
arr.splice(1,2); //[0, 3]
 
 

- 배열 요소 교체하기
let arr = [0,1,2,3];

// 배열 1번째부터 1개를 제거하고 숫자 5로 추가한다.
let.splice(1,1,5); // [0, 5, 2, 3]

// 배열 1번째부터 2개를 제거하고 숫자 5로 추가한다.
let.splice(1,2,5); //[0, 5, 3]
 
 

- 배열 요소 추출하기
let arr = [0,1,2,3];

// 배열 1번째 부터 1개를 제거한다.
let remove = mine.splice(1,1); // [1]

// 배열 1번째 부터 2개를 제거한다.
let remove = mine.splice(1,2); //[1, 2]

</script>

Array.indexOf()

배열에서 지정된 요소를 찾을 수 있는 첫 번째 인덱스를 반환하고 존재하지 않으면 -1을 반환합니다.

<script>
let arr = [1, 2, 3, 4, 5]
console.log(arr.indexOf(2)); // 2
console.log(arr.indexOf(4)); // 3
</script>

Array.lastIndexOf()

배열에서 지정된 요소를 찾을 수 있는 뒤에서부터 첫 번째 인덱스를 반환하고 존재하지 않으면 -1을 반환합니다.

<script>
let arr = [1, 2, 3, 4, 5]
console.log(arr.lastIndexOf(4)); // 3
console.log(arr.lastIndexOf(6)); // -1
console.log(arr.lastIndexOf(1, -1)); // 0 , index -1의 위치부터 앞으로 탐색한다.
</script>

Array.includes()

배열이 특정 요소를 포함하고 있는지 판별합니다. 포함 하고있으면 true,
그렇지 않으면 false를 반환

<script>
let arr = [1, 2, 3, 4, 5]
console.log(arr.includes(0)); // false
console.log(arr.includes(1)); // true
console.log(arr.includes(5)); // true
</script>

Array.sort()

배열의 원소를 알파벳순으로, 또는 지정된 함수에 따른 순서로 정렬한다. 모든 원소를 문자열로 취급해 사전적으로 정렬

<script>
let arr1 = [ 13, 12, 11, 10, 5, 3, 2, 1 ];
arr1.sort();
console.log( arr1 ); // [ 1, 10, 11, 12, 13, 2, 3, 5 ];

// sort에 함수로 정렬
let arr2 = [ 13, 12, 11, 10, 5, 3, 2, 1 ];
arr.sort2( function( a, b ) {
  return a - b;
})
console.log( arr2 ); // [ 1, 2, 3, 5, 10, 11, 12, 13 ]
</script>

Array.reverse()

배열의 순서를 반전합니다.

<script>
let arr1 = [ 13, 12, 11, 10, 5, 3, 2, 1 ];
arr1.reverse();
console.log( arr1 ); // [ 1, 2, 3, 5, 10, 11, 12, 13];

// sort에 함수로 정렬(역순)
let arr2 = [ 13, 12, 11, 10, 5, 3, 2, 1 ];
arr2.sort( function( a, b ) {
  return b - a;
})
console.log( arr2 ); // [ 13, 12, 11, 10, 5, 3, 2, 1 ]
</script>

Array.join()

배열의 모든 요소를 연결해 하나의 문자열로 만든다.

<script>
const arr = ['바람', '비', '물'];

console.log(arr.join()); // 바람,비,물

console.log(arr.join('')); // 바람비물

console.log(arr.join('-')); // 바람-비-물
</script>
profile
https://github.com/jaewon1676

0개의 댓글