JavaScript Array 내장 함수

Pansik·2022년 6월 24일
0

JavaScript - 정리

목록 보기
3/3

배열 내장 함수


forEach()

  • 배열의 각각의 요소를 하나하나씩 출력해 주는 내장 함수
const arr = [1, 2, 3, 4];

arr.forEach((elm) => {
    console.log(elm)
}); 

// 1
// 2
// 3
// 4

map()

  • 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환합니다.
  1. array 갯수만큼 코드를 실행해줍니다.
  2. 함수 파라미터는 array안에 있는 자료입니다.
  3. return은 array를 담아줍니다.
const arr = [1, 2, 3, 4];

const maps = arr.map((elm) => {
return elm * 2
});

console.log(maps);  // [2, 4, 6, 8];

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

const maps = arr.map(() => {
  return 123123
})

console.log(map) // [123123, 123123, 123123, 123123]


includes()

  • 메서드는 주어진 배열에서 전달받은 인자와 일치하는지 확인해 줍니다.

  • boolean 값으로 결과를 출력해 줍니다.

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

let number = 3;
let number2 = "3";

console.log(arr.includes(number));  // true
console.log(arr.includes(number2)); // false

findIndex()

  • 주어진 판별 함수를 만족하는 배열의 첫 번째 요소에 대한 인덱스를 반환합니다.

  • 값이 중복되어도 첫 번째 요소를 반환해 줍니다.

  • 전달받은 인자가 없으면 -1을 출력합니다.

const arr = [1, 2, 3, 4, 20, 40, 100, 200];

const find = (elm) => {
return elm > 30
});

console.log(arr.findIndex(find)) // 5

filter()

  • 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환해 줍니다.
const arr = [
{ num : 1, color: "red" },
{ num : 2, color: "black" },
{ num : 3, color: "blue" },
{ num : 4, color: "green" },
{ num : 5, color: "blue" }
];

console.log(arr.filter((elm) => {
return elm.color === "blue"
}));

// (2) [{...} {...}]
// 0: {num: 3, color: 'blue'}
// 1: {num: 5, color: 'blue'}

slice()

  • 배열의 bigin 부터 end 까지 (end는 미포함) 새로운 배열 형태로 반환해 줍니다.

  • 원본 배열은 바뀌지 않습니다.

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

console.log(arr.slice(2, 4))

// (2) [3, 4]

concat()

  • 인자로 주어진 배열이나 값들을 기존 배열에 합쳐서 새로운 배열로 반환합니다.

  • 기존 배열이 바뀌지 않습니다.

const arr = [1, 2, 3, 4, 5];
const brr = [6, 7, 8, 9];
const crr = arr.concat(brr)

console.log(crr);

// (9) [1, 2, 3, 4, 5, 6, 7, 8, 9];

sort()

  • 배열을 정리해주는 메서드 정렬 순서는 문자열의 유니코드 코드 포인트를 따릅니다.

  • 원본 배열을 변형을 됩니다.

const fruits = ["사과", "바나나", "체리", "수박", "참외"];

fruits.sort();

console.log(fruits);
// ["바나나", "사과", "수박", "참외", "체리"]

const number = [4, 500, 200, 2, 10, 1, 40];

number.sort();
console.log(number);
// [1, 10, 2, 200, 4, 40, 500] 문자열로 기준을 잡기 때문에 사전순으로 정리가 된겁니다.

const arr = (a , b) => {
    if(a > b) {
        return 1;
    } else if (a < b) {
        return -1;
    }
};

number.sort(arr);
console.log(arr);
// [1, 2, 4, 10, 40, 200, 500] if문을 써서 버블 정렬을 해줍니다.

join()

  • 배열의 모든 요소를 연결해 하나의 배열로 만들어 줍니다.
const arr = ["사과", "바나나", "맛있다", "존맛탱"];

console.log(arr.join(" "));

//  사과 바나나 맛있다 존맛탱
profile
JavaScript Learning

0개의 댓글