자바스크립트 배열 사용

2022. 6. 26. 19:23WEB.DEV

반응형

안녕하세요. 
이번 포스팅에서는 자바스크립트 배열 사용에 대해서 알아 보겠습니다.
아래에 있는 메소드 외에 또다른 메소드에 대해서 아시는 분이 있으시다면 댓글을 달아주시면 감사하겠습니다.

1. 배열에서 중복된 값 제거

const arr = [1, 2, 3, 2, 4, 1, 5];

// filter를 이용한 방법
const filterArr = arr.filter((item, idx) => {
  return arr.indexOf(item) === idx;
});
console.log(filterArr); // 1,2, 3, 4, 5

// Set을 이용한 방법
const filterArr = […new Set(arr)];
console.log(filterArr); // 1, 2, 3, 4, 5

2. 소수를 정수로 만들기

const num = 1436.88;
console.log(num); // 1436.88
console.log(num | 0); // 1436

3. 배열의 마지막 값 가져오기

const arr = [1, 3, 2, 8, 4, 6];
const lastItem = arr.slice(-1);
console.log(lastItem); // [6]

4. 배열에서 임의의 값 가져오기

const participants = [‘영수’, ‘철수’, ‘영희’];
const winner = participants[Math.floor(Math.random() * participants.length)];

5. 배열에서 가장 긴 값 가져오기

const fruits = [‘Apple’, ‘Banana’, ‘Orange’, ‘Mango’, ‘Pineapple’];
let mostLengthItem = ‘’;
fruits.forEach(fruit => {
  if(fruit.length > mostLengthItem.length) {
    mostLengthItem = fruit;
  }
});
console.log(mostLengthItem); // Pineapple

6. 배열 문자열로 변환하기

const arr = [‘a’, ‘b’, ‘c’, ‘d’];
console.log(arr.toString()); // a, b, c, d

7. 배열 요소 특정 문자로 붙이기

const arr = [‘play’, ‘stop’, ‘pause’, ‘skip’];
console.log(arr.join(‘|’); // play|stop|pause|skip

8. 배열 첫번째 요소 제거하기

const arr = [1, 2, 3, 4, 5];
console.log(arr.shift()); // [2, 3, 4, 5]

9. 배열 마지막 요소 제거하기

const arr = [1, 2, 3, 4, 5];
console.log(arr.pop()); // [1, 2, 3, 4]

10. 두 배열 합치기

const arr1 = [1, 2, 3, 4, 5];
const arr2 = [‘a’, ‘b’, ‘c’, ‘d’, ‘e’];

// concat 이용
console.log(arr1.concat(arr2)); // [1, 2, 3, 4, 5, ‘a’, ‘b’, ‘c’, ‘d’, ‘e’]

// 확산 연산 이용
console.log([…arr1, …arr2]); // 1, 2, 3, 4, 5, ‘a’, ‘b’, ‘c’, ‘d’, ‘e’

11. 제일 앞에 새로운 요소 추가하기

const arr = [2, 3, 4, 5];

// unshift 이용하는 방법
console.log(arr.unshift(1)); // [1, 2, 3, 4, 5]

// split 이용하는 방법
console.log(arr.split(0, 0, 1)); // [1, 2, 3, 4, 5]

12. 제일 뒤에 새로운 요소 추가하기

const arr = [1, 2, 3, 4];

// push 이용하는 방법
console.log(arr.push(5)); // [1, 2, 3, 4, 5]

// split 이용하는 방법
console.log(arr.split(arr.length - 1, 0, 5)); // [1, 2, 3, 4, 5]

13. 배열의 특정 위치 요소를 제거하고 요소 추가하기

const arr = [1, 2, 3, 4, 5];
console.log(arr.split(2, 2, 10)); // [1, 2, 10, 5]

14. 배열 정렬하기

const arr = [‘b’, ‘c’, ‘a’, ‘f’, ‘e’];

// 오름차순 정렬
console.log(arr.sort()); // [‘a’, ‘b’, ‘c’, ‘e’, ‘f’]

const numArr = [1, 5, 4, 6, 2, 3];

// 오름차순 정렬
console.log(numArr.sort((a, b) => a - b)); // [1, 2, 3, 4, 5, 6]
// 내림차순 정렬
console.log(numArr.sort((a, b) => b - a)); // [6, 5, 4, 3, 2, 1]

15. 배열 안에 특정 위치의 요소 제거하기

// delete를 이용한 방법(사용하면 피를 볼수 있...)
const arr = [1, 2, 3, 4, 5];
console.log(arr.length); // 5
delete arr[3]; // return true
console.log(arr.length); // 5
console.log(arr); // [1, 2, 3, empty, 5]

// splice 이용한 방법
console.log(arr.length); // 5
arr.splice(3, 1); // return [4]
console.log(arr.length); // 4
console.log(arr); // [1, 2, 3, 5];

16. 배열 안에 존재하는 거짓된 값 제거하기

const arr = ['test', '', undefined, false, 'Max', 0, 'a', NaN, 123, null];

// filter와 함수를 이용한 방법
const filteredArr1 = arr.filter(function(val) {
  if(val) {
    return val;
  }
});
console.log(filteredArr1); // ['test', 'Max', 'a', 123]

// filter와 화살표 함수를 이용한 방법
const filteredArr2 = arr.filter(val => !!val);
console.log(filteredArr2); // ['test', 'Max', 'a', 123]

// filter와 Boolean을 이용한 방법
const filteredArr3 = arr.filter(Boolean);
console.log(filteredArr2); // ['test', 'Max', 'a', 123]

 

여기까지 부족한 글 읽어 주셔서 감사합니다💛

728x90
반응형