[ JavaScript ] 배열 사용하기

정인성·2022년 5월 17일
0

JavaScript

목록 보기
18/28
post-thumbnail

배열에 엘리먼트(변수) 추가/삭제하기

기본적으로 배열의 앞과 뒤에서 엘리먼트를 추가하거나 삭제할 수 있음

  • . push(element) : 배열의 뒤에 엘리먼트 추가
  • . pop() : 배열의 뒤에서 엘리먼트 삭제하고 리턴
  • . shift() : 배열의 앞에서 엘리먼트 삭제하고 리턴
  • . unshift(element) : 배열의 앞에 엘리먼트 추가
  • . reverse() : 배열을 뒤집어 준다
  • . sort() : 배열의 오름차순으로 정렬시켜준다
  • . splice(지정값,삭제할요소,추가할요소) : 삭제할요소가 없으면 0
    • splice(3,0,'-') : 3번째 길이에 있는 배열에 삭제할껀 없고(0) '-'를 추가
  • slice(시작,끝) : 시작점부터 끝점-1 ( 끝점은 미포함 )
    • 끝점이 생략되면 시작점부터 배열의 끝까지를 자른다
  • join() : 배열에 값들이 문자열로 변환되어 나오는 함수
var a = ['바람', '비', '불'];
var myVar1 = a.join();      // myVar1에 '바람,비,불'을 대입
var myVar2 = a.join(', ');  // myVar2에 '바람, 비, 불'을 대입
var myVar3 = a.join(' + '); // myVar3에 '바람 + 비 + 불'을 대입
var myVar4 = a.join('');    // myVar4에 '바람비불'을 대입

배열 붙이기, 검색하기

  • arr1.concat(arr2) : arr1과 arr2 붙임
    • concat 중복제거
      new Set 을 사용하여 let 변수 = new Set([[...배열1],[...배열2])
- spread 연산자 : (...배열명)
     let arr1 = [4,5,6]
     let arr2 = [1,2,...arr1,3] 
     console.log(arr2)  // [1,2,4,5,6,3]
  • arr.indexOf(element) : arr에서 element가 있는 첫 위치를 검색
  • arr.lastIndexOf(element) : arr에서 element가 있는 마지막 위치를 검색

문자열 split 함수

  • 문자열을 구분자(separator)로 나눠서 각각을 담은 배열을 반환하는 함수
Code 
var str="1,2,3,4,5";
arr = str.split(",");
결과
arr = ["1", "2", "3", "4", "5"];

map()

  • 모든 요소를 변환해줄때 사용 ( 원본 배열은 건들리지 않음 )
const array_num = [0,1,2,3,4,5];

// array_num 변수에 map을 사용함으로써 배열안에 숫자들을 array_item으로 받는다
const new_array = array_num.map((array_item) => {		
    console.log(array_item);
    console.log(array_item + 1);
    return array_item + 1;
})

filter()

  • 어떤 조건을 만족하는 항목들만 골라서 새 배열로 만들어줌 ( 원본 배열은 건들리지 않음 )
  • 요소를 바꿀수는 없지만 그 안에서의 조건을 만들어 걸러줄수 있음
const array_num = [0,1,2,3,4,5];

const new_array = array_num.filter((array_item) =>{		// 화살표 함수 사용
     return array_item > 3;		// 조건값
 });

Array.from()

  • 유사 객체를 배열로 만들어 주는 함수
console.log(Array.from('foo'));
// expected output: Array ["f", "o", "o"]

console.log(Array.from([1, 2, 3], x => x + x));
// expected output: Array [2, 4, 6]
profile
2022.05.09 START

0개의 댓글